fix: fix server fetching of material list in product form

gatherloop · Oct 28, 2024 · d6f1be4 · d6f1be4
1 parent a4bb61a
commit d6f1be4
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 14 deletions.
diff --git a/libs/ui/src/app/ProductCreateScreen.tsx b/libs/ui/src/app/ProductCreateScreen.tsx
@@ -1,5 +1,10 @@
 // eslint-disable-next-line @nx/enforce-module-boundaries
-import { categoryList, categoryListQueryKey } from '../../../api-contract/src';
+import {
+  categoryList,
+  categoryListQueryKey,
+  materialList,
+  materialListQueryKey,
+} from '../../../api-contract/src';
 import {
   OpenAPICategoryRepository,
   OpenAPIMaterialRepository,
@@ -20,10 +25,29 @@ import {
 
 export async function getProductCreateScreenDehydratedState(): Promise<DehydratedState> {
   const queryClient = new QueryClient();
-  await queryClient.prefetchQuery({
-    queryKey: categoryListQueryKey(),
-    queryFn: () => categoryList(),
-  });
+  await Promise.all([
+    queryClient.prefetchQuery({
+      queryKey: categoryListQueryKey(),
+      queryFn: () => categoryList(),
+    }),
+    queryClient.prefetchQuery({
+      queryKey: materialListQueryKey({
+        limit: 8,
+        skip: 0,
+        order: 'desc',
+        sortBy: 'created_at',
+        query: '',
+      }),
+      queryFn: () =>
+        materialList({
+          limit: 8,
+          skip: 0,
+          order: 'desc',
+          sortBy: 'created_at',
+          query: '',
+        }),
+    }),
+  ]);
 
   return dehydrate(queryClient);
 }

diff --git a/libs/ui/src/app/ProductUpdateScreen.tsx b/libs/ui/src/app/ProductUpdateScreen.tsx
@@ -3,6 +3,8 @@ import { createParam } from 'solito';
 import {
   categoryList,
   categoryListQueryKey,
+  materialList,
+  materialListQueryKey,
   productFindById,
   productFindByIdQueryKey,
 } from '../../../api-contract/src';
@@ -38,6 +40,23 @@ export async function getProductUpdateScreenDehydratedState(
       queryKey: categoryListQueryKey(),
       queryFn: () => categoryList(),
     }),
+    queryClient.prefetchQuery({
+      queryKey: materialListQueryKey({
+        limit: 8,
+        skip: 0,
+        order: 'desc',
+        sortBy: 'created_at',
+        query: '',
+      }),
+      queryFn: () =>
+        materialList({
+          limit: 8,
+          skip: 0,
+          order: 'desc',
+          sortBy: 'created_at',
+          query: '',
+        }),
+    }),
   ]);
 
   return dehydrate(queryClient);

diff --git a/libs/ui/src/data/openApi/material.ts b/libs/ui/src/data/openApi/material.ts
@@ -97,13 +97,6 @@ export class OpenAPIMaterialRepository implements MaterialRepository {
     this.client.removeQueries({ queryKey: materialListQueryKey(params) });
 
     return {
-      type: res?.data ? 'loaded' : 'idle',
-      page: 1,
-      itemPerPage: 8,
-      query: '',
-      sortBy: 'created_at',
-      orderBy: 'desc',
-      errorMessage: null,
       materials: res?.data.map(transformers.material) ?? [],
       totalItem: res?.meta.total ?? 0,
     };

diff --git a/libs/ui/src/presentation/controllers/MaterialListController.tsx b/libs/ui/src/presentation/controllers/MaterialListController.tsx
@@ -12,7 +12,6 @@ const Context = createContext<ContextValue>(null);
 
 export const useMaterialListController = () => {
   const materialListController = useContext(Context);
-  console.log('materialListController', materialListController);
   if (materialListController === null) {
     throw new Error('useMaterialListController is called outside provider');
   }
@@ -30,6 +29,5 @@ export const MaterialListProvider = ({
   usecase,
 }: MaterialListProviderProps) => {
   const controller = useController(usecase);
-  console.log('controller', controller);
   return <Context.Provider value={controller}>{children}</Context.Provider>;
 };