♻️ null args handling in grist hooks

Author: Clemsazert

src/frontend/apps/impress/src/features/docs/doc-editor/components/DatabaseSourceSelector.tsx

@@ -8,12 +8,34 @@ type DatabaseSourceSelectorProps = {
   onSourceSelected: (args: { documentId: string; tableId: string }) => void;
 };
 
+const TableSelector = ({
+  documentId,
+  onSourceSelected,
+}: { documentId: number } & DatabaseSourceSelectorProps) => {
+  const { tables } = useListGristTables(documentId);
+  return tables ? (
+    <DropdownMenu
+      options={tables.map(({ id }) => ({
+        label: id,
+        value: id,
+        callback: () => onSourceSelected({ documentId, tableId: id }),
+      }))}
+      showArrow
+    >
+      <Text>Sélectionner une table Grist existante</Text>
+    </DropdownMenu>
+  ) : (
+    <Box>
+      <Text>No tables available</Text>
+    </Box>
+  );
+};
+
 export const DatabaseSourceSelector = ({
   onSourceSelected,
 }: DatabaseSourceSelectorProps) => {
   const [selectedDoc, setSelectedDoc] = useState<Doc>();
   const { docs } = useListGristDocs();
-  const { tables } = useListGristTables(selectedDoc?.id);
 
   return (
     <Box>
@@ -27,18 +49,11 @@ export const DatabaseSourceSelector = ({
       >
         <Text>{selectedDoc?.name ?? 'Sélectionner un document Grist'}</Text>
       </DropdownMenu>
-      {selectedDoc && tables && (
-        <DropdownMenu
-          options={tables.map(({ id }) => ({
-            label: id,
-            value: id,
-            callback: () =>
-              onSourceSelected({ documentId: selectedDoc.id, tableId: id }),
-          }))}
-          showArrow
-        >
-          <Text>Sélectionner une table Grist existante</Text>
-        </DropdownMenu>
+      {selectedDoc && (
+        <TableSelector
+          documentId={selectedDoc.id}
+          onSourceSelected={onSourceSelected}
+        />
       )}
     </Box>
   );

src/frontend/apps/impress/src/features/grist/index.ts

@@ -1,3 +1,3 @@
-export * from './useGristTable';
+export * from './useGristTableData';
 export * from './useListGristDocs';
 export * from './useListGristTables';

src/frontend/apps/impress/src/features/grist/useGristTable.ts

@@ -19,7 +19,7 @@ export const useGristTableData = ({
       const response = await gristFetchApi(url);
       if (!response.ok) {
         throw new APIError(
-          'Failed to request ai transform',
+          'Failed to fetch Grist table data',
           await errorCauses(response),
         );
       }

src/frontend/apps/impress/src/features/grist/useGristTableData.ts

@@ -43,7 +43,7 @@ export const useListGristDocs = (): { docs: Doc[] } => {
     const response = await gristFetchApi(url);
     if (!response.ok) {
       throw new APIError(
-        'Failed to request ai transform',
+        'Failed to fetch Grist documents',
         await errorCauses(response),
       );
     }

src/frontend/apps/impress/src/features/grist/useListGristDocs.ts

@@ -17,16 +17,12 @@ export interface Fields {
 }
 
 export const useListGristTables = (
-  documentId?: number,
-): { tables: Table[] | null } => {
-  const [tables, setTables] = useState<Table[] | null>(null);
+  documentId: number,
+): { tables: Table[] | undefined } => {
+  const [tables, setTables] = useState<Table[]>();
 
   useEffect(() => {
     const fetchTables = async () => {
-      if (!documentId) {
-        console.warn('Document ID is required to fetch Grist tables');
-        return;
-      }
       const url = `docs/${documentId}/tables`;
       const response = await gristFetchApi(url);
       if (!response.ok) {
@@ -37,6 +33,7 @@ export const useListGristTables = (
       }
       return (await response.json()) as Promise<TableDescription>;
     };
+
     fetchTables()
       .then((response) => {
         if (response) {