refactor to shadcn components, dynamically load extension frontend

add jetstream permissions, add dynamic inertia module loading, add shadcn components, change modals and dropdowns to shadcn dismissable layer,

resources/js/Pages/Projects.vue

@@ -35,10 +35,6 @@ const { organization } = storeToRefs(useOrganizationStore());
 
 const activeTab = ref<'active' | 'archived'>('active');
 
-function isActiveTab(tab: string) {
-    return activeTab.value === tab;
-}
-
 const { projects } = storeToRefs(useProjectsStore());
 
 const shownProjects = computed(() => {
@@ -74,17 +70,16 @@ const showBillableRate = computed(() => {
             class="py-3 sm:py-5 border-b border-default-background-separator flex justify-between items-center">
             <div class="flex items-center space-x-3 sm:space-x-6">
                 <PageTitle :icon="FolderIcon" title="Projects"></PageTitle>
-                <TabBar>
+                <TabBar
+                v-model="activeTab"
+                >
                     <TabBarItem
-                        :active="isActiveTab('active')"
-                        @click="activeTab = 'active'"
+                        value="active"
                         >Active</TabBarItem
                     >
                     <TabBarItem
-                        :active="isActiveTab('archived')"
-                        @click="activeTab = 'archived'">
-                        Archived
-                    </TabBarItem>
+                        value="archived"
+                        >Archived</TabBarItem>
                 </TabBar>
             </div>
             <SecondaryButton