feat: redo settings and all org pages. (#601)

* feat: new components, deploy storybook

* refactor: simplify component field definitions and enhance button loading state

- Removed unnecessary type imports and simplified the FIELDS array definitions across multiple components in Storybook.
- Updated button component to use a loading state instead of isLoading, improving clarity and consistency in props.
- Adjusted button stories to reflect the new loading prop and enhanced the button's loading visual feedback.
- Minor CSS adjustments for better layout and styling consistency.

* chore: add field, card, password components

* feat: improve page component & update AuthUI path

* chore: update bits-ui to version 2.14.4 and all org related UI's

- Updated bits-ui dependency in pnpm-lock.yaml and package.json to version 2.14.4.
- Refactored imports for RoleBasedSecurity and UpgradeBanner components to use the new ui feature directory.
- Removed unused Course components and related files to clean up the codebase.
- Enhanced various components to improve consistency and maintainability.

* chore: move all setting buttons to the top and update auth ui styles

* chore: remove svelte-loading-spinners and replace with @cio/ui/base/spinner

- Removed all instances of svelte-loading-spinners from the project.
- Updated components to use the new Spinner from @cio/ui/base/spinner.
- Cleaned up pnpm-lock.yaml and package.json to reflect the removal of svelte-loading-spinners.
- Added new CSS animations for rocket launch effects in app.css.
- Enhanced email change flow with updated verification messages in translations.

* chore: remove supabase file upload from dashboard and move to r2

* chore: update organization API and UI components

- Added new API methods for organization plan operations and team management.
- Introduced middleware for API key authentication and organization admin checks.
- Refactored organization-related components to utilize the new API structure.
- Updated various UI components to improve consistency and maintainability.
- Enhanced error handling and validation for organization-related actions.
- Removed deprecated services and streamlined the codebase.

apps/dashboard/src/lib/features/ui/navigation/app-header.svelte

@@ -6,10 +6,21 @@
   import * as Popover from '@cio/ui/base/popover';
   import Search from '../search.svelte';
   import AppBreadcrumbs from './app-breadcrumbs.svelte';
+  import RefreshCcwIcon from '@lucide/svelte/icons/refresh-ccw';
+  import * as Empty from '@cio/ui/base/empty';
+  import { currentOrg } from '$lib/utils/store/org';
+  import { setupProgressApi } from '$lib/features/setup/api/setup-progress.svelte';
+  import AppSetup from './app-setup.svelte';
+
+  $effect(() => {
+    if ($currentOrg.siteName) {
+      setupProgressApi.fetchSetupProgress($currentOrg.siteName);
+    }
+  });
 </script>
 
 <header
-  class="group-has-data-[collapsible=icon]/sidebar-wrapper:h-8 border-border flex h-12 w-full shrink-0 items-center gap-2 border-b transition-[width,height] ease-linear"
+  class="group-has-data-[collapsible=icon]/sidebar-wrapper:h-8 border-border ui:bg-background bg-background sticky top-0 z-50 flex h-12 w-full shrink-0 items-center gap-2 border-b transition-[width,height] ease-linear"
 >
   <div class="flex w-full items-center gap-2 px-4">
     <Sidebar.Trigger />
@@ -22,6 +33,8 @@
 
     <span class="grow"></span>
 
+    <AppSetup />
+
     <Search />
 
     <Popover.Root>
@@ -31,11 +44,21 @@
         </Button>
       </Popover.Trigger>
       <Popover.Content>
-        <div class="flex flex-col gap-2">
-          <div class="flex items-center justify-between gap-2">
-            <p class="text-sm">Your notifications will show here</p>
-          </div>
-        </div>
+        <Empty.Root class="ui:from-muted/50 ui:to-background ui:h-full ui:bg-gradient-to-b ui:from-30%">
+          <Empty.Header>
+            <Empty.Media variant="icon">
+              <BellIcon />
+            </Empty.Media>
+            <Empty.Title>No Notifications</Empty.Title>
+            <Empty.Description>You're all caught up. New notifications will appear here.</Empty.Description>
+          </Empty.Header>
+          <Empty.Content>
+            <Button variant="outline" size="sm">
+              <RefreshCcwIcon />
+              Refresh
+            </Button>
+          </Empty.Content>
+        </Empty.Root>
       </Popover.Content>
     </Popover.Root>
   </div>