mirror of
https://github.com/lingble/twenty.git
synced 2025-11-02 21:57:56 +00:00
feat: fetch database connections (#4813)
Closes #4757 --------- Co-authored-by: Thomas Trompette <thomast@twenty.com>
This commit is contained in:
Thaïs
@@ -1,13 +1,18 @@
|
||||
module.exports = {
|
||||
schema: process.env.REACT_APP_SERVER_BASE_URL + "/metadata",
|
||||
documents: ['./src/modules/object-metadata/graphql/*.ts', './src/modules/object-record/graphql/*.tsx', './src/modules/metadata/graphql/*.ts'],
|
||||
schema: process.env.REACT_APP_SERVER_BASE_URL + '/metadata',
|
||||
documents: [
|
||||
'./src/modules/databases/graphql/**/*.ts',
|
||||
'./src/modules/object-metadata/graphql/*.ts',
|
||||
'./src/modules/object-record/graphql/*.tsx',
|
||||
'./src/modules/metadata/graphql/*.ts',
|
||||
],
|
||||
overwrite: true,
|
||||
generates: {
|
||||
'./src/generated-metadata/': {
|
||||
preset: 'client',
|
||||
presetConfig: {
|
||||
fragmentMasking: false
|
||||
}
|
||||
fragmentMasking: false,
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
module.exports = {
|
||||
schema: process.env.REACT_APP_SERVER_BASE_URL + '/graphql',
|
||||
documents: [
|
||||
'!./src/modules/databases/**',
|
||||
'!./src/modules/object-metadata/**',
|
||||
'!./src/modules/object-record/**',
|
||||
'./src/modules/**/*.tsx',
|
||||
'./src/modules/**/*.ts',
|
||||
'!./src/**/*.test.tsx',
|
||||
'!./src/**/__mocks__/*.ts',
|
||||
'!./src/modules/users/graphql/queries/getCurrentUserAndViews.ts'
|
||||
'!./src/modules/users/graphql/queries/getCurrentUserAndViews.ts',
|
||||
],
|
||||
overwrite: true,
|
||||
generates: {
|
||||
|
||||
@@ -13,6 +13,7 @@ import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/
|
||||
* Therefore it is highly recommended to use the babel or swc plugin for production.
|
||||
*/
|
||||
const documents = {
|
||||
"\n query GetManyDatabaseConnections($input: RemoteServerTypeInput!) {\n findManyRemoteServersByType(input: $input) {\n id\n createdAt\n foreignDataWrapperId\n foreignDataWrapperOptions\n foreignDataWrapperType\n updatedAt\n }\n }\n": types.GetManyDatabaseConnectionsDocument,
|
||||
"\n mutation CreateOneObjectMetadataItem($input: CreateOneObjectInput!) {\n createOneObject(input: $input) {\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 labelIdentifierFieldMetadataId\n imageIdentifierFieldMetadataId\n }\n }\n": types.CreateOneObjectMetadataItemDocument,
|
||||
"\n mutation CreateOneFieldMetadataItem($input: CreateOneFieldMetadataInput!) {\n createOneField(input: $input) {\n id\n type\n name\n label\n description\n icon\n isCustom\n isActive\n isNullable\n createdAt\n updatedAt\n defaultValue\n options\n }\n }\n": types.CreateOneFieldMetadataItemDocument,
|
||||
"\n mutation CreateOneRelationMetadata($input: CreateOneRelationInput!) {\n createOneRelation(input: $input) {\n id\n relationType\n fromObjectMetadataId\n toObjectMetadataId\n fromFieldMetadataId\n toFieldMetadataId\n createdAt\n updatedAt\n }\n }\n": types.CreateOneRelationMetadataDocument,
|
||||
@@ -37,6 +38,10 @@ const documents = {
|
||||
*/
|
||||
export function graphql(source: string): unknown;
|
||||
|
||||
/**
|
||||
* 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 GetManyDatabaseConnections($input: RemoteServerTypeInput!) {\n findManyRemoteServersByType(input: $input) {\n id\n createdAt\n foreignDataWrapperId\n foreignDataWrapperOptions\n foreignDataWrapperType\n updatedAt\n }\n }\n"): (typeof documents)["\n query GetManyDatabaseConnections($input: RemoteServerTypeInput!) {\n findManyRemoteServersByType(input: $input) {\n id\n createdAt\n foreignDataWrapperId\n foreignDataWrapperOptions\n foreignDataWrapperType\n updatedAt\n }\n }\n"];
|
||||
/**
|
||||
* The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
|
||||
*/
|
||||
|
||||
@@ -162,6 +162,7 @@ export type CreateObjectInput = {
|
||||
labelSingular: Scalars['String']['input'];
|
||||
namePlural: Scalars['String']['input'];
|
||||
nameSingular: Scalars['String']['input'];
|
||||
remoteTablePrimaryKeyColumnType?: InputMaybe<Scalars['String']['input']>;
|
||||
};
|
||||
|
||||
export type CreateOneAppTokenInput = {
|
||||
@@ -217,7 +218,7 @@ export type CursorPaging = {
|
||||
};
|
||||
|
||||
export type DeleteOneFieldInput = {
|
||||
/** The id of the record to delete. */
|
||||
/** The id of the field to delete. */
|
||||
id: Scalars['ID']['input'];
|
||||
};
|
||||
|
||||
@@ -276,24 +277,6 @@ export type FieldConnection = {
|
||||
pageInfo: PageInfo;
|
||||
};
|
||||
|
||||
export type FieldDeleteResponse = {
|
||||
__typename?: 'FieldDeleteResponse';
|
||||
createdAt?: Maybe<Scalars['DateTime']['output']>;
|
||||
defaultValue?: Maybe<Scalars['JSON']['output']>;
|
||||
description?: Maybe<Scalars['String']['output']>;
|
||||
icon?: Maybe<Scalars['String']['output']>;
|
||||
id?: Maybe<Scalars['ID']['output']>;
|
||||
isActive?: Maybe<Scalars['Boolean']['output']>;
|
||||
isCustom?: Maybe<Scalars['Boolean']['output']>;
|
||||
isNullable?: Maybe<Scalars['Boolean']['output']>;
|
||||
isSystem?: Maybe<Scalars['Boolean']['output']>;
|
||||
label?: Maybe<Scalars['String']['output']>;
|
||||
name?: Maybe<Scalars['String']['output']>;
|
||||
options?: Maybe<Scalars['JSON']['output']>;
|
||||
type?: Maybe<FieldMetadataType>;
|
||||
updatedAt?: Maybe<Scalars['DateTime']['output']>;
|
||||
};
|
||||
|
||||
/** Type of the field */
|
||||
export enum FieldMetadataType {
|
||||
Address = 'ADDRESS',
|
||||
@@ -376,7 +359,7 @@ export type Mutation = {
|
||||
createOneRelation: Relation;
|
||||
createOneRemoteServer: RemoteServer;
|
||||
deleteCurrentWorkspace: Workspace;
|
||||
deleteOneField: FieldDeleteResponse;
|
||||
deleteOneField: Field;
|
||||
deleteOneObject: Object;
|
||||
deleteOneRelation: RelationDeleteResponse;
|
||||
deleteOneRemoteServer: RemoteServer;
|
||||
@@ -1054,7 +1037,7 @@ export type Workspace = {
|
||||
billingSubscriptions?: Maybe<Array<BillingSubscription>>;
|
||||
createdAt: Scalars['DateTime']['output'];
|
||||
currentBillingSubscription?: Maybe<BillingSubscription>;
|
||||
currentCacheVersion?: Maybe<Scalars['String']['output']>;
|
||||
currentCacheVersion: Scalars['String']['output'];
|
||||
deletedAt?: Maybe<Scalars['DateTime']['output']>;
|
||||
displayName?: Maybe<Scalars['String']['output']>;
|
||||
domainName?: Maybe<Scalars['String']['output']>;
|
||||
@@ -1205,6 +1188,13 @@ export type RelationEdge = {
|
||||
node: Relation;
|
||||
};
|
||||
|
||||
export type GetManyDatabaseConnectionsQueryVariables = Exact<{
|
||||
input: RemoteServerTypeInput;
|
||||
}>;
|
||||
|
||||
|
||||
export type GetManyDatabaseConnectionsQuery = { __typename?: 'Query', findManyRemoteServersByType: Array<{ __typename?: 'RemoteServer', id: string, createdAt: any, foreignDataWrapperId: string, foreignDataWrapperOptions?: any | null, foreignDataWrapperType: string, updatedAt: any }> };
|
||||
|
||||
export type CreateOneObjectMetadataItemMutationVariables = Exact<{
|
||||
input: CreateOneObjectInput;
|
||||
}>;
|
||||
@@ -1254,7 +1244,7 @@ export type DeleteOneFieldMetadataItemMutationVariables = Exact<{
|
||||
}>;
|
||||
|
||||
|
||||
export type DeleteOneFieldMetadataItemMutation = { __typename?: 'Mutation', deleteOneField: { __typename?: 'FieldDeleteResponse', id?: string | null, type?: FieldMetadataType | null, name?: string | null, label?: string | null, description?: string | null, icon?: string | null, isCustom?: boolean | null, isActive?: boolean | null, isNullable?: boolean | null, createdAt?: any | null, updatedAt?: any | null } };
|
||||
export type DeleteOneFieldMetadataItemMutation = { __typename?: 'Mutation', deleteOneField: { __typename?: 'field', id: string, type: FieldMetadataType, name: string, label: string, description?: string | null, icon?: string | null, isCustom?: boolean | null, isActive?: boolean | null, isNullable?: boolean | null, createdAt: any, updatedAt: any } };
|
||||
|
||||
export type ObjectMetadataItemsQueryVariables = Exact<{
|
||||
objectFilter?: InputMaybe<ObjectFilter>;
|
||||
@@ -1265,6 +1255,7 @@ export type ObjectMetadataItemsQueryVariables = Exact<{
|
||||
export type ObjectMetadataItemsQuery = { __typename?: 'Query', objects: { __typename?: 'ObjectConnection', 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, isRemote: boolean, isActive: boolean, isSystem: boolean, createdAt: any, updatedAt: any, labelIdentifierFieldMetadataId?: string | null, imageIdentifierFieldMetadataId?: string | null, fields: { __typename?: 'ObjectFieldsConnection', edges: Array<{ __typename?: 'fieldEdge', node: { __typename?: 'field', id: string, type: FieldMetadataType, name: string, label: string, description?: string | null, icon?: string | null, isCustom?: boolean | null, isActive?: boolean | null, isSystem?: boolean | null, isNullable?: boolean | null, createdAt: any, updatedAt: any, defaultValue?: any | null, options?: any | null, fromRelationMetadata?: { __typename?: 'relation', id: string, relationType: RelationMetadataType, toFieldMetadataId: string, toObjectMetadata: { __typename?: 'object', id: string, dataSourceId: string, nameSingular: string, namePlural: string, isSystem: boolean } } | null, toRelationMetadata?: { __typename?: 'relation', id: string, relationType: RelationMetadataType, fromFieldMetadataId: string, fromObjectMetadata: { __typename?: 'object', id: string, dataSourceId: string, nameSingular: string, namePlural: string, isSystem: boolean } } | null, relationDefinition?: { __typename?: 'RelationDefinition', direction: RelationDefinitionType, sourceObjectMetadata: { __typename?: 'object', id: string, nameSingular: string, namePlural: string }, sourceFieldMetadata: { __typename?: 'field', id: string, name: string }, targetObjectMetadata: { __typename?: 'object', id: string, nameSingular: string, namePlural: string }, targetFieldMetadata: { __typename?: 'field', id: string, name: string } } | null } }>, 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 GetManyDatabaseConnectionsDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"GetManyDatabaseConnections"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"RemoteServerTypeInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"findManyRemoteServersByType"},"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":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"foreignDataWrapperId"}},{"kind":"Field","name":{"kind":"Name","value":"foreignDataWrapperOptions"}},{"kind":"Field","name":{"kind":"Name","value":"foreignDataWrapperType"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}}]}}]}}]} as unknown as DocumentNode<GetManyDatabaseConnectionsQuery, GetManyDatabaseConnectionsQueryVariables>;
|
||||
export const CreateOneObjectMetadataItemDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"mutation","name":{"kind":"Name","value":"CreateOneObjectMetadataItem"},"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"}},{"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":"labelIdentifierFieldMetadataId"}},{"kind":"Field","name":{"kind":"Name","value":"imageIdentifierFieldMetadataId"}}]}}]}}]} as unknown as DocumentNode<CreateOneObjectMetadataItemMutation, CreateOneObjectMetadataItemMutationVariables>;
|
||||
export const CreateOneFieldMetadataItemDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"mutation","name":{"kind":"Name","value":"CreateOneFieldMetadataItem"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"CreateOneFieldMetadataInput"}}}}],"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":"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":"defaultValue"}},{"kind":"Field","name":{"kind":"Name","value":"options"}}]}}]}}]} as unknown as DocumentNode<CreateOneFieldMetadataItemMutation, CreateOneFieldMetadataItemMutationVariables>;
|
||||
export const CreateOneRelationMetadataDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"mutation","name":{"kind":"Name","value":"CreateOneRelationMetadata"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"input"}},"type":{"kind":"NonNullType","type":{"kind":"NamedType","name":{"kind":"Name","value":"CreateOneRelationInput"}}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"createOneRelation"},"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":"relationType"}},{"kind":"Field","name":{"kind":"Name","value":"fromObjectMetadataId"}},{"kind":"Field","name":{"kind":"Name","value":"toObjectMetadataId"}},{"kind":"Field","name":{"kind":"Name","value":"fromFieldMetadataId"}},{"kind":"Field","name":{"kind":"Name","value":"toFieldMetadataId"}},{"kind":"Field","name":{"kind":"Name","value":"createdAt"}},{"kind":"Field","name":{"kind":"Name","value":"updatedAt"}}]}}]}}]} as unknown as DocumentNode<CreateOneRelationMetadataMutation, CreateOneRelationMetadataMutationVariables>;
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
import { gql } from '@apollo/client';
|
||||
|
||||
export const GET_MANY_DATABASE_CONNECTIONS = gql`
|
||||
query GetManyDatabaseConnections($input: RemoteServerTypeInput!) {
|
||||
findManyRemoteServersByType(input: $input) {
|
||||
id
|
||||
createdAt
|
||||
foreignDataWrapperId
|
||||
foreignDataWrapperOptions
|
||||
foreignDataWrapperType
|
||||
updatedAt
|
||||
}
|
||||
}
|
||||
`;
|
||||
@@ -0,0 +1,37 @@
|
||||
import { useQuery } from '@apollo/client';
|
||||
|
||||
import { GET_MANY_DATABASE_CONNECTIONS } from '@/databases/graphql/queries/findManyDatabaseConnections';
|
||||
import { useApolloMetadataClient } from '@/object-metadata/hooks/useApolloMetadataClient';
|
||||
import {
|
||||
GetManyDatabaseConnectionsQuery,
|
||||
GetManyDatabaseConnectionsQueryVariables,
|
||||
} from '~/generated-metadata/graphql';
|
||||
|
||||
type UseGetDatabaseConnectionsParams = {
|
||||
databaseKey: string;
|
||||
skip?: boolean;
|
||||
};
|
||||
|
||||
export const useGetDatabaseConnections = ({
|
||||
databaseKey,
|
||||
skip,
|
||||
}: UseGetDatabaseConnectionsParams) => {
|
||||
const apolloMetadataClient = useApolloMetadataClient();
|
||||
|
||||
const { data } = useQuery<
|
||||
GetManyDatabaseConnectionsQuery,
|
||||
GetManyDatabaseConnectionsQueryVariables
|
||||
>(GET_MANY_DATABASE_CONNECTIONS, {
|
||||
client: apolloMetadataClient ?? undefined,
|
||||
skip: skip || !apolloMetadataClient || databaseKey !== 'postgresql',
|
||||
variables: {
|
||||
input: {
|
||||
foreignDataWrapperType: 'postgres_fdw',
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
return {
|
||||
connections: data?.findManyRemoteServersByType || [],
|
||||
};
|
||||
};
|
||||
@@ -25,7 +25,7 @@ const StyledInputsContainer = styled.div`
|
||||
'input-2 input-3'
|
||||
'input-4 input-5';
|
||||
|
||||
& :first-child {
|
||||
& :first-of-type {
|
||||
grid-area: input-1;
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -4,18 +4,14 @@ import { IconChevronRight } from 'twenty-ui';
|
||||
|
||||
import { SettingsListCard } from '@/settings/components/SettingsListCard';
|
||||
import { SettingsIntegrationDatabaseConnectedTablesStatus } from '@/settings/integrations/components/SettingsIntegrationDatabaseConnectedTablesStatus';
|
||||
import { SettingsIntegration } from '@/settings/integrations/types/SettingsIntegration';
|
||||
import { LightIconButton } from '@/ui/input/button/components/LightIconButton';
|
||||
import { RemoteServer } from '~/generated-metadata/graphql';
|
||||
import { mockedRemoteObjectIntegrations } from '~/testing/mock-data/remoteObjectDatabases';
|
||||
|
||||
type SettingsIntegrationDatabaseConnectionsListCardProps = {
|
||||
databaseLogoUrl: string;
|
||||
connections: {
|
||||
id: string;
|
||||
key: string;
|
||||
name: string;
|
||||
tables: {
|
||||
name: string;
|
||||
}[];
|
||||
}[];
|
||||
integration: SettingsIntegration;
|
||||
connections: RemoteServer[];
|
||||
};
|
||||
|
||||
const StyledDatabaseLogoContainer = styled.div`
|
||||
@@ -37,29 +33,39 @@ const StyledRowRightContainer = styled.div`
|
||||
`;
|
||||
|
||||
export const SettingsIntegrationDatabaseConnectionsListCard = ({
|
||||
databaseLogoUrl,
|
||||
integration,
|
||||
connections,
|
||||
}: SettingsIntegrationDatabaseConnectionsListCardProps) => {
|
||||
const navigate = useNavigate();
|
||||
|
||||
// TODO: Use real remote database tables data from backend
|
||||
const tables = mockedRemoteObjectIntegrations[0].connections[0].tables;
|
||||
|
||||
const getConnectionDbName = (connection: RemoteServer) =>
|
||||
integration.from.key === 'postgresql'
|
||||
? connection.foreignDataWrapperOptions?.dbname
|
||||
: '';
|
||||
|
||||
return (
|
||||
<SettingsListCard
|
||||
items={connections}
|
||||
RowIcon={() => (
|
||||
<StyledDatabaseLogoContainer>
|
||||
<StyledDatabaseLogo alt="" src={databaseLogoUrl} />
|
||||
<StyledDatabaseLogo alt="" src={integration.from.image} />
|
||||
</StyledDatabaseLogoContainer>
|
||||
)}
|
||||
RowRightComponent={({ item: connection }) => (
|
||||
RowRightComponent={({ item: _connection }) => (
|
||||
<StyledRowRightContainer>
|
||||
<SettingsIntegrationDatabaseConnectedTablesStatus
|
||||
connectedTablesCount={connection.tables.length}
|
||||
connectedTablesCount={tables.length}
|
||||
/>
|
||||
<LightIconButton Icon={IconChevronRight} accent="tertiary" />
|
||||
</StyledRowRightContainer>
|
||||
)}
|
||||
onRowClick={(connection) => navigate(`./${connection.key}`)}
|
||||
getItemLabel={(connection) => connection.name}
|
||||
onRowClick={(connection) =>
|
||||
navigate(`./${getConnectionDbName(connection)}`)
|
||||
}
|
||||
getItemLabel={getConnectionDbName}
|
||||
hasFooter
|
||||
footerButtonLabel="Add connection"
|
||||
onFooterButtonClick={() => navigate('./new')}
|
||||
|
||||
@@ -2,6 +2,7 @@ import { useEffect } from 'react';
|
||||
import { useNavigate, useParams } from 'react-router-dom';
|
||||
import { IconSettings } from 'twenty-ui';
|
||||
|
||||
import { useGetDatabaseConnections } from '@/databases/hooks/useGetDatabaseConnections';
|
||||
import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
|
||||
import { SettingsIntegrationDatabaseConnectionsListCard } from '@/settings/integrations/components/SettingsIntegrationDatabaseConnectionsListCard';
|
||||
import { SettingsIntegrationPreview } from '@/settings/integrations/components/SettingsIntegrationPreview';
|
||||
@@ -14,7 +15,6 @@ import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer'
|
||||
import { Section } from '@/ui/layout/section/components/Section';
|
||||
import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
|
||||
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
|
||||
import { mockedRemoteObjectIntegrations } from '~/testing/mock-data/remoteObjectDatabases';
|
||||
|
||||
export const SettingsIntegrationDatabase = () => {
|
||||
const { databaseKey = '' } = useParams();
|
||||
@@ -42,12 +42,12 @@ export const SettingsIntegrationDatabase = () => {
|
||||
}
|
||||
}, [integration, databaseKey, navigate, isIntegrationAvailable]);
|
||||
|
||||
if (!isIntegrationAvailable) return null;
|
||||
const { connections } = useGetDatabaseConnections({
|
||||
databaseKey,
|
||||
skip: !isIntegrationAvailable,
|
||||
});
|
||||
|
||||
const connections =
|
||||
mockedRemoteObjectIntegrations.find(
|
||||
({ key }) => key === integration.from.key,
|
||||
)?.connections || [];
|
||||
if (!isIntegrationAvailable) return null;
|
||||
|
||||
return (
|
||||
<SubMenuTopBarContainer Icon={IconSettings} title="Settings">
|
||||
@@ -70,7 +70,7 @@ export const SettingsIntegrationDatabase = () => {
|
||||
description={`Connect or access your ${integration.text} data`}
|
||||
/>
|
||||
<SettingsIntegrationDatabaseConnectionsListCard
|
||||
databaseLogoUrl={integration.from.image}
|
||||
integration={integration}
|
||||
connections={connections}
|
||||
/>
|
||||
</Section>
|
||||
|
||||
@@ -1,5 +1,8 @@
|
||||
import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
|
||||
import { FieldMetadataType, RelationMetadataType } from '~/generated/graphql';
|
||||
import {
|
||||
FieldMetadataType,
|
||||
RelationMetadataType,
|
||||
} from '~/generated-metadata/graphql';
|
||||
|
||||
export const mockObjectMetadataItem: ObjectMetadataItem = {
|
||||
__typename: 'object',
|
||||
|
||||
Reference in New Issue
Block a user