Merge commit 'cd3a32e55503dc1e6b9873d812dd401bf7d51045' into context-menu-vertical

front/src/modules/companies/table/components/CompanyTable.tsx

@@ -8,11 +8,14 @@ import { turnFilterIntoWhereClause } from '@/ui/filter-n-sort/utils/turnFilterIn
 import { IconList } from '@/ui/icon';
 import { EntityTable } from '@/ui/table/components/EntityTable';
 import { GenericEntityTableData } from '@/ui/table/components/GenericEntityTableData';
+import { useUpsertEntityTableItem } from '@/ui/table/hooks/useUpsertEntityTableItem';
 import { TableContext } from '@/ui/table/states/TableContext';
 import { useRecoilScopedValue } from '@/ui/utilities/recoil-scope/hooks/useRecoilScopedValue';
+import { useTableViewFields } from '@/views/hooks/useTableViewFields';
 import { useViewSorts } from '@/views/hooks/useViewSorts';
 import { currentViewIdState } from '@/views/states/currentViewIdState';
 import {
+  UpdateOneCompanyMutationVariables,
   useGetCompaniesQuery,
   useUpdateOneCompanyMutation,
 } from '~/generated/graphql';
@@ -24,6 +27,13 @@ import { defaultOrderBy } from '../../queries';
 export function CompanyTable() {
   const currentViewId = useRecoilValue(currentViewIdState);
   const orderBy = useRecoilScopedValue(sortsOrderByScopedState, TableContext);
+  const [updateEntityMutation] = useUpdateOneCompanyMutation();
+  const upsertEntityTableItem = useUpsertEntityTableItem();
+
+  const { handleColumnsChange } = useTableViewFields({
+    objectName: 'company',
+    viewFieldDefinitions: companyViewFields,
+  });
   const { updateSorts } = useViewSorts({
     availableSorts,
     Context: TableContext,
@@ -38,20 +48,33 @@ export function CompanyTable() {
   return (
     <>
       <GenericEntityTableData
-        objectName="company"
         getRequestResultKey="companies"
         useGetRequest={useGetCompaniesQuery}
         orderBy={orderBy.length ? orderBy : defaultOrderBy}
         whereFilters={whereFilters}
-        viewFieldDefinitions={companyViewFields}
         filterDefinitionArray={companiesFilters}
       />
       <EntityTable
         viewName="All Companies"
         viewIcon={<IconList size={16} />}
         availableSorts={availableSorts}
+        onColumnsChange={handleColumnsChange}
         onSortsUpdate={currentViewId ? updateSorts : undefined}
-        useUpdateEntityMutation={useUpdateOneCompanyMutation}
+        updateEntityMutation={({
+          variables,
+        }: {
+          variables: UpdateOneCompanyMutationVariables;
+        }) =>
+          updateEntityMutation({
+            variables,
+            onCompleted: (data) => {
+              if (!data.updateOneCompany) {
+                return;
+              }
+              upsertEntityTableItem(data.updateOneCompany);
+            },
+          })
+        }
       />
     </>
   );

front/src/modules/companies/table/components/CompanyTableMockData.tsx

@@ -2,32 +2,21 @@ import { useEffect } from 'react';
 import { useSetRecoilState } from 'recoil';
 
 import { useSetEntityTableData } from '@/ui/table/hooks/useSetEntityTableData';
-import { entityTableDimensionsState } from '@/ui/table/states/entityTableDimensionsState';
-import { viewFieldsState } from '@/ui/table/states/viewFieldsState';
+import { tableColumnsState } from '@/ui/table/states/tableColumnsState';
 
 import { companyViewFields } from '../../constants/companyViewFields';
 
 import { mockedCompaniesData } from './companies-mock-data';
 
 export function CompanyTableMockData() {
-  const setEntityTableDimensions = useSetRecoilState(
-    entityTableDimensionsState,
-  );
-  const setViewFieldsState = useSetRecoilState(viewFieldsState);
+  const setColumns = useSetRecoilState(tableColumnsState);
   const setEntityTableData = useSetEntityTableData();
 
   setEntityTableData(mockedCompaniesData, []);
 
   useEffect(() => {
-    setViewFieldsState({
-      objectName: 'company',
-      viewFields: companyViewFields,
-    });
-    setEntityTableDimensions((prevState) => ({
-      ...prevState,
-      numberOfColumns: companyViewFields.length,
-    }));
-  }, [setEntityTableDimensions, setViewFieldsState]);
+    setColumns(companyViewFields);
+  }, [setColumns]);
 
   return <></>;
 }

front/src/modules/companies/table/components/CompanyTableMockMode.tsx

@@ -13,7 +13,7 @@ export function CompanyTableMockMode() {
         viewName="All Companies"
         viewIcon={<IconList size={16} />}
         availableSorts={availableSorts}
-        useUpdateEntityMutation={useUpdateOneCompanyMutation}
+        updateEntityMutation={[useUpdateOneCompanyMutation()]}
       />
     </>
   );