refactoring

twentyhq · bosiraphael · Mar 27, 2024 · Mar 21, 2024 · Mar 21, 2024 · Mar 21, 2024
commit aeb95d10339bfa71f9180bb401533b953c8548cf
diff --git a/...c/modules/settings/accounts/components/SettingsAccountsCalendarVisibilitySettingsCard.tsx b/...c/modules/settings/accounts/components/SettingsAccountsCalendarVisibilitySettingsCard.tsx
@@ -1,16 +1,12 @@
 import styled from '@emotion/styled';
 
+import { CalendarChannelVisibilityValue } from '@/accounts/types/CalendarChannel';
 import { SettingsAccountsRadioSettingsCard } from '@/settings/accounts/components/SettingsAccountsRadioSettingsCard';
 import { SettingsAccountsVisibilitySettingCardMedia } from '@/settings/accounts/components/SettingsAccountsVisibilitySettingCardMedia';
 
-export enum EventSettingsVisibilityValue {
-  Everything = 'share_everything',
-  Metadata = 'metadata',
-}
-
 type SettingsAccountsEventVisibilitySettingsCardProps = {
-  onChange: (nextValue: EventSettingsVisibilityValue) => void;
-  value?: EventSettingsVisibilityValue;
+  onChange: (nextValue: CalendarChannelVisibilityValue) => void;
+  value?: CalendarChannelVisibilityValue;
 };
 
 const StyledCardMedia = styled(SettingsAccountsVisibilitySettingCardMedia)`
@@ -21,20 +17,20 @@ const eventSettingsVisibilityOptions = [
   {
     title: 'Everything',
     description: 'The whole event details will be shared with your team.',
-    value: EventSettingsVisibilityValue.Everything,
+    value: CalendarChannelVisibilityValue.Everything,
     cardMedia: <StyledCardMedia subject="active" body="active" />,
   },
   {
     title: 'Metadata',
     description: 'Only date & participants will be shared with your team.',
-    value: EventSettingsVisibilityValue.Metadata,
+    value: CalendarChannelVisibilityValue.Metadata,
     cardMedia: <StyledCardMedia subject="active" body="inactive" />,
   },
 ];
 
 export const SettingsAccountsEventVisibilitySettingsCard = ({
   onChange,
-  value = EventSettingsVisibilityValue.Everything,
+  value = CalendarChannelVisibilityValue.Everything,
 }: SettingsAccountsEventVisibilitySettingsCardProps) => (
   <SettingsAccountsRadioSettingsCard
     options={eventSettingsVisibilityOptions}

diff --git a/...twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx b/...twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx
@@ -12,12 +12,12 @@ import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
 
 type SettingsAccountsRowDropdownMenuProps = {
-  account: Pick<ConnectedAccount, 'id' | 'messageChannels'>;
+  accountOrChannel: Pick<ConnectedAccount, 'id' | 'messageChannels'>;
   className?: string;
 };
 
 export const SettingsAccountsRowDropdownMenu = ({
-  account,
+  accountOrChannel: account,
   className,
 }: SettingsAccountsRowDropdownMenuProps) => {
   const dropdownId = `settings-account-row-${account.id}`;

diff --git a/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendars.tsx b/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendars.tsx
@@ -22,25 +22,23 @@ import { Breadcrumb } from '@/ui/navigation/bread-crumb/components/Breadcrumb';
 
 export const SettingsAccountsCalendars = () => {
   const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
-  const { records: accounts, loading: accountsLoading } =
-    useFindManyRecords<ConnectedAccount>({
-      objectNameSingular: CoreObjectNameSingular.ConnectedAccount,
-      filter: {
-        accountOwnerId: {
-          eq: currentWorkspaceMember?.id,
-        },
+  const { records: accounts } = useFindManyRecords<ConnectedAccount>({
+    objectNameSingular: CoreObjectNameSingular.ConnectedAccount,
+    filter: {
+      accountOwnerId: {
+        eq: currentWorkspaceMember?.id,
       },
-    });
+    },
+  });
 
-  const { records: calendarChannels, loading: calendarChannelsLoading } =
-    useFindManyRecords<CalendarChannel>({
-      objectNameSingular: CoreObjectNameSingular.CalendarChannel,
-      filter: {
-        connectedAccountId: {
-          in: accounts.map((account) => account.id),
-        },
+  const { records: calendarChannels } = useFindManyRecords<CalendarChannel>({
+    objectNameSingular: CoreObjectNameSingular.CalendarChannel,
+    filter: {
+      connectedAccountId: {
+        in: accounts.map((account) => account.id),
       },
-    });
+    },
+  });
 
   const exampleStartDate = new Date();
   const exampleEndDate = min([

diff --git a/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendarsSettings.tsx b/packages/twenty-front/src/pages/settings/accounts/SettingsAccountsCalendarsSettings.tsx
@@ -1,4 +1,5 @@
-import { useParams } from 'react-router-dom';
+import { useEffect } from 'react';
+import { useNavigate, useParams } from 'react-router-dom';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 
@@ -9,14 +10,12 @@ import {
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
 import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
-import {
-  EventSettingsVisibilityValue,
-  SettingsAccountsEventVisibilitySettingsCard,
-} from '@/settings/accounts/components/SettingsAccountsCalendarVisibilitySettingsCard';
+import { SettingsAccountsEventVisibilitySettingsCard } from '@/settings/accounts/components/SettingsAccountsCalendarVisibilitySettingsCard';
 import { SettingsAccountsCardMedia } from '@/settings/accounts/components/SettingsAccountsCardMedia';
 import { SettingsAccountsToggleSettingCard } from '@/settings/accounts/components/SettingsAccountsToggleSettingCard';
 import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
 import { getSettingsPagePath } from '@/settings/utils/getSettingsPagePath';
+import { AppPath } from '@/types/AppPath';
 import { SettingsPath } from '@/types/SettingsPath';
 import { IconRefresh, IconSettings, IconUser } from '@/ui/display/icon';
 import { H2Title } from '@/ui/display/typography/components/H2Title';
@@ -30,6 +29,7 @@ const StyledCardMedia = styled(SettingsAccountsCardMedia)`
 
 export const SettingsAccountsCalendarsSettings = () => {
   const theme = useTheme();
+  const navigate = useNavigate();
 
   const { accountUuid: calendarChannelId = '' } = useParams();
 
@@ -61,6 +61,12 @@ export const SettingsAccountsCalendarsSettings = () => {
     });
   };
 
+  useEffect(() => {
+    if (!loading && !calendarChannel) navigate(AppPath.NotFound);
+  }, [loading, calendarChannel, navigate]);
+
+  if (!calendarChannel) return null;
+
   return (
     <SubMenuTopBarContainer Icon={IconSettings} title="Settings">
       <SettingsPageContainer>
@@ -83,8 +89,8 @@ export const SettingsAccountsCalendarsSettings = () => {
             description="Define what will be visible to other users in your workspace"
           />
           <SettingsAccountsEventVisibilitySettingsCard
-            value={EventSettingsVisibilityValue.Everything}
-            onChange={(_value) => {}}
+            value={calendarChannel.visibility}
+            onChange={handleVisibilityChange}
           />
         </Section>
         <Section>
@@ -102,8 +108,8 @@ export const SettingsAccountsCalendarsSettings = () => {
               </StyledCardMedia>
             }
             title="Auto-creation"
-            value={false}
-            onToggle={(_value) => {}}
+            value={!!calendarChannel.isContactAutoCreationEnabled}
+            onToggle={handleContactAutoCreationToggle}
           />
         </Section>
         <Section>
@@ -121,7 +127,7 @@ export const SettingsAccountsCalendarsSettings = () => {
               </StyledCardMedia>
             }
             title="Sync events"
-            value={false}
+            value={!!calendarChannel.isSyncEnabled}
             onToggle={(_value) => {}}
           />
         </Section>