Added metadata creation (#2086)

* Reworked metadata creation

* Fix from PR

* Removed consolelog

front/src/App.tsx

@@ -63,8 +63,8 @@ export const App = () => {
             path={AppPath.ObjectTablePage}
             element={
               <ObjectTablePage
-                objectName="supplier"
+                objectNamePlural="suppliers"
-                objectNameSingular="Supplier"
+                objectNameSingular="supplier"
               />
             }
           />

front/src/generated-metadata/gql.ts

@@ -15,7 +15,7 @@ import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/
 const documents = {
     "\n  mutation CreateOneObject($input: CreateOneObjectInput!) {\n    createOneObject(input: $input) {\n      id\n    }\n  }\n": types.CreateOneObjectDocument,
     "\n  mutation CreateOneField($input: CreateOneFieldInput!) {\n    createOneField(input: $input) {\n      id\n      type\n      name\n      label\n      description\n      icon\n      placeholder\n      isCustom\n      isActive\n      isNullable\n      createdAt\n      updatedAt\n    }\n  }\n": types.CreateOneFieldDocument,
-    "\n  query Objects {\n    objects(paging: { first: 100 }) {\n      edges {\n        node {\n          id\n          dataSourceId\n          nameSingular\n          namePlural\n          labelSingular\n          labelPlural\n          description\n          icon\n          isCustom\n          isActive\n          createdAt\n          updatedAt\n          fields(paging: { first: 100 }) {\n            edges {\n              node {\n                id\n                type\n                name\n                label\n                description\n                icon\n                placeholder\n                isCustom\n                isActive\n                isNullable\n                createdAt\n                updatedAt\n              }\n            }\n            pageInfo {\n              hasNextPage\n              hasPreviousPage\n              startCursor\n              endCursor\n            }\n            totalCount\n          }\n        }\n      }\n      pageInfo {\n        hasNextPage\n        hasPreviousPage\n        startCursor\n        endCursor\n      }\n      totalCount\n    }\n  }\n": types.ObjectsDocument,
+    "\n  query MetadataObjects {\n    objects {\n      edges {\n        node {\n          id\n          dataSourceId\n          nameSingular\n          namePlural\n          labelSingular\n          labelPlural\n          description\n          icon\n          isCustom\n          isActive\n          createdAt\n          updatedAt\n          fields {\n            edges {\n              node {\n                id\n                type\n                name\n                label\n                description\n                icon\n                placeholder\n                isCustom\n                isActive\n                isNullable\n                createdAt\n                updatedAt\n              }\n            }\n            pageInfo {\n              hasNextPage\n              hasPreviousPage\n              startCursor\n              endCursor\n            }\n            totalCount\n          }\n        }\n      }\n      pageInfo {\n        hasNextPage\n        hasPreviousPage\n        startCursor\n        endCursor\n      }\n      totalCount\n    }\n  }\n": types.MetadataObjectsDocument,
 };
 
 /**
@@ -43,7 +43,7 @@ export function graphql(source: "\n  mutation CreateOneField($input: CreateOneFi
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
-export function graphql(source: "\n  query Objects {\n    objects(paging: { first: 100 }) {\n      edges {\n        node {\n          id\n          dataSourceId\n          nameSingular\n          namePlural\n          labelSingular\n          labelPlural\n          description\n          icon\n          isCustom\n          isActive\n          createdAt\n          updatedAt\n          fields(paging: { first: 100 }) {\n            edges {\n              node {\n                id\n                type\n                name\n                label\n                description\n                icon\n                placeholder\n                isCustom\n                isActive\n                isNullable\n                createdAt\n                updatedAt\n              }\n            }\n            pageInfo {\n              hasNextPage\n              hasPreviousPage\n              startCursor\n              endCursor\n            }\n            totalCount\n          }\n        }\n      }\n      pageInfo {\n        hasNextPage\n        hasPreviousPage\n        startCursor\n        endCursor\n      }\n      totalCount\n    }\n  }\n"): (typeof documents)["\n  query Objects {\n    objects(paging: { first: 100 }) {\n      edges {\n        node {\n          id\n          dataSourceId\n          nameSingular\n          namePlural\n          labelSingular\n          labelPlural\n          description\n          icon\n          isCustom\n          isActive\n          createdAt\n          updatedAt\n          fields(paging: { first: 100 }) {\n            edges {\n              node {\n                id\n                type\n                name\n                label\n                description\n                icon\n                placeholder\n                isCustom\n                isActive\n                isNullable\n                createdAt\n                updatedAt\n              }\n            }\n            pageInfo {\n              hasNextPage\n              hasPreviousPage\n              startCursor\n              endCursor\n            }\n            totalCount\n          }\n        }\n      }\n      pageInfo {\n        hasNextPage\n        hasPreviousPage\n        startCursor\n        endCursor\n      }\n      totalCount\n    }\n  }\n"];
+export function graphql(source: "\n  query MetadataObjects {\n    objects {\n      edges {\n        node {\n          id\n          dataSourceId\n          nameSingular\n          namePlural\n          labelSingular\n          labelPlural\n          description\n          icon\n          isCustom\n          isActive\n          createdAt\n          updatedAt\n          fields {\n            edges {\n              node {\n                id\n                type\n                name\n                label\n                description\n                icon\n                placeholder\n                isCustom\n                isActive\n                isNullable\n                createdAt\n                updatedAt\n              }\n            }\n            pageInfo {\n              hasNextPage\n              hasPreviousPage\n              startCursor\n              endCursor\n            }\n            totalCount\n          }\n        }\n      }\n      pageInfo {\n        hasNextPage\n        hasPreviousPage\n        startCursor\n        endCursor\n      }\n      totalCount\n    }\n  }\n"): (typeof documents)["\n  query MetadataObjects {\n    objects {\n      edges {\n        node {\n          id\n          dataSourceId\n          nameSingular\n          namePlural\n          labelSingular\n          labelPlural\n          description\n          icon\n          isCustom\n          isActive\n          createdAt\n          updatedAt\n          fields {\n            edges {\n              node {\n                id\n                type\n                name\n                label\n                description\n                icon\n                placeholder\n                isCustom\n                isActive\n                isNullable\n                createdAt\n                updatedAt\n              }\n            }\n            pageInfo {\n              hasNextPage\n              hasPreviousPage\n              startCursor\n              endCursor\n            }\n            totalCount\n          }\n        }\n      }\n      pageInfo {\n        hasNextPage\n        hasPreviousPage\n        startCursor\n        endCursor\n      }\n      totalCount\n    }\n  }\n"];
 
 export function graphql(source: string) {
   return (documents as any)[source] ?? {};

front/src/generated-metadata/graphql.ts

@@ -876,12 +876,12 @@ export type CreateOneFieldMutationVariables = Exact<{
 
 export type CreateOneFieldMutation = { __typename?: 'Mutation', createOneField: { __typename?: 'field', id: string, type: string, name: string, label: string, description?: string | null, icon?: string | null, placeholder?: string | null, isCustom: boolean, isActive: boolean, isNullable: boolean, createdAt: any, updatedAt: any } };
 
-export type ObjectsQueryVariables = Exact<{ [key: string]: never; }>;
+export type MetadataObjectsQueryVariables = Exact<{ [key: string]: never; }>;
 
 
-export type ObjectsQuery = { __typename?: 'Query', objects: { __typename?: 'ObjectConnection', totalCount: number, edges: Array<{ __typename?: 'objectEdge', node: { __typename?: 'object', id: string, dataSourceId: string, nameSingular: string, namePlural: string, labelSingular: string, labelPlural: string, description?: string | null, icon?: string | null, isCustom: boolean, isActive: boolean, createdAt: any, updatedAt: any, fields: { __typename?: 'ObjectFieldsConnection', totalCount: number, edges: Array<{ __typename?: 'fieldEdge', node: { __typename?: 'field', id: string, type: string, name: string, label: string, description?: string | null, icon?: string | null, placeholder?: string | null, isCustom: boolean, isActive: boolean, isNullable: boolean, createdAt: any, updatedAt: any } }>, pageInfo: { __typename?: 'PageInfo', hasNextPage?: boolean | null, hasPreviousPage?: boolean | null, startCursor?: any | null, endCursor?: any | null } } } }>, pageInfo: { __typename?: 'PageInfo', hasNextPage?: boolean | null, hasPreviousPage?: boolean | null, startCursor?: any | null, endCursor?: any | null } } };
+export type MetadataObjectsQuery = { __typename?: 'Query', objects: { __typename?: 'ObjectConnection', totalCount: number, edges: Array<{ __typename?: 'objectEdge', node: { __typename?: 'object', id: string, dataSourceId: string, nameSingular: string, namePlural: string, labelSingular: string, labelPlural: string, description?: string | null, icon?: string | null, isCustom: boolean, isActive: boolean, createdAt: any, updatedAt: any, fields: { __typename?: 'ObjectFieldsConnection', totalCount: number, edges: Array<{ __typename?: 'fieldEdge', node: { __typename?: 'field', id: string, type: string, name: string, label: string, description?: string | null, icon?: string | null, placeholder?: string | null, isCustom: boolean, isActive: boolean, isNullable: boolean, createdAt: any, updatedAt: any } }>, pageInfo: { __typename?: 'PageInfo', hasNextPage?: boolean | null, hasPreviousPage?: boolean | null, startCursor?: any | null, endCursor?: any | null } } } }>, pageInfo: { __typename?: 'PageInfo', hasNextPage?: boolean | null, hasPreviousPage?: boolean | null, startCursor?: any | null, endCursor?: any | null } } };
 
 
 export const CreateOneObjectDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"mutation","name":{"kind":"Name","value":"CreateOneObject"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"CreateOneObjectInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"createOneObject"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}}]}}]}}]} as unknown as DocumentNode<CreateOneObjectMutation, CreateOneObjectMutationVariables>;
 export const CreateOneFieldDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"mutation","name":{"kind":"Name","value":"CreateOneField"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"CreateOneFieldInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"createOneField"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"input"},"value":{"kind":"Variable","name":{"kind":"Name","value":"input"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"type"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"label"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"icon"}},{"kind":"Field","name":{"kind":"Name","value":"placeholder"}},{"kind":"Field","name":{"kind":"Name","value":"isCustom"}},{"kind":"Field","name":{"kind":"Name","value":"isActive"}},{"kind":"Field","name":{"kind":"Name","value":"isNullable"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}}]}}]}}]} as unknown as DocumentNode<CreateOneFieldMutation, CreateOneFieldMutationVariables>;
-export const ObjectsDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"Objects"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"objects"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"paging"},"value":{"kind":"ObjectValue","fields":[{"kind":"ObjectField","name":{"kind":"Name","value":"first"},"value":{"kind":"IntValue","value":"100"}}]}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"edges"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"node"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"dataSourceId"}},{"kind":"Field","name":{"kind":"Name","value":"nameSingular"}},{"kind":"Field","name":{"kind":"Name","value":"namePlural"}},{"kind":"Field","name":{"kind":"Name","value":"labelSingular"}},{"kind":"Field","name":{"kind":"Name","value":"labelPlural"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"icon"}},{"kind":"Field","name":{"kind":"Name","value":"isCustom"}},{"kind":"Field","name":{"kind":"Name","value":"isActive"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}},{"kind":"Field","name":{"kind":"Name","value":"fields"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"paging"},"value":{"kind":"ObjectValue","fields":[{"kind":"ObjectField","name":{"kind":"Name","value":"first"},"value":{"kind":"IntValue","value":"100"}}]}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"edges"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"node"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"type"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"label"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"icon"}},{"kind":"Field","name":{"kind":"Name","value":"placeholder"}},{"kind":"Field","name":{"kind":"Name","value":"isCustom"}},{"kind":"Field","name":{"kind":"Name","value":"isActive"}},{"kind":"Field","name":{"kind":"Name","value":"isNullable"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"pageInfo"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"hasNextPage"}},{"kind":"Field","name":{"kind":"Name","value":"hasPreviousPage"}},{"kind":"Field","name":{"kind":"Name","value":"startCursor"}},{"kind":"Field","name":{"kind":"Name","value":"endCursor"}}]}},{"kind":"Field","name":{"kind":"Name","value":"totalCount"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"pageInfo"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"hasNextPage"}},{"kind":"Field","name":{"kind":"Name","value":"hasPreviousPage"}},{"kind":"Field","name":{"kind":"Name","value":"startCursor"}},{"kind":"Field","name":{"kind":"Name","value":"endCursor"}}]}},{"kind":"Field","name":{"kind":"Name","value":"totalCount"}}]}}]}}]} as unknown as DocumentNode<ObjectsQuery, ObjectsQueryVariables>;
+export const MetadataObjectsDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"MetadataObjects"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"objects"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"edges"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"node"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"dataSourceId"}},{"kind":"Field","name":{"kind":"Name","value":"nameSingular"}},{"kind":"Field","name":{"kind":"Name","value":"namePlural"}},{"kind":"Field","name":{"kind":"Name","value":"labelSingular"}},{"kind":"Field","name":{"kind":"Name","value":"labelPlural"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"icon"}},{"kind":"Field","name":{"kind":"Name","value":"isCustom"}},{"kind":"Field","name":{"kind":"Name","value":"isActive"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}},{"kind":"Field","name":{"kind":"Name","value":"fields"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"edges"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"node"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"type"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"label"}},{"kind":"Field","name":{"kind":"Name","value":"description"}},{"kind":"Field","name":{"kind":"Name","value":"icon"}},{"kind":"Field","name":{"kind":"Name","value":"placeholder"}},{"kind":"Field","name":{"kind":"Name","value":"isCustom"}},{"kind":"Field","name":{"kind":"Name","value":"isActive"}},{"kind":"Field","name":{"kind":"Name","value":"isNullable"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"pageInfo"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"hasNextPage"}},{"kind":"Field","name":{"kind":"Name","value":"hasPreviousPage"}},{"kind":"Field","name":{"kind":"Name","value":"startCursor"}},{"kind":"Field","name":{"kind":"Name","value":"endCursor"}}]}},{"kind":"Field","name":{"kind":"Name","value":"totalCount"}}]}}]}}]}},{"kind":"Field","name":{"kind":"Name","value":"pageInfo"},"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"hasNextPage"}},{"kind":"Field","name":{"kind":"Name","value":"hasPreviousPage"}},{"kind":"Field","name":{"kind":"Name","value":"startCursor"}},{"kind":"Field","name":{"kind":"Name","value":"endCursor"}}]}},{"kind":"Field","name":{"kind":"Name","value":"totalCount"}}]}}]}}]} as unknown as DocumentNode<MetadataObjectsQuery, MetadataObjectsQueryVariables>;

front/src/index.tsx

@@ -16,7 +16,7 @@ import { UserProvider } from '@/users/components/UserProvider';
 import '@emotion/react';
 
 import { PageChangeEffect } from './effect-components/PageChangeEffect';
-import { ApolloClientMetadataProvider } from './modules/metadata/components/ApolloClientMetadataProvider';
+import { ApolloMetadataClientProvider } from './modules/metadata/components/ApolloClientMetadataProvider';
 import { FetchMetadataEffect } from './modules/metadata/components/FetchMetadataEffect';
 import { App } from './App';
 
@@ -35,7 +35,7 @@ root.render(
         <HelmetProvider>
           <ClientConfigProvider>
             <UserProvider>
-              <ApolloClientMetadataProvider>
+              <ApolloMetadataClientProvider>
                 <FetchMetadataEffect />
                 <PageChangeEffect />
                 <AppThemeProvider>
@@ -47,7 +47,7 @@ root.render(
                     </DialogProvider>
                   </SnackBarProvider>
                 </AppThemeProvider>
-              </ApolloClientMetadataProvider>
+              </ApolloMetadataClientProvider>
             </UserProvider>
           </ClientConfigProvider>
         </HelmetProvider>

front/src/modules/metadata/components/ApolloClientMetadataProvider.tsx

@@ -5,16 +5,16 @@ import { useRecoilState } from 'recoil';
 
 import { tokenPairState } from '@/auth/states/tokenPairState';
 
-import { ApolloClientMetadataContext } from '../context/ApolloClientMetadataContext';
+import { ApolloMetadataClientContext } from '../context/ApolloClientMetadataContext';
 
-export const ApolloClientMetadataProvider = ({
+export const ApolloMetadataClientProvider = ({
   children,
 }: {
   children: React.ReactNode;
 }) => {
   const [tokenPair] = useRecoilState(tokenPairState);
 
-  const apolloClientMetadata = useMemo(() => {
+  const apolloMetadataClient = useMemo(() => {
     if (tokenPair?.accessToken.token) {
       return new ApolloClient({
         uri: `${process.env.REACT_APP_SERVER_BASE_URL}/metadata`,
@@ -29,8 +29,8 @@ export const ApolloClientMetadataProvider = ({
   }, [tokenPair]);
 
   return (
-    <ApolloClientMetadataContext.Provider value={apolloClientMetadata}>
+    <ApolloMetadataClientContext.Provider value={apolloMetadataClient}>
       {children}
-    </ApolloClientMetadataContext.Provider>
+    </ApolloMetadataClientContext.Provider>
   );
 };

front/src/modules/metadata/components/FetchMetadataEffect.tsx

@@ -2,10 +2,10 @@ import { useEffect } from 'react';
 import { useRecoilState } from 'recoil';
 
 import { isFlexibleBackendEnabledState } from '@/client-config/states/isFlexibleBackendEnabledState';
-import { ObjectsQuery } from '~/generated-metadata/graphql';
+import { MetadataObjectsQuery } from '~/generated-metadata/graphql';
 
 import { GET_ALL_OBJECTS } from '../graphql/queries';
-import { useApolloClientMetadata } from '../hooks/useApolloClientMetadata';
+import { useApolloMetadataClient } from '../hooks/useApolloClientMetadata';
 import { useSeedCustomObjectsTemp } from '../hooks/useSeedCustomObjectsTemp';
 import { metadataObjectsState } from '../states/metadataObjectsState';
 import { MetadataObject } from '../types/MetadataObject';
@@ -16,7 +16,7 @@ export const FetchMetadataEffect = () => {
   const [isFlexibleBackendEnabled] = useRecoilState(
     isFlexibleBackendEnabledState,
   );
-  const apolloClientMetadata = useApolloClientMetadata();
+  const apolloMetadataClient = useApolloMetadataClient();
 
   const seedCustomObjectsTemp = useSeedCustomObjectsTemp();
 
@@ -24,8 +24,8 @@ export const FetchMetadataEffect = () => {
     if (!isFlexibleBackendEnabled) return;
 
     (async () => {
-      if (apolloClientMetadata && metadataObjects.length === 0) {
+      if (apolloMetadataClient && metadataObjects.length === 0) {
-        const objects = await apolloClientMetadata.query<ObjectsQuery>({
+        const objects = await apolloMetadataClient.query<MetadataObjectsQuery>({
           query: GET_ALL_OBJECTS,
         });
 
@@ -46,9 +46,10 @@ export const FetchMetadataEffect = () => {
           try {
             await seedCustomObjectsTemp();
 
-            const objects = await apolloClientMetadata.query<ObjectsQuery>({
+            const objects =
-              query: GET_ALL_OBJECTS,
+              await apolloMetadataClient.query<MetadataObjectsQuery>({
-            });
+                query: GET_ALL_OBJECTS,
+              });
 
             const formattedObjects: MetadataObject[] =
               objects.data.objects.edges.map((object) => ({
@@ -68,7 +69,7 @@ export const FetchMetadataEffect = () => {
     isFlexibleBackendEnabled,
     metadataObjects,
     setMetadataObjects,
-    apolloClientMetadata,
+    apolloMetadataClient,
     seedCustomObjectsTemp,
   ]);
 

front/src/modules/metadata/components/ObjectDataTableEffect.tsx

@@ -14,21 +14,23 @@ import { useFindManyCustomObjects } from '../hooks/useFindManyCustomObjects';
 import { useSetObjectDataTableData } from '../hooks/useSetDataTableData';
 
 export const ObjectDataTableEffect = ({
-  objectName,
   objectNameSingular,
+  objectNamePlural,
 }: {
+  objectNamePlural: string;
   objectNameSingular: string;
-  objectName: string;
 }) => {
   const setDataTableData = useSetObjectDataTableData();
 
-  const { data } = useFindManyCustomObjects({ objectName });
+  const { objects } = useFindManyCustomObjects({
+    objectNamePlural: objectNamePlural,
+  });
 
   useEffect(() => {
-    const entities = data?.['findMany' + objectNameSingular]?.edges ?? [];
+    const entities = objects ?? [];
 
     setDataTableData(entities);
-  }, [data, objectNameSingular, setDataTableData]);
+  }, [objects, objectNameSingular, setDataTableData]);
 
   const [searchParams] = useSearchParams();
   const tableRecoilScopeId = useRecoilScopeId(TableRecoilScopeContext);

front/src/modules/metadata/components/ObjectTable.tsx

@@ -9,11 +9,11 @@ import { useTableViews } from '@/views/hooks/useTableViews';
 import { ObjectDataTableEffect } from './ObjectDataTableEffect';
 
 export const ObjectTable = ({
-  objectName,
+  objectNamePlural,
   objectNameSingular,
 }: {
   objectNameSingular: string;
-  objectName: string;
+  objectNamePlural: string;
 }) => {
   const { createView, deleteView, submitCurrentView, updateView } =
     useTableViews({
@@ -32,7 +32,7 @@ export const ObjectTable = ({
       }}
     >
       <ObjectDataTableEffect
-        objectName={objectName}
+        objectNamePlural={objectNamePlural}
         objectNameSingular={objectNameSingular}
       />
       <ViewBarContext.Provider

front/src/modules/metadata/context/ApolloClientMetadataContext.ts

@@ -1,5 +1,5 @@
 import { createContext } from 'react';
 import { ApolloClient, NormalizedCacheObject } from '@apollo/client';
 
-export const ApolloClientMetadataContext =
+export const ApolloMetadataClientContext =
   createContext<ApolloClient<NormalizedCacheObject> | null>(null);

front/src/modules/metadata/graphql/queries.ts

@@ -1,8 +1,8 @@
 import { gql } from '@apollo/client';
 
 export const GET_ALL_OBJECTS = gql`
-  query Objects {
+  query MetadataObjects {
-    objects(paging: { first: 100 }) {
+    objects {
       edges {
         node {
           id
@@ -17,7 +17,7 @@ export const GET_ALL_OBJECTS = gql`
           isActive
           createdAt
           updatedAt
-          fields(paging: { first: 100 }) {
+          fields {
             edges {
               node {
                 id

front/src/modules/metadata/hooks/useApolloClientMetadata.ts

@@ -1,7 +1,7 @@
 import { useContext } from 'react';
 
-import { ApolloClientMetadataContext } from '../context/ApolloClientMetadataContext';
+import { ApolloMetadataClientContext } from '../context/ApolloClientMetadataContext';
 
-export const useApolloClientMetadata = () => {
+export const useApolloMetadataClient = () => {
-  return useContext(ApolloClientMetadataContext);
+  return useContext(ApolloMetadataClientContext);
 };

front/src/modules/metadata/hooks/useCreateOneCustomObject.ts

@@ -1,8 +0,0 @@
-// TODO: add zod to validate that we have at least id on each object
-export const useCreateOneCustomObject = ({
-  _objectName,
-}: {
-  _objectName: string;
-}) => {
-  // TODO : code
-};

front/src/modules/metadata/hooks/useCreateOneMetadataField.ts

@@ -0,0 +1,41 @@
+import { ApolloClient, useMutation } from '@apollo/client';
+import { getOperationName } from '@apollo/client/utilities';
+
+import {
+  CreateOneFieldMutation,
+  CreateOneFieldMutationVariables,
+} from '~/generated-metadata/graphql';
+
+import { CREATE_ONE_FIELD } from '../graphql/mutations';
+import { GET_ALL_OBJECTS } from '../graphql/queries';
+
+import { useApolloMetadataClient } from './useApolloClientMetadata';
+
+export const useCreateOneMetadataField = () => {
+  const apolloMetadataClient = useApolloMetadataClient();
+
+  const [mutate] = useMutation<
+    CreateOneFieldMutation,
+    CreateOneFieldMutationVariables
+  >(CREATE_ONE_FIELD, {
+    client: apolloMetadataClient ?? ({} as ApolloClient<any>),
+  });
+
+  const createOneMetadataField = (
+    input: CreateOneFieldMutationVariables['input']['field'],
+  ) =>
+    mutate({
+      variables: {
+        input: {
+          field: {
+            ...input,
+          },
+        },
+      },
+      refetchQueries: [getOperationName(GET_ALL_OBJECTS) ?? ''],
+    });
+
+  return {
+    createOneMetadataField,
+  };
+};

front/src/modules/metadata/hooks/useCreateOneMetadataObject.ts

@@ -0,0 +1,41 @@
+import { ApolloClient, useMutation } from '@apollo/client';
+import { getOperationName } from '@apollo/client/utilities';
+
+import {
+  CreateOneObjectMutation,
+  CreateOneObjectMutationVariables,
+} from '~/generated-metadata/graphql';
+
+import { CREATE_ONE_OBJECT } from '../graphql/mutations';
+import { GET_ALL_OBJECTS } from '../graphql/queries';
+
+import { useApolloMetadataClient } from './useApolloClientMetadata';
+
+export const useCreateOneMetadataObject = () => {
+  const apolloMetadataClient = useApolloMetadataClient();
+
+  const [mutate] = useMutation<
+    CreateOneObjectMutation,
+    CreateOneObjectMutationVariables
+  >(CREATE_ONE_OBJECT, {
+    client: apolloMetadataClient ?? ({} as ApolloClient<any>),
+  });
+
+  const createOneMetadataObject = (
+    input: CreateOneObjectMutationVariables['input']['object'],
+  ) =>
+    mutate({
+      variables: {
+        input: {
+          object: {
+            ...input,
+          },
+        },
+      },
+      refetchQueries: [getOperationName(GET_ALL_OBJECTS) ?? ''],
+    });
+
+  return {
+    createOneMetadataObject,
+  };
+};

front/src/modules/metadata/hooks/useFindAllMetadata.ts

@@ -0,0 +1,46 @@
+import { useMemo } from 'react';
+import { useQuery } from '@apollo/client';
+
+import {
+  MetadataObjectsQuery,
+  MetadataObjectsQueryVariables,
+} from '~/generated-metadata/graphql';
+
+import { GET_ALL_OBJECTS } from '../graphql/queries';
+import { formatPagedMetadataObjectsToMetadataObjects } from '../utils/formatPagedMetadataObjectsToMetadataObjects';
+
+import { useApolloMetadataClient } from './useApolloClientMetadata';
+
+// TODO: test fetchMore
+export const useFindAllMetadata = () => {
+  const apolloMetadataClient = useApolloMetadataClient();
+
+  const { data, fetchMore: fetchMoreInternal } = useQuery<
+    MetadataObjectsQuery,
+    MetadataObjectsQueryVariables
+  >(GET_ALL_OBJECTS, {
+    client: apolloMetadataClient ?? ({} as any),
+    skip: !apolloMetadataClient,
+  });
+
+  const hasMore = data?.objects?.pageInfo?.hasNextPage;
+
+  const fetchMore = () =>
+    fetchMoreInternal({
+      variables: {
+        afterCursor: data?.objects?.pageInfo?.endCursor,
+      },
+    });
+
+  const metadataObjects = useMemo(() => {
+    return formatPagedMetadataObjectsToMetadataObjects({
+      pagedMetadataObjects: data,
+    });
+  }, [data]);
+
+  return {
+    metadataObjects,
+    hasMore,
+    fetchMore,
+  };
+};

front/src/modules/metadata/hooks/useFindManyCustomObjects.ts

@@ -1,27 +1,28 @@
+import { useMemo } from 'react';
 import { gql, useQuery } from '@apollo/client';
-import { useRecoilState } from 'recoil';
 
-import { metadataObjectsState } from '../states/metadataObjectsState';
+import { PaginatedObjectType } from '../types/PaginatedObjectType';
+import { formatPagedObjectsToObjects } from '../utils/formatPagedObjectsToObjects';
 import { generateFindManyCustomObjectsQuery } from '../utils/generateFindManyCustomObjectsQuery';
 
-// TODO: add zod to validate that we have at least id on each object
+import { useFindAllMetadata } from './useFindAllMetadata';
-export const useFindManyCustomObjects = ({
-  objectName,
-}: {
-  objectName: string;
-}) => {
-  const [metadataObjects] = useRecoilState(metadataObjectsState);
 
-  const foundObject = metadataObjects.find(
+// TODO: test with a wrong name
-    (object) => object.nameSingular === objectName,
+// TODO: add zod to validate that we have at least id on each object
+export const useFindManyCustomObjects = <ObjectType extends { id: string }>({
+  objectNamePlural,
+}: {
+  objectNamePlural: string;
+}) => {
+  const { metadataObjects } = useFindAllMetadata();
+
+  const foundMetadataObject = metadataObjects.find(
+    (object) => object.namePlural === objectNamePlural,
   );
 
-  // eslint-disable-next-line no-console
+  const generatedQuery = foundMetadataObject
-  console.log({ foundObject });
-
-  const generatedQuery = foundObject
     ? generateFindManyCustomObjectsQuery({
-        metadataObject: foundObject,
+        metadataObject: foundMetadataObject,
       })
     : gql`
         query EmptyQuery {
@@ -29,31 +30,29 @@ export const useFindManyCustomObjects = ({
         }
       `;
 
-  const {
+  const { data, loading, error } = useQuery<PaginatedObjectType<ObjectType>>(
-    fetchMore: fetchMoreBase,
+    generatedQuery,
-    data,
+    {
-    loading,
+      skip: !foundMetadataObject,
-    error,
+    },
-  } = useQuery(generatedQuery, {
+  );
-    skip: !foundObject,
-  });
 
-  // eslint-disable-next-line no-console
+  const objects = useMemo(
-  console.log({ data, loading, error });
+    () =>
+      formatPagedObjectsToObjects({
+        pagedObjects: data,
+        objectNamePlural,
+      }),
+    [data, objectNamePlural],
+  );
 
-  const fetchMore = ({ fromCursor }: { fromCursor: string }) => {
+  const objectNotFoundInMetadata =
-    fetchMoreBase({
+    metadataObjects.length > 0 && !foundMetadataObject;
-      variables: { fromCursor },
-    });
-  };
-
-  const objectNotFoundInMetadata = metadataObjects.length > 0 && !foundObject;
 
   return {
-    data,
+    objects,
     loading,
     error,
-    fetchMore,
     objectNotFoundInMetadata,
   };
 };

front/src/modules/metadata/hooks/useSeedCustomObjectsTemp.ts

@@ -1,77 +1,39 @@
-import {
+import { useCreateOneMetadataField } from './useCreateOneMetadataField';
-  CreateOneFieldMutation,
+import { useCreateOneMetadataObject } from './useCreateOneMetadataObject';
-  CreateOneFieldMutationVariables,
-  CreateOneObjectMutation,
-  CreateOneObjectMutationVariables,
-} from '~/generated-metadata/graphql';
-
-import { CREATE_ONE_FIELD, CREATE_ONE_OBJECT } from '../graphql/mutations';
-
-import { useApolloClientMetadata } from './useApolloClientMetadata';
 
 export const useSeedCustomObjectsTemp = () => {
-  const client = useApolloClientMetadata();
+  const { createOneMetadataObject } = useCreateOneMetadataObject();
+  const { createOneMetadataField } = useCreateOneMetadataField();
 
   return async () => {
-    if (!client) return;
+    const createdMetadataObject = await createOneMetadataObject({
-
+      labelPlural: 'Suppliers',
-    const { data: createSuppliersData } = await client?.mutate<
+      labelSingular: 'Supplier',
-      CreateOneObjectMutation,
+      nameSingular: 'supplier',
-      CreateOneObjectMutationVariables
+      namePlural: 'suppliers',
-    >({
+      description: 'Suppliers',
-      mutation: CREATE_ONE_OBJECT,
+      icon: 'IconBuilding',
-      variables: {
-        input: {
-          object: {
-            labelPlural: 'Suppliers',
-            labelSingular: 'Supplier',
-            nameSingular: 'supplier',
-            namePlural: 'suppliers',
-            description: 'Suppliers',
-            icon: 'IconBuilding',
-          },
-        },
-      },
     });
 
-    const supplierObjectId = createSuppliersData?.createOneObject?.id ?? '';
+    const supplierObjectId =
+      createdMetadataObject.data?.createOneObject?.id ?? '';
 
-    await client?.mutate<
+    await createOneMetadataField({
-      CreateOneFieldMutation,
+      objectId: supplierObjectId,
-      CreateOneFieldMutationVariables
+      name: 'name',
-    >({
+      type: 'text',
-      mutation: CREATE_ONE_FIELD,
+      description: 'Name',
-      variables: {
+      label: 'Name',
-        input: {
+      icon: 'IconBuilding',
-          field: {
-            objectId: supplierObjectId,
-            label: 'Name',
-            name: 'name',
-            type: 'text',
-            description: 'Name',
-            icon: 'IconBuilding',
-          },
-        },
-      },
     });
 
-    await client?.mutate<
+    await createOneMetadataField({
-      CreateOneFieldMutation,
+      objectId: supplierObjectId,
-      CreateOneFieldMutationVariables
+      label: 'City',
-    >({
+      name: 'city',
-      mutation: CREATE_ONE_FIELD,
+      type: 'text',
-      variables: {
+      description: 'City',
-        input: {
+      icon: 'IconMap',
-          field: {
-            objectId: supplierObjectId,
-            label: 'City',
-            name: 'city',
-            type: 'text',
-            description: 'City',
-            icon: 'IconMap',
-          },
-        },
-      },
     });
   };
 };

front/src/modules/metadata/hooks/useSetDataTableData.ts

@@ -18,9 +18,7 @@ export const useSetObjectDataTableData = () => {
 
   return useRecoilCallback(
     ({ set, snapshot }) =>
-      <T extends { node: { id: string } }>(newEntityArrayRaw: T[]) => {
+      <T extends { id: string }>(newEntityArray: T[]) => {
-        const newEntityArray = newEntityArrayRaw.map((entity) => entity.node);
-
         for (const entity of newEntityArray) {
           const currentEntity = snapshot
             .getLoadable(entityFieldsFamilyState(entity.id))
@@ -33,9 +31,6 @@ export const useSetObjectDataTableData = () => {
 
         const entityIds = newEntityArray.map((entity) => entity.id);
 
-        // eslint-disable-next-line no-console
-        console.log({ newEntityArray, entityIds });
-
         set(tableRowIdsState, (currentRowIds) => {
           if (JSON.stringify(currentRowIds) !== JSON.stringify(entityIds)) {
             return entityIds;

front/src/modules/metadata/types/PaginatedObjectType.ts

@@ -0,0 +1,8 @@
+export type PaginatedObjectType<ObjectType extends { id: string }> = {
+  [objectNamePlural: string]: {
+    edges: {
+      node: ObjectType;
+      cursor: string;
+    }[];
+  };
+};

front/src/modules/metadata/utils/formatPagedMetadataObjectsToMetadataObjects.ts

@@ -0,0 +1,17 @@
+import { MetadataObjectsQuery } from '~/generated-metadata/graphql';
+
+import { MetadataObject } from '../types/MetadataObject';
+
+export const formatPagedMetadataObjectsToMetadataObjects = ({
+  pagedMetadataObjects: pagedMetadataObjects,
+}: {
+  pagedMetadataObjects: MetadataObjectsQuery | undefined;
+}) => {
+  const formattedObjects: MetadataObject[] =
+    pagedMetadataObjects?.objects.edges.map((object) => ({
+      ...object.node,
+      fields: object.node.fields.edges.map((field) => field.node),
+    })) ?? [];
+
+  return formattedObjects;
+};

front/src/modules/metadata/utils/formatPagedObjectsToObjects.ts

@@ -0,0 +1,24 @@
+export const formatPagedObjectsToObjects = <
+  ObjectType extends { id: string },
+  ObjectTypeQuery extends {
+    [objectNamePlural: string]: {
+      edges: ObjectEdge[];
+    };
+  },
+  ObjectEdge extends {
+    node: ObjectType;
+  },
+>({
+  pagedObjects,
+  objectNamePlural,
+}: {
+  pagedObjects: ObjectTypeQuery | undefined;
+  objectNamePlural: string;
+}) => {
+  const formattedObjects: ObjectType[] =
+    pagedObjects?.[objectNamePlural].edges.map((objectEdge: ObjectEdge) => ({
+      ...objectEdge.node,
+    })) ?? [];
+
+  return formattedObjects;
+};

front/src/modules/metadata/utils/generateFindManyCustomObjectsQuery.ts

@@ -10,8 +10,8 @@ export const generateFindManyCustomObjectsQuery = ({
   _fromCursor?: string;
 }) => {
   return gql`
-    query CustomQuery${metadataObject.nameSingular} {
+    query FindMany${metadataObject.namePlural} {
-      findMany${metadataObject.nameSingular}{
+      ${metadataObject.namePlural}{
         edges {
           node {
             id

front/src/modules/ui/data/data-table/components/DataTableBody.tsx

@@ -27,9 +27,6 @@ export const DataTableBody = () => {
 
   const tableRowIds = useRecoilValue(tableRowIdsState);
 
-  // eslint-disable-next-line no-console
-  console.log({ tableRowIds });
-
   const isNavbarSwitchingSize = useRecoilValue(isNavbarSwitchingSizeState);
   const isFetchingDataTableData = useRecoilValue(isFetchingDataTableDataState);
 

front/src/pages/companies/ObjectsTable.tsx

@@ -19,17 +19,14 @@ const StyledTableContainer = styled.div`
 `;
 
 export const ObjectTablePage = ({
-  objectName,
+  objectNamePlural,
   objectNameSingular,
 }: {
   objectNameSingular: string;
-  objectName: string;
+  objectNamePlural: string;
 }) => {
   const handleAddButtonClick = async () => {
     const newCompanyId: string = v4();
-
-    // eslint-disable-next-line no-console
-    console.log('newCompanyId', newCompanyId);
   };
 
   return (
@@ -45,7 +42,7 @@ export const ObjectTablePage = ({
         >
           <StyledTableContainer>
             <ObjectTable
-              objectName={objectName}
+              objectNamePlural={objectNamePlural}
               objectNameSingular={objectNameSingular}
             />
           </StyledTableContainer>