Files
twenty/packages/twenty-front/src/modules/settings/integrations/database-connection/hooks/useDatabaseConnection.ts
gitstart-app[bot] b09ecfbb8c Migrate to twenty-ui - display (#8004)
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-6871](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-6871).

 --- 

### Description

Migrate:

- Info display component
- Status display component
- SeparatorLineText display component

### Demo

###### SeparatorLineText In Storybook


![](https://assets-service.gitstart.com/4814/c0a2cd49-e545-469a-b3d3-c02eb462b60d.png)

Info Component on Storybook


![](https://assets-service.gitstart.com/4814/6f3019c5-99e0-4365-a81e-241294887f9e.png)

Status Component on Storybook


![](https://assets-service.gitstart.com/4814/29b5142a-468f-4d7e-88ff-4f3bfdd5abda.png)

###### Fixes twentyhq/private-issues#95

---------

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
2024-10-24 17:50:14 +02:00

57 lines
1.7 KiB
TypeScript

import { WatchQueryFetchPolicy } from '@apollo/client';
import { useEffect } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import { useGetDatabaseConnection } from '@/databases/hooks/useGetDatabaseConnection';
import { useGetDatabaseConnectionTables } from '@/databases/hooks/useGetDatabaseConnectionTables';
import { useIsSettingsIntegrationEnabled } from '@/settings/integrations/hooks/useIsSettingsIntegrationEnabled';
import { useSettingsIntegrationCategories } from '@/settings/integrations/hooks/useSettingsIntegrationCategories';
import { AppPath } from '@/types/AppPath';
export const useDatabaseConnection = ({
fetchPolicy,
}: {
fetchPolicy?: WatchQueryFetchPolicy;
}) => {
const { databaseKey = '', connectionId = '' } = useParams();
const navigate = useNavigate();
const [integrationCategoryAll] = useSettingsIntegrationCategories();
const integration = integrationCategoryAll.integrations.find(
({ from: { key } }) => key === databaseKey,
);
const isIntegrationEnabled = useIsSettingsIntegrationEnabled(databaseKey);
const isIntegrationAvailable = !!integration && isIntegrationEnabled;
const { connection, loading } = useGetDatabaseConnection({
databaseKey,
connectionId,
skip: !isIntegrationAvailable,
fetchPolicy,
});
useEffect(() => {
if (!isIntegrationAvailable || (!loading && !connection)) {
navigate(AppPath.NotFound);
}
}, [
integration,
databaseKey,
navigate,
isIntegrationAvailable,
connection,
loading,
]);
const { tables } = useGetDatabaseConnectionTables({
connectionId,
skip: !connection,
shouldFetchPendingSchemaUpdates: true,
fetchPolicy,
});
return { connection, integration, databaseKey, tables };
};