diff --git a/front/src/App.tsx b/front/src/App.tsx index 28e094bd7..b89be02e3 100644 --- a/front/src/App.tsx +++ b/front/src/App.tsx @@ -63,8 +63,8 @@ export const App = () => { path={AppPath.ObjectTablePage} element={ } /> diff --git a/front/src/generated-metadata/gql.ts b/front/src/generated-metadata/gql.ts index 9f43f156b..32e4dd97b 100644 --- a/front/src/generated-metadata/gql.ts +++ b/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] ?? {}; diff --git a/front/src/generated-metadata/graphql.ts b/front/src/generated-metadata/graphql.ts index 58d78627a..46e72f72d 100644 --- a/front/src/generated-metadata/graphql.ts +++ b/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; 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; -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; \ No newline at end of file +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; \ No newline at end of file diff --git a/front/src/index.tsx b/front/src/index.tsx index 9b9fa9247..885462b09 100644 --- a/front/src/index.tsx +++ b/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( - + @@ -47,7 +47,7 @@ root.render( - + diff --git a/front/src/modules/metadata/components/ApolloClientMetadataProvider.tsx b/front/src/modules/metadata/components/ApolloClientMetadataProvider.tsx index 52eaf570f..67371da99 100644 --- a/front/src/modules/metadata/components/ApolloClientMetadataProvider.tsx +++ b/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 ( - + {children} - + ); }; diff --git a/front/src/modules/metadata/components/FetchMetadataEffect.tsx b/front/src/modules/metadata/components/FetchMetadataEffect.tsx index 54e9668bb..def1c4b5f 100644 --- a/front/src/modules/metadata/components/FetchMetadataEffect.tsx +++ b/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) { - const objects = await apolloClientMetadata.query({ + if (apolloMetadataClient && metadataObjects.length === 0) { + const objects = await apolloMetadataClient.query({ query: GET_ALL_OBJECTS, }); @@ -46,9 +46,10 @@ export const FetchMetadataEffect = () => { try { await seedCustomObjectsTemp(); - const objects = await apolloClientMetadata.query({ - query: GET_ALL_OBJECTS, - }); + const objects = + await apolloMetadataClient.query({ + 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, ]); diff --git a/front/src/modules/metadata/components/ObjectDataTableEffect.tsx b/front/src/modules/metadata/components/ObjectDataTableEffect.tsx index c40f7391c..f9e591e13 100644 --- a/front/src/modules/metadata/components/ObjectDataTableEffect.tsx +++ b/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); diff --git a/front/src/modules/metadata/components/ObjectTable.tsx b/front/src/modules/metadata/components/ObjectTable.tsx index fdaf3ae2a..32c0f3364 100644 --- a/front/src/modules/metadata/components/ObjectTable.tsx +++ b/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 = ({ }} > | null>(null); diff --git a/front/src/modules/metadata/graphql/queries.ts b/front/src/modules/metadata/graphql/queries.ts index a019f6dc9..af1d1d2c5 100644 --- a/front/src/modules/metadata/graphql/queries.ts +++ b/front/src/modules/metadata/graphql/queries.ts @@ -1,8 +1,8 @@ import { gql } from '@apollo/client'; export const GET_ALL_OBJECTS = gql` - query Objects { - objects(paging: { first: 100 }) { + query MetadataObjects { + 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 diff --git a/front/src/modules/metadata/hooks/useApolloClientMetadata.ts b/front/src/modules/metadata/hooks/useApolloClientMetadata.ts index 56ae655da..69cea3e58 100644 --- a/front/src/modules/metadata/hooks/useApolloClientMetadata.ts +++ b/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 = () => { - return useContext(ApolloClientMetadataContext); +export const useApolloMetadataClient = () => { + return useContext(ApolloMetadataClientContext); }; diff --git a/front/src/modules/metadata/hooks/useCreateOneCustomObject.ts b/front/src/modules/metadata/hooks/useCreateOneCustomObject.ts deleted file mode 100644 index 8d6517734..000000000 --- a/front/src/modules/metadata/hooks/useCreateOneCustomObject.ts +++ /dev/null @@ -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 -}; diff --git a/front/src/modules/metadata/hooks/useCreateOneMetadataField.ts b/front/src/modules/metadata/hooks/useCreateOneMetadataField.ts new file mode 100644 index 000000000..88071485c --- /dev/null +++ b/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), + }); + + const createOneMetadataField = ( + input: CreateOneFieldMutationVariables['input']['field'], + ) => + mutate({ + variables: { + input: { + field: { + ...input, + }, + }, + }, + refetchQueries: [getOperationName(GET_ALL_OBJECTS) ?? ''], + }); + + return { + createOneMetadataField, + }; +}; diff --git a/front/src/modules/metadata/hooks/useCreateOneMetadataObject.ts b/front/src/modules/metadata/hooks/useCreateOneMetadataObject.ts new file mode 100644 index 000000000..eb598132d --- /dev/null +++ b/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), + }); + + const createOneMetadataObject = ( + input: CreateOneObjectMutationVariables['input']['object'], + ) => + mutate({ + variables: { + input: { + object: { + ...input, + }, + }, + }, + refetchQueries: [getOperationName(GET_ALL_OBJECTS) ?? ''], + }); + + return { + createOneMetadataObject, + }; +}; diff --git a/front/src/modules/metadata/hooks/useFindAllMetadata.ts b/front/src/modules/metadata/hooks/useFindAllMetadata.ts new file mode 100644 index 000000000..b2123c846 --- /dev/null +++ b/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, + }; +}; diff --git a/front/src/modules/metadata/hooks/useFindManyCustomObjects.ts b/front/src/modules/metadata/hooks/useFindManyCustomObjects.ts index 497a434d9..dab2a3efa 100644 --- a/front/src/modules/metadata/hooks/useFindManyCustomObjects.ts +++ b/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 -export const useFindManyCustomObjects = ({ - objectName, -}: { - objectName: string; -}) => { - const [metadataObjects] = useRecoilState(metadataObjectsState); +import { useFindAllMetadata } from './useFindAllMetadata'; - const foundObject = metadataObjects.find( - (object) => object.nameSingular === objectName, +// TODO: test with a wrong name +// TODO: add zod to validate that we have at least id on each object +export const useFindManyCustomObjects = ({ + objectNamePlural, +}: { + objectNamePlural: string; +}) => { + const { metadataObjects } = useFindAllMetadata(); + + const foundMetadataObject = metadataObjects.find( + (object) => object.namePlural === objectNamePlural, ); - // eslint-disable-next-line no-console - console.log({ foundObject }); - - const generatedQuery = foundObject + const generatedQuery = foundMetadataObject ? generateFindManyCustomObjectsQuery({ - metadataObject: foundObject, + metadataObject: foundMetadataObject, }) : gql` query EmptyQuery { @@ -29,31 +30,29 @@ export const useFindManyCustomObjects = ({ } `; - const { - fetchMore: fetchMoreBase, - data, - loading, - error, - } = useQuery(generatedQuery, { - skip: !foundObject, - }); + const { data, loading, error } = useQuery>( + generatedQuery, + { + skip: !foundMetadataObject, + }, + ); - // eslint-disable-next-line no-console - console.log({ data, loading, error }); + const objects = useMemo( + () => + formatPagedObjectsToObjects({ + pagedObjects: data, + objectNamePlural, + }), + [data, objectNamePlural], + ); - const fetchMore = ({ fromCursor }: { fromCursor: string }) => { - fetchMoreBase({ - variables: { fromCursor }, - }); - }; - - const objectNotFoundInMetadata = metadataObjects.length > 0 && !foundObject; + const objectNotFoundInMetadata = + metadataObjects.length > 0 && !foundMetadataObject; return { - data, + objects, loading, error, - fetchMore, objectNotFoundInMetadata, }; }; diff --git a/front/src/modules/metadata/hooks/useSeedCustomObjectsTemp.ts b/front/src/modules/metadata/hooks/useSeedCustomObjectsTemp.ts index 416429bb8..688e75f9c 100644 --- a/front/src/modules/metadata/hooks/useSeedCustomObjectsTemp.ts +++ b/front/src/modules/metadata/hooks/useSeedCustomObjectsTemp.ts @@ -1,77 +1,39 @@ -import { - CreateOneFieldMutation, - CreateOneFieldMutationVariables, - CreateOneObjectMutation, - CreateOneObjectMutationVariables, -} from '~/generated-metadata/graphql'; - -import { CREATE_ONE_FIELD, CREATE_ONE_OBJECT } from '../graphql/mutations'; - -import { useApolloClientMetadata } from './useApolloClientMetadata'; +import { useCreateOneMetadataField } from './useCreateOneMetadataField'; +import { useCreateOneMetadataObject } from './useCreateOneMetadataObject'; export const useSeedCustomObjectsTemp = () => { - const client = useApolloClientMetadata(); + const { createOneMetadataObject } = useCreateOneMetadataObject(); + const { createOneMetadataField } = useCreateOneMetadataField(); return async () => { - if (!client) return; - - const { data: createSuppliersData } = await client?.mutate< - CreateOneObjectMutation, - CreateOneObjectMutationVariables - >({ - mutation: CREATE_ONE_OBJECT, - variables: { - input: { - object: { - labelPlural: 'Suppliers', - labelSingular: 'Supplier', - nameSingular: 'supplier', - namePlural: 'suppliers', - description: 'Suppliers', - icon: 'IconBuilding', - }, - }, - }, + const createdMetadataObject = await createOneMetadataObject({ + 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< - CreateOneFieldMutation, - CreateOneFieldMutationVariables - >({ - mutation: CREATE_ONE_FIELD, - variables: { - input: { - field: { - objectId: supplierObjectId, - label: 'Name', - name: 'name', - type: 'text', - description: 'Name', - icon: 'IconBuilding', - }, - }, - }, + await createOneMetadataField({ + objectId: supplierObjectId, + name: 'name', + type: 'text', + description: 'Name', + label: 'Name', + icon: 'IconBuilding', }); - await client?.mutate< - CreateOneFieldMutation, - CreateOneFieldMutationVariables - >({ - mutation: CREATE_ONE_FIELD, - variables: { - input: { - field: { - objectId: supplierObjectId, - label: 'City', - name: 'city', - type: 'text', - description: 'City', - icon: 'IconMap', - }, - }, - }, + await createOneMetadataField({ + objectId: supplierObjectId, + label: 'City', + name: 'city', + type: 'text', + description: 'City', + icon: 'IconMap', }); }; }; diff --git a/front/src/modules/metadata/hooks/useSetDataTableData.ts b/front/src/modules/metadata/hooks/useSetDataTableData.ts index f09d4a158..e983f5afc 100644 --- a/front/src/modules/metadata/hooks/useSetDataTableData.ts +++ b/front/src/modules/metadata/hooks/useSetDataTableData.ts @@ -18,9 +18,7 @@ export const useSetObjectDataTableData = () => { return useRecoilCallback( ({ set, snapshot }) => - (newEntityArrayRaw: T[]) => { - const newEntityArray = newEntityArrayRaw.map((entity) => entity.node); - + (newEntityArray: T[]) => { 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; diff --git a/front/src/modules/metadata/types/PaginatedObjectType.ts b/front/src/modules/metadata/types/PaginatedObjectType.ts new file mode 100644 index 000000000..19b28fc12 --- /dev/null +++ b/front/src/modules/metadata/types/PaginatedObjectType.ts @@ -0,0 +1,8 @@ +export type PaginatedObjectType = { + [objectNamePlural: string]: { + edges: { + node: ObjectType; + cursor: string; + }[]; + }; +}; diff --git a/front/src/modules/metadata/utils/formatPagedMetadataObjectsToMetadataObjects.ts b/front/src/modules/metadata/utils/formatPagedMetadataObjectsToMetadataObjects.ts new file mode 100644 index 000000000..d297b17a3 --- /dev/null +++ b/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; +}; diff --git a/front/src/modules/metadata/utils/formatPagedObjectsToObjects.ts b/front/src/modules/metadata/utils/formatPagedObjectsToObjects.ts new file mode 100644 index 000000000..68d97193a --- /dev/null +++ b/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; +}; diff --git a/front/src/modules/metadata/utils/generateFindManyCustomObjectsQuery.ts b/front/src/modules/metadata/utils/generateFindManyCustomObjectsQuery.ts index 9fb0941dd..bbb7bdb02 100644 --- a/front/src/modules/metadata/utils/generateFindManyCustomObjectsQuery.ts +++ b/front/src/modules/metadata/utils/generateFindManyCustomObjectsQuery.ts @@ -10,8 +10,8 @@ export const generateFindManyCustomObjectsQuery = ({ _fromCursor?: string; }) => { return gql` - query CustomQuery${metadataObject.nameSingular} { - findMany${metadataObject.nameSingular}{ + query FindMany${metadataObject.namePlural} { + ${metadataObject.namePlural}{ edges { node { id diff --git a/front/src/modules/ui/data/data-table/components/DataTableBody.tsx b/front/src/modules/ui/data/data-table/components/DataTableBody.tsx index 2467762cb..62af6f4ee 100644 --- a/front/src/modules/ui/data/data-table/components/DataTableBody.tsx +++ b/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); diff --git a/front/src/pages/companies/ObjectsTable.tsx b/front/src/pages/companies/ObjectsTable.tsx index d7e3be471..ed052281c 100644 --- a/front/src/pages/companies/ObjectsTable.tsx +++ b/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 = ({ >