mukeshs/twenty_crm
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: add Active and Add integration card displays (#4591)

Browse Source 
* feat: add Active and Add integration card displays

Closes #4541

* docs: add PaymentSuccess page stories

* refactor: move page components
This commit is contained in:
Thaïs
2024-03-25 18:53:30 +01:00
committed by GitHub
parent 6ab43c608f
commit 8baa59b6f4
19 changed files with 242 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
packages/twenty-front/src/modules/settings/integrations/components/SettingsIntegrationGroup.tsx
View File

@ -1,9 +1,9 @@
import styled from '@emotion/styled';
import { SettingsIntegrationComponent } from '@/settings/integrations/components/SettingsIntegrationComponent';
import { SettingsIntegrationCategory } from '@/settings/integrations/types/SettingsIntegrationCategory';
import { H2Title } from '@/ui/display/typography/components/H2Title';
import { Section } from '@/ui/layout/section/components/Section';
import { SettingsIntegrationCategory } from '~/pages/settings/integrations/types/SettingsIntegrationCategory';
interface SettingsIntegrationGroupProps {
integrationGroup: SettingsIntegrationCategory;
@ -33,28 +33,30 @@ const StyledIntegrationsSection = styled.div`
export const SettingsIntegrationGroup = ({
integrationGroup,
}: SettingsIntegrationGroupProps) => {
const openLinkInTab = (link: string) => {
window.open(link);
};
return (
<Section>
<StyledIntegrationGroupHeader>
<H2Title title={integrationGroup.title} />
{integrationGroup.hyperlink && (
<StyledGroupLink
onClick={() => openLinkInTab(integrationGroup.hyperlink ?? '')}
>
<div>{integrationGroup.hyperlinkText}</div>
<div>→</div>
</StyledGroupLink>
)}
</StyledIntegrationGroupHeader>
<StyledIntegrationsSection>
{integrationGroup.integrations.map((integration) => {
return <SettingsIntegrationComponent integration={integration} />;
})}
</StyledIntegrationsSection>
</Section>
);
};
}: SettingsIntegrationGroupProps) => (
<Section>
<StyledIntegrationGroupHeader>
<H2Title title={integrationGroup.title} />
{integrationGroup.hyperlink && (
<StyledGroupLink
onClick={() => window.open(integrationGroup.hyperlink ?? '')}
>
<div>{integrationGroup.hyperlinkText}</div>
<div>→</div>
</StyledGroupLink>
)}
</StyledIntegrationGroupHeader>
<StyledIntegrationsSection>
{integrationGroup.integrations.map((integration) => (
<SettingsIntegrationComponent
key={[
integrationGroup.key,
integration.from.key,
integration.to?.key,
].join('-')}
integration={integration}
/>
))}
</StyledIntegrationsSection>
</Section>
);