dashboard include

resources/js/views/Admin/Users/UserTabs/UserSubscription.vue

@@ -1,6 +1,7 @@
 <template>
-    <PageTab class="form-fixed-width" :is-loading="isLoading">
+    <PageTab :is-loading="isLoading" class="form-fixed-width">
         <PageTabGroup v-if="subscription">
+            <FormLabel>Subscription Plan</FormLabel>
 
             <!--Info about active subscription-->
             <div v-if="! subscription.canceled" class="state active">
@@ -24,7 +25,9 @@
             </div>
         </PageTabGroup>
         <PageTabGroup v-if="! subscription">
-            User don't have any subscription yet.
+            <InfoBox>
+                <p>User don't have any subscription yet.</p>
+            </InfoBox>
         </PageTabGroup>
     </PageTab>
 </template>
@@ -33,8 +36,10 @@
     import DatatableWrapper from '@/components/Others/Tables/DatatableWrapper'
     import PageTabGroup from '@/components/Others/Layout/PageTabGroup'
     import ListInfoItem from '@/components/Others/ListInfoItem'
+    import FormLabel from '@/components/Others/Forms/FormLabel'
     import ButtonBase from '@/components/FilesView/ButtonBase'
     import PageTab from '@/components/Others/Layout/PageTab'
+    import InfoBox from '@/components/Others/Forms/InfoBox'
     import ListInfo from '@/components/Others/ListInfo'
     import {ExternalLinkIcon} from "vue-feather-icons"
     import {mapGetters} from 'vuex'
@@ -49,7 +54,9 @@
             ListInfoItem,
             PageTabGroup,
             ButtonBase,
+            FormLabel,
             ListInfo,
+            InfoBox,
             PageTab,
         },
         computed: {