feat: add mock create/delete to UserPacksContext

glzr-io · Feb 9, 2025 · 9643b35 · 9643b35
1 parent 10123ff
commit 9643b35
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 32 deletions.
diff --git a/...common/desktop/UserWidgetPacksContext.tsx → ...i/src/common/desktop/UserPacksContext.tsx b/...common/desktop/UserWidgetPacksContext.tsx → ...i/src/common/desktop/UserPacksContext.tsx
@@ -58,11 +58,17 @@ export type WidgetPack = {
   tags: string[];
 };
 
+export type CreateWidgetPackForm = {
+  name: string;
+};
+
 type UserPacksContextState = {
   communityPacks: Resource<WidgetPack[]>;
   localPacks: Resource<WidgetPack[]>;
   widgetConfigs: Resource<Record<string, WidgetConfig>>;
   widgetStates: Resource<Record<string, Widget>>;
+  createPack: (pack: CreateWidgetPackForm) => void;
+  deletePack: (packId: string) => void;
   updateWidgetConfig: (
     configPath: string,
     newConfig: WidgetConfig,
@@ -146,13 +152,23 @@ export function UserPacksProvider(props: { children: JSX.Element }) {
     }
   }
 
+  async function createPack(pack: CreateWidgetPackForm) {
+    // TODO
+  }
+
+  async function deletePack(packId: string) {
+    // TODO
+  }
+
   const store: UserPacksContextState = {
     communityPacks,
     localPacks,
     widgetConfigs,
     widgetStates,
     updateWidgetConfig,
     togglePreset,
+    createPack,
+    deletePack,
   };
 
   return (

diff --git a/packages/settings-ui/src/common/index.ts b/packages/settings-ui/src/common/index.ts
@@ -1,4 +1,4 @@
-export * from './desktop/UserWidgetPacksContext';
+export * from './desktop/UserPacksContext';
 export * from './layout/AppLayout';
 export * from './layout/Sidebar';
 export * from './layout/SidebarItem';
diff --git a/packages/settings-ui/src/common/layout/Sidebar.tsx b/packages/settings-ui/src/common/layout/Sidebar.tsx
@@ -8,7 +8,7 @@ import {
 } from '@tabler/icons-solidjs';
 
 import { SidebarItem } from './SidebarItem';
-import { useUserPacks } from '../desktop/UserWidgetPacksContext';
+import { useUserPacks } from '~/common';
 
 export interface SidebarProps {
   initialSize: number;

diff --git a/packages/settings-ui/src/user-packs/WidgetPacks.tsx b/packages/settings-ui/src/user-packs/WidgetPacks.tsx
@@ -12,28 +12,10 @@ import { For } from 'solid-js';
 
 import { useUserPacks } from '~/common';
 import { WidgetPackCard } from './WidgetPackCard';
-import {
-  CreateWidgetPackDialog,
-  CreateWidgetPackForm,
-} from './dialogs/CreateWidgetPackDialog';
+import { CreateWidgetPackDialog } from './dialogs/CreateWidgetPackDialog';
 
 export function WidgetPacks() {
-  const {
-    widgetConfigs,
-    widgetStates,
-    updateWidgetConfig,
-    togglePreset,
-    communityPacks,
-    localPacks,
-  } = useUserPacks();
-
-  function handleDeletePack(packId: string) {
-    // TODO
-  }
-
-  function handleCreatePack(pack: CreateWidgetPackForm) {
-    // TODO
-  }
+  const userPacks = useUserPacks();
 
   return (
     <div class="container mx-auto p-6">
@@ -47,7 +29,7 @@ export function WidgetPacks() {
                 Create New Pack
               </Button>
             </DialogTrigger>
-            <CreateWidgetPackDialog onSubmit={handleCreatePack} />
+            <CreateWidgetPackDialog onSubmit={userPacks.createPack} />
           </Dialog>
 
           <Button variant="outline">
@@ -60,32 +42,32 @@ export function WidgetPacks() {
       <Tabs defaultValue="installed" class="w-full">
         <TabsList>
           <TabsTrigger value="installed">
-            Installed ({communityPacks.length})
+            Installed ({userPacks.communityPacks()?.length})
           </TabsTrigger>
           <TabsTrigger value="local">
-            Local ({localPacks.length})
+            Local ({userPacks.localPacks()?.length})
           </TabsTrigger>
         </TabsList>
 
         <TabsContent value="installed" class="mt-6">
-          <For each={communityPacks()}>
+          <For each={userPacks.communityPacks()}>
             {pack => (
               <WidgetPackCard
                 pack={pack}
                 isLocal={false}
-                onDelete={handleDeletePack}
+                onDelete={userPacks.deletePack}
               />
             )}
           </For>
         </TabsContent>
 
         <TabsContent value="local" class="mt-6">
-          <For each={localPacks()}>
+          <For each={userPacks.localPacks()}>
             {pack => (
               <WidgetPackCard
                 pack={pack}
                 isLocal={true}
-                onDelete={handleDeletePack}
+                onDelete={userPacks.deletePack}
               />
             )}
           </For>

diff --git a/packages/settings-ui/src/user-packs/dialogs/CreateWidgetPackDialog.tsx b/packages/settings-ui/src/user-packs/dialogs/CreateWidgetPackDialog.tsx
@@ -10,9 +10,7 @@ import {
 } from '@glzr/components';
 import { createForm, Field } from 'smorf';
 
-export type CreateWidgetPackForm = {
-  name: string;
-};
+import { CreateWidgetPackForm } from '~/common';
 
 export interface CreateWidgetPackDialogProps {
   onSubmit: (pack: CreateWidgetPackForm) => void;