admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: create Settings/Accounts/Calendars page (#4090)

Browse Source 
* feat: create Settings/Accounts/Calendars page

Closes #4059

* docs: add SettingsAccountsCalendars stories

* refactor: add SettingsNavigationDrawerItem component
This commit is contained in:
Thaïs
2024-02-20 15:28:15 -03:00
committed by GitHub
parent 4552e98b7f
commit 11581ca9c3
14 changed files with 184 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsSettingsSection.tsx
View File

@ -2,9 +2,12 @@ import { useNavigate } from 'react-router-dom';
import styled from '@emotion/styled';
import { SettingsNavigationCard } from '@/settings/components/SettingsNavigationCard';
import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
import { SettingsPath } from '@/types/SettingsPath';
import { IconCalendarEvent, IconMailCog } from '@/ui/display/icon';
import { H2Title } from '@/ui/display/typography/components/H2Title';
import { Section } from '@/ui/layout/section/components/Section';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
const StyledCardsContainer = styled.div`
display: flex;
@ -12,12 +15,9 @@ const StyledCardsContainer = styled.div`
margin-top: ${({ theme }) => theme.spacing(6)};
`;
const StyledSettingsNavigationCard = styled(SettingsNavigationCard)`
color: ${({ theme }) => theme.font.color.extraLight};
`;
export const SettingsAccountsSettingsSection = () => {
const navigate = useNavigate();
const isCalendarEnabled = useIsFeatureEnabled('IS_CALENDAR_ENABLED');
return (
<Section>
@ -29,18 +29,22 @@ export const SettingsAccountsSettingsSection = () => {
<SettingsNavigationCard
Icon={IconMailCog}
title="Emails"
onClick={() => navigate('/settings/accounts/emails')}
onClick={() =>
navigate(getSettingsPagePath(SettingsPath.AccountsEmails))
}
>
Set email visibility, manage your blocklist and more.
</SettingsNavigationCard>
<StyledSettingsNavigationCard
<SettingsNavigationCard
Icon={IconCalendarEvent}
title="Calendar"
disabled
hasSoonPill
soon={!isCalendarEnabled}
onClick={() =>
navigate(getSettingsPagePath(SettingsPath.AccountsCalendars))
}
>
Configure and customize your calendar preferences.
</StyledSettingsNavigationCard>
</SettingsNavigationCard>
</StyledCardsContainer>
</Section>
);