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

feat: add Display calendar settings (#4164)

Browse Source 
* feat: add Color calendar setting

Closes #4067

* fix: fix wrong imports

* feat: add Display calendar settings

Closes #4068

* feat: add 12h/24h in Format option labels

* fix tests

* Fix

* Fix

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
Thaïs
2024-02-24 08:50:32 -03:00
committed by GitHub
parent a993155fb0
commit 3d809d5317
16 changed files with 926 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendars.tsx
View File

@ -1,24 +1,62 @@
import { SettingsAccountsCalendarSettingsSection } from '@/settings/accounts/components/SettingsAccountsCalendarSettingsSection';
import { useRecoilValue } from 'recoil';
import { ConnectedAccount } from '@/accounts/types/ConnectedAccount';
import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
import { SettingsAccountsCalendarAccountsListCard } from '@/settings/accounts/components/SettingsAccountsCalendarAccountsListCard';
import { SettingsAccountsCalendarDisplaySettings } from '@/settings/accounts/components/SettingsAccountsCalendarDisplaySettings';
import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
import { SettingsPath } from '@/types/SettingsPath';
import { IconSettings } from '@/ui/display/icon';
import { H2Title } from '@/ui/display/typography/components/H2Title';
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 { mockedConnectedAccounts } from '~/testing/mock-data/accounts';
export const SettingsAccountsCalendars = () => (
<SubMenuTopBarContainer Icon={IconSettings} title="Settings">
<SettingsPageContainer>
<Breadcrumb
links={[
{
children: 'Accounts',
href: getSettingsPagePath(SettingsPath.Accounts),
},
{ children: 'Calendars' },
]}
/>
<SettingsAccountsCalendarSettingsSection />
</SettingsPageContainer>
</SubMenuTopBarContainer>
);
export const SettingsAccountsCalendars = () => {
const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
const { records: _accounts } = useFindManyRecords<ConnectedAccount>({
objectNameSingular: CoreObjectNameSingular.ConnectedAccount,
filter: {
accountOwnerId: {
eq: currentWorkspaceMember?.id,
},
},
});
return (
<SubMenuTopBarContainer Icon={IconSettings} title="Settings">
<SettingsPageContainer>
<Breadcrumb
links={[
{
children: 'Accounts',
href: getSettingsPagePath(SettingsPath.Accounts),
},
{ children: 'Calendars' },
]}
/>
<Section>
<H2Title
title="Calendar settings"
description="Sync your calendars and set your preferences"
/>
<SettingsAccountsCalendarAccountsListCard />
</Section>
{/* TODO: retrieve connected accounts data from back-end when the Calendar feature is ready. */}
{!!mockedConnectedAccounts.length && (
<Section>
<H2Title
title="Display"
description="Configure how we should display your events in your calendar"
/>
<SettingsAccountsCalendarDisplaySettings />
</Section>
)}
</SettingsPageContainer>
</SubMenuTopBarContainer>
);
};

12
packages/twenty-front/src/pages/settings/accounts/SettingsAccountsEmails.tsx
View File

@ -1,7 +1,9 @@
import { SettingsAccountsEmailsSyncSection } from '@/settings/accounts/components/SettingsAccountsEmailsSyncSection';
import { SettingsAccountsEmailsAccountsListCard } from '@/settings/accounts/components/SettingsAccountsEmailsAccountsListCard';
import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
import { IconSettings } from '@/ui/display/icon';
import { H2Title } from '@/ui/display/typography/components/H2Title';
import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
import { Section } from '@/ui/layout/section/components/Section';
import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
export const SettingsAccountsEmails = () => (
@ -13,7 +15,13 @@ export const SettingsAccountsEmails = () => (
{ children: 'Emails' },
]}
/>
<SettingsAccountsEmailsSyncSection />
<Section>
<H2Title
title="Emails sync"
description="Sync your inboxes and set your privacy settings"
/>
<SettingsAccountsEmailsAccountsListCard />
</Section>
</SettingsPageContainer>
</SubMenuTopBarContainer>
);