0f0a7966b1
## What it does ### Backend - [x] Add a mutation to create OIDC and SAML configuration - [x] Add a mutation to delete an SSO config - [x] Add a feature flag to toggle SSO - [x] Add a mutation to activate/deactivate an SSO config - [x] Add a mutation to delete an SSO config - [x] Add strategy to use OIDC or SAML - [ ] Improve error management ### Frontend - [x] Add section "security" in settings - [x] Add page to list SSO configurations - [x] Add page and forms to create OIDC or SAML configuration - [x] Add field to "connect with SSO" in the signin/signup process - [x] Trigger auth when a user switch to a workspace with SSO enable - [x] Add an option on the security page to activate/deactivate the global invitation link - [ ] Add new Icons for SSO Identity Providers (okta, Auth0, Azure, Microsoft) --------- Co-authored-by: Félix Malfait <felix@twenty.com> Co-authored-by: Charles Bochet <charles@twenty.com>
91 lines
2.9 KiB
TypeScript
91 lines
2.9 KiB
TypeScript
import { CalendarChannel } from '@/accounts/types/CalendarChannel';
|
|
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
|
import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
|
|
import { SettingsAccountsEventVisibilitySettingsCard } from '@/settings/accounts/components/SettingsAccountsCalendarVisibilitySettingsCard';
|
|
import styled from '@emotion/styled';
|
|
import { Section } from '@react-email/components';
|
|
import { H2Title } from 'twenty-ui';
|
|
import { CalendarChannelVisibility } from '~/generated-metadata/graphql';
|
|
import { Card } from '@/ui/layout/card/components/Card';
|
|
import { SettingsOptionCardContent } from '@/settings/components/SettingsOptionCardContent';
|
|
import { Toggle } from '@/ui/input/components/Toggle';
|
|
|
|
const StyledDetailsContainer = styled.div`
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: ${({ theme }) => theme.spacing(6)};
|
|
`;
|
|
|
|
type SettingsAccountsCalendarChannelDetailsProps = {
|
|
calendarChannel: Pick<
|
|
CalendarChannel,
|
|
'id' | 'visibility' | 'isContactAutoCreationEnabled' | 'isSyncEnabled'
|
|
>;
|
|
};
|
|
|
|
const StyledToggle = styled(Toggle)`
|
|
margin-left: auto;
|
|
`;
|
|
|
|
export const SettingsAccountsCalendarChannelDetails = ({
|
|
calendarChannel,
|
|
}: SettingsAccountsCalendarChannelDetailsProps) => {
|
|
const { updateOneRecord } = useUpdateOneRecord<CalendarChannel>({
|
|
objectNameSingular: CoreObjectNameSingular.CalendarChannel,
|
|
});
|
|
|
|
const handleVisibilityChange = (value: CalendarChannelVisibility) => {
|
|
updateOneRecord({
|
|
idToUpdate: calendarChannel.id,
|
|
updateOneRecordInput: {
|
|
visibility: value,
|
|
},
|
|
});
|
|
};
|
|
|
|
const handleContactAutoCreationToggle = (value: boolean) => {
|
|
updateOneRecord({
|
|
idToUpdate: calendarChannel.id,
|
|
updateOneRecordInput: {
|
|
isContactAutoCreationEnabled: value,
|
|
},
|
|
});
|
|
};
|
|
|
|
return (
|
|
<StyledDetailsContainer>
|
|
<Section>
|
|
<H2Title
|
|
title="Event visibility"
|
|
description="Define what will be visible to other users in your workspace"
|
|
/>
|
|
<SettingsAccountsEventVisibilitySettingsCard
|
|
value={calendarChannel.visibility}
|
|
onChange={handleVisibilityChange}
|
|
/>
|
|
</Section>
|
|
<Section>
|
|
<H2Title
|
|
title="Contact auto-creation"
|
|
description="Automatically create contacts for people you've participated in an event with."
|
|
/>
|
|
<Card>
|
|
<SettingsOptionCardContent
|
|
title="Auto-creation"
|
|
description="Automatically create contacts for people."
|
|
onClick={() =>
|
|
handleContactAutoCreationToggle(
|
|
!calendarChannel.isContactAutoCreationEnabled,
|
|
)
|
|
}
|
|
>
|
|
<StyledToggle
|
|
value={calendarChannel.isContactAutoCreationEnabled}
|
|
/>
|
|
</SettingsOptionCardContent>
|
|
</Card>
|
|
</Section>
|
|
</StyledDetailsContainer>
|
|
);
|
|
};
|