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/setup/components/setup-progress.svelte

@@ -0,0 +1,53 @@
+<script lang="ts">
+  import { calculateProgress, setupProgressApi } from '../api/setup-progress.svelte';
+  import type { SetupItem } from '../api/setup-progress.svelte';
+  import { Skeleton } from '@cio/ui/base/skeleton';
+
+  let { setupItems, size = 'default' } = $props<{
+    setupItems?: SetupItem[];
+    size?: 'small' | 'default';
+  }>();
+
+  const effectiveSetupItems = $derived(setupItems ?? setupProgressApi.progress.setup ?? []);
+  const progressPercentage = $derived(calculateProgress(effectiveSetupItems));
+  const isLoading = $derived(setupProgressApi.isLoading);
+  const sizeClass = $derived(size === 'small' ? 'size-10' : 'size-14');
+</script>
+
+<div class="relative shrink-0">
+  {#if isLoading}
+    <!-- Loading skeleton - round circle -->
+    <Skeleton class="{sizeClass} rounded-full" />
+  {:else}
+    <svg class="{sizeClass} -rotate-90" viewBox="0 0 100 100">
+      <!-- Background circle -->
+      <circle
+        cx="50"
+        cy="50"
+        r="45"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="8"
+        class="text-gray-200 dark:text-gray-700"
+      />
+      <!-- Progress circle -->
+      <circle
+        cx="50"
+        cy="50"
+        r="45"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="8"
+        stroke-linecap="round"
+        class="text-green-600"
+        stroke-dasharray={2 * Math.PI * 45}
+        stroke-dashoffset={2 * Math.PI * 45 * (1 - progressPercentage / 100)}
+        style="transition: stroke-dashoffset 0.5s ease-in-out;"
+      />
+    </svg>
+    <!-- Center text -->
+    <div class="absolute inset-0 flex flex-col items-center justify-center">
+      <p class="{size === 'small' ? 'text-[10px]' : 'text-sm'} font-bold">{progressPercentage}%</p>
+    </div>
+  {/if}
+</div>