mirror of
https://github.com/twentyhq/twenty.git
synced 2024-11-25 01:04:58 +03:00
Merge branch 'main' into feat/delete-many-batch-front
This commit is contained in:
commit
2f4d75e5eb
@ -55,7 +55,6 @@ import { SettingsAccounts } from '~/pages/settings/accounts/SettingsAccounts';
|
||||
import { SettingsAccountsCalendars } from '~/pages/settings/accounts/SettingsAccountsCalendars';
|
||||
import { SettingsAccountsCalendarsSettings } from '~/pages/settings/accounts/SettingsAccountsCalendarsSettings';
|
||||
import { SettingsAccountsEmails } from '~/pages/settings/accounts/SettingsAccountsEmails';
|
||||
import { SettingsAccountsEmailsInboxSettings } from '~/pages/settings/accounts/SettingsAccountsEmailsInboxSettings';
|
||||
import { SettingsNewAccount } from '~/pages/settings/accounts/SettingsNewAccount';
|
||||
import { SettingsNewObject } from '~/pages/settings/data-model/SettingsNewObject';
|
||||
import { SettingsObjectDetail } from '~/pages/settings/data-model/SettingsObjectDetail';
|
||||
@ -188,10 +187,6 @@ const createRouter = (isBillingEnabled?: boolean) =>
|
||||
path={SettingsPath.AccountsEmails}
|
||||
element={<SettingsAccountsEmails />}
|
||||
/>
|
||||
<Route
|
||||
path={SettingsPath.AccountsEmailsInboxSettings}
|
||||
element={<SettingsAccountsEmailsInboxSettings />}
|
||||
/>
|
||||
<Route
|
||||
path={SettingsPath.Billing}
|
||||
element={<SettingsBilling />}
|
||||
|
@ -18,6 +18,8 @@ export const formatFieldMetadataItemsAsSortDefinitions = ({
|
||||
FieldMetadataType.Boolean,
|
||||
FieldMetadataType.Select,
|
||||
FieldMetadataType.Phone,
|
||||
FieldMetadataType.Email,
|
||||
FieldMetadataType.FullName,
|
||||
].includes(field.type)
|
||||
) {
|
||||
return acc;
|
||||
|
@ -2,7 +2,7 @@ import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
|
||||
import { OrderBy } from '@/object-metadata/types/OrderBy';
|
||||
import { hasPositionField } from '@/object-metadata/utils/hasPositionField';
|
||||
import { RecordGqlOperationOrderBy } from '@/object-record/graphql/types/RecordGqlOperationOrderBy';
|
||||
import { Field } from '~/generated/graphql';
|
||||
import { Field, FieldMetadataType } from '~/generated/graphql';
|
||||
import { mapArrayToObject } from '~/utils/array/mapArrayToObject';
|
||||
import { isDefined } from '~/utils/isDefined';
|
||||
import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull';
|
||||
@ -13,7 +13,8 @@ export const turnSortsIntoOrderBy = (
|
||||
objectMetadataItem: ObjectMetadataItem,
|
||||
sorts: Sort[],
|
||||
): RecordGqlOperationOrderBy => {
|
||||
const fields: Pick<Field, 'id' | 'name'>[] = objectMetadataItem?.fields ?? [];
|
||||
const fields: Pick<Field, 'id' | 'name' | 'type'>[] =
|
||||
objectMetadataItem?.fields ?? [];
|
||||
const fieldsById = mapArrayToObject(fields, ({ id }) => id);
|
||||
const sortsOrderBy = sorts
|
||||
.map((sort) => {
|
||||
@ -26,7 +27,7 @@ export const turnSortsIntoOrderBy = (
|
||||
const direction: OrderBy =
|
||||
sort.direction === 'asc' ? 'AscNullsFirst' : 'DescNullsLast';
|
||||
|
||||
return { [correspondingField.name]: direction };
|
||||
return getOrderByForFieldMetadataType(correspondingField, direction);
|
||||
})
|
||||
.filter(isDefined);
|
||||
|
||||
@ -36,3 +37,21 @@ export const turnSortsIntoOrderBy = (
|
||||
|
||||
return sortsOrderBy;
|
||||
};
|
||||
|
||||
const getOrderByForFieldMetadataType = (
|
||||
field: Pick<Field, 'id' | 'name' | 'type'>,
|
||||
direction: OrderBy,
|
||||
) => {
|
||||
switch (field.type) {
|
||||
case FieldMetadataType.FullName:
|
||||
return {
|
||||
[field.name]: {
|
||||
firstName: direction,
|
||||
lastName: direction,
|
||||
},
|
||||
};
|
||||
|
||||
default:
|
||||
return { [field.name]: direction };
|
||||
}
|
||||
};
|
||||
|
@ -33,12 +33,13 @@ export const RecordTableColumnDropdownMenu = ({
|
||||
const visibleTableColumns = useRecoilValue(visibleTableColumnsSelector());
|
||||
|
||||
const secondVisibleColumn = visibleTableColumns[1];
|
||||
const canMove = column.isLabelIdentifier !== true;
|
||||
const canMoveLeft =
|
||||
column.fieldMetadataId !== secondVisibleColumn?.fieldMetadataId;
|
||||
column.fieldMetadataId !== secondVisibleColumn?.fieldMetadataId && canMove;
|
||||
|
||||
const lastVisibleColumn = visibleTableColumns[visibleTableColumns.length - 1];
|
||||
const canMoveRight =
|
||||
column.fieldMetadataId !== lastVisibleColumn?.fieldMetadataId;
|
||||
column.fieldMetadataId !== lastVisibleColumn?.fieldMetadataId && canMove;
|
||||
|
||||
const { handleColumnVisibilityChange, handleMoveTableColumn } =
|
||||
useTableColumns();
|
||||
@ -83,7 +84,9 @@ export const RecordTableColumnDropdownMenu = ({
|
||||
|
||||
const isSortable = column.isSortable === true;
|
||||
const isFilterable = column.isFilterable === true;
|
||||
const showSeparator = isFilterable || isSortable;
|
||||
const showSeparator =
|
||||
(isFilterable || isSortable) && column.isLabelIdentifier !== true;
|
||||
const canHide = column.isLabelIdentifier !== true;
|
||||
|
||||
return (
|
||||
<DropdownMenuItemsContainer>
|
||||
@ -116,11 +119,13 @@ export const RecordTableColumnDropdownMenu = ({
|
||||
text="Move right"
|
||||
/>
|
||||
)}
|
||||
<MenuItem
|
||||
LeftIcon={IconEyeOff}
|
||||
onClick={handleColumnVisibility}
|
||||
text="Hide"
|
||||
/>
|
||||
{canHide && (
|
||||
<MenuItem
|
||||
LeftIcon={IconEyeOff}
|
||||
onClick={handleColumnVisibility}
|
||||
text="Hide"
|
||||
/>
|
||||
)}
|
||||
</DropdownMenuItemsContainer>
|
||||
);
|
||||
};
|
||||
|
@ -4,7 +4,6 @@ import { useRecoilCallback, useRecoilState, useRecoilValue } from 'recoil';
|
||||
import { IconPlus } from 'twenty-ui';
|
||||
|
||||
import { FieldMetadata } from '@/object-record/record-field/types/FieldMetadata';
|
||||
import { ColumnHead } from '@/object-record/record-table/components/ColumnHead';
|
||||
import { useRecordTableStates } from '@/object-record/record-table/hooks/internal/useRecordTableStates';
|
||||
import { useTableColumns } from '@/object-record/record-table/hooks/useTableColumns';
|
||||
import { ColumnDefinition } from '@/object-record/record-table/types/ColumnDefinition';
|
||||
@ -186,11 +185,7 @@ export const RecordTableHeaderCell = ({
|
||||
onMouseLeave={() => setIconVisibility(false)}
|
||||
>
|
||||
<StyledColumnHeadContainer>
|
||||
{column.isLabelIdentifier ? (
|
||||
<ColumnHead column={column} />
|
||||
) : (
|
||||
<ColumnHeadWithDropdown column={column} />
|
||||
)}
|
||||
<ColumnHeadWithDropdown column={column} />
|
||||
{(useIsMobile() || iconVisibility) && !!column.isLabelIdentifier && (
|
||||
<StyledHeaderIcon>
|
||||
<LightIconButton
|
||||
|
@ -19,7 +19,7 @@ const StyledLinkContainer = styled.div`
|
||||
margin-right: ${({ theme }) => theme.spacing(2)};
|
||||
`;
|
||||
|
||||
type SettingsAccountsEmailsBlocklistInputProps = {
|
||||
type SettingsAccountsBlocklistInputProps = {
|
||||
updateBlockedEmailList: (email: string) => void;
|
||||
blockedEmailOrDomainList: string[];
|
||||
};
|
||||
@ -50,10 +50,10 @@ type FormInput = {
|
||||
emailOrDomain: string;
|
||||
};
|
||||
|
||||
export const SettingsAccountsEmailsBlocklistInput = ({
|
||||
export const SettingsAccountsBlocklistInput = ({
|
||||
updateBlockedEmailList,
|
||||
blockedEmailOrDomainList,
|
||||
}: SettingsAccountsEmailsBlocklistInputProps) => {
|
||||
}: SettingsAccountsBlocklistInputProps) => {
|
||||
const { reset, handleSubmit, control, formState } = useForm<FormInput>({
|
||||
mode: 'onSubmit',
|
||||
resolver: zodResolver(validationSchema(blockedEmailOrDomainList)),
|
@ -7,11 +7,11 @@ import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSi
|
||||
import { useCreateOneRecord } from '@/object-record/hooks/useCreateOneRecord';
|
||||
import { useDeleteOneRecord } from '@/object-record/hooks/useDeleteOneRecord';
|
||||
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
|
||||
import { SettingsAccountsEmailsBlocklistInput } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistInput';
|
||||
import { SettingsAccountsEmailsBlocklistTable } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistTable';
|
||||
import { SettingsAccountsBlocklistInput } from '@/settings/accounts/components/SettingsAccountsBlocklistInput';
|
||||
import { SettingsAccountsBlocklistTable } from '@/settings/accounts/components/SettingsAccountsBlocklistTable';
|
||||
import { Section } from '@/ui/layout/section/components/Section';
|
||||
|
||||
export const SettingsAccountsEmailsBlocklistSection = () => {
|
||||
export const SettingsAccountsBlocklistSection = () => {
|
||||
const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
|
||||
|
||||
const { records: blocklist } = useFindManyRecords<BlocklistItem>({
|
||||
@ -44,11 +44,11 @@ export const SettingsAccountsEmailsBlocklistSection = () => {
|
||||
title="Blocklist"
|
||||
description="Exclude the following people and domains from my email sync"
|
||||
/>
|
||||
<SettingsAccountsEmailsBlocklistInput
|
||||
<SettingsAccountsBlocklistInput
|
||||
blockedEmailOrDomainList={blocklist.map((item) => item.handle)}
|
||||
updateBlockedEmailList={updateBlockedEmailList}
|
||||
/>
|
||||
<SettingsAccountsEmailsBlocklistTable
|
||||
<SettingsAccountsBlocklistTable
|
||||
blocklist={blocklist}
|
||||
handleBlockedEmailRemove={handleBlockedEmailRemove}
|
||||
/>
|
@ -1,13 +1,13 @@
|
||||
import styled from '@emotion/styled';
|
||||
|
||||
import { BlocklistItem } from '@/accounts/types/BlocklistItem';
|
||||
import { SettingsAccountsEmailsBlocklistTableRow } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistTableRow';
|
||||
import { SettingsAccountsBlocklistTableRow } from '@/settings/accounts/components/SettingsAccountsBlocklistTableRow';
|
||||
import { Table } from '@/ui/layout/table/components/Table';
|
||||
import { TableBody } from '@/ui/layout/table/components/TableBody';
|
||||
import { TableHeader } from '@/ui/layout/table/components/TableHeader';
|
||||
import { TableRow } from '@/ui/layout/table/components/TableRow';
|
||||
|
||||
type SettingsAccountsEmailsBlocklistTableProps = {
|
||||
type SettingsAccountsBlocklistTableProps = {
|
||||
blocklist: BlocklistItem[];
|
||||
handleBlockedEmailRemove: (id: string) => void;
|
||||
};
|
||||
@ -20,10 +20,10 @@ const StyledTableBody = styled(TableBody)`
|
||||
border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
|
||||
`;
|
||||
|
||||
export const SettingsAccountsEmailsBlocklistTable = ({
|
||||
export const SettingsAccountsBlocklistTable = ({
|
||||
blocklist,
|
||||
handleBlockedEmailRemove,
|
||||
}: SettingsAccountsEmailsBlocklistTableProps) => {
|
||||
}: SettingsAccountsBlocklistTableProps) => {
|
||||
return (
|
||||
<>
|
||||
{blocklist.length > 0 && (
|
||||
@ -35,7 +35,7 @@ export const SettingsAccountsEmailsBlocklistTable = ({
|
||||
</TableRow>
|
||||
<StyledTableBody>
|
||||
{blocklist.map((blocklistItem) => (
|
||||
<SettingsAccountsEmailsBlocklistTableRow
|
||||
<SettingsAccountsBlocklistTableRow
|
||||
key={blocklistItem.id}
|
||||
blocklistItem={blocklistItem}
|
||||
onRemove={handleBlockedEmailRemove}
|
@ -6,15 +6,15 @@ import { TableCell } from '@/ui/layout/table/components/TableCell';
|
||||
import { TableRow } from '@/ui/layout/table/components/TableRow';
|
||||
import { formatToHumanReadableDate } from '~/utils/date-utils';
|
||||
|
||||
type SettingsAccountsEmailsBlocklistTableRowProps = {
|
||||
type SettingsAccountsBlocklistTableRowProps = {
|
||||
blocklistItem: BlocklistItem;
|
||||
onRemove: (id: string) => void;
|
||||
};
|
||||
|
||||
export const SettingsAccountsEmailsBlocklistTableRow = ({
|
||||
export const SettingsAccountsBlocklistTableRow = ({
|
||||
blocklistItem,
|
||||
onRemove,
|
||||
}: SettingsAccountsEmailsBlocklistTableRowProps) => {
|
||||
}: SettingsAccountsBlocklistTableRowProps) => {
|
||||
return (
|
||||
<TableRow key={blocklistItem.id}>
|
||||
<TableCell>{blocklistItem.handle}</TableCell>
|
@ -0,0 +1,116 @@
|
||||
import { useTheme } from '@emotion/react';
|
||||
import styled from '@emotion/styled';
|
||||
import { H2Title, IconRefresh, IconUser } from 'twenty-ui';
|
||||
|
||||
import { MessageChannel } from '@/accounts/types/MessageChannel';
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
|
||||
import { SettingsAccountsCardMedia } from '@/settings/accounts/components/SettingsAccountsCardMedia';
|
||||
import { SettingsAccountsInboxVisibilitySettingsCard } from '@/settings/accounts/components/SettingsAccountsInboxVisibilitySettingsCard';
|
||||
import { SettingsAccountsToggleSettingCard } from '@/settings/accounts/components/SettingsAccountsToggleSettingCard';
|
||||
import { Section } from '@/ui/layout/section/components/Section';
|
||||
import { MessageChannelVisibility } from '~/generated-metadata/graphql';
|
||||
|
||||
type SettingsAccountsMessageChannelDetailsProps = {
|
||||
messageChannel: Pick<
|
||||
MessageChannel,
|
||||
'id' | 'visibility' | 'isContactAutoCreationEnabled' | 'isSyncEnabled'
|
||||
>;
|
||||
};
|
||||
|
||||
const StyledDetailsContainer = styled.div`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: ${({ theme }) => theme.spacing(6)};
|
||||
padding-top: ${({ theme }) => theme.spacing(6)};
|
||||
`;
|
||||
|
||||
export const SettingsAccountsMessageChannelDetails = ({
|
||||
messageChannel,
|
||||
}: SettingsAccountsMessageChannelDetailsProps) => {
|
||||
const theme = useTheme();
|
||||
|
||||
const { updateOneRecord } = useUpdateOneRecord<MessageChannel>({
|
||||
objectNameSingular: CoreObjectNameSingular.MessageChannel,
|
||||
});
|
||||
|
||||
const handleVisibilityChange = (value: MessageChannelVisibility) => {
|
||||
updateOneRecord({
|
||||
idToUpdate: messageChannel.id,
|
||||
updateOneRecordInput: {
|
||||
visibility: value,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleContactAutoCreationToggle = (value: boolean) => {
|
||||
updateOneRecord({
|
||||
idToUpdate: messageChannel.id,
|
||||
updateOneRecordInput: {
|
||||
isContactAutoCreationEnabled: value,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleIsSyncEnabledToggle = (value: boolean) => {
|
||||
updateOneRecord({
|
||||
idToUpdate: messageChannel.id,
|
||||
updateOneRecordInput: {
|
||||
isSyncEnabled: value,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<StyledDetailsContainer>
|
||||
<Section>
|
||||
<H2Title
|
||||
title="Visibility"
|
||||
description="Define what will be visible to other users in your workspace"
|
||||
/>
|
||||
<SettingsAccountsInboxVisibilitySettingsCard
|
||||
value={messageChannel.visibility}
|
||||
onChange={handleVisibilityChange}
|
||||
/>
|
||||
</Section>
|
||||
<Section>
|
||||
<H2Title
|
||||
title="Contact auto-creation"
|
||||
description="Automatically create contacts for people you’ve sent emails to"
|
||||
/>
|
||||
<SettingsAccountsToggleSettingCard
|
||||
cardMedia={
|
||||
<SettingsAccountsCardMedia>
|
||||
<IconUser
|
||||
size={theme.icon.size.sm}
|
||||
stroke={theme.icon.stroke.lg}
|
||||
/>
|
||||
</SettingsAccountsCardMedia>
|
||||
}
|
||||
title="Auto-creation"
|
||||
value={!!messageChannel.isContactAutoCreationEnabled}
|
||||
onToggle={handleContactAutoCreationToggle}
|
||||
/>
|
||||
</Section>
|
||||
<Section>
|
||||
<H2Title
|
||||
title="Synchronization"
|
||||
description="Past and future emails will automatically be synced to this workspace"
|
||||
/>
|
||||
<SettingsAccountsToggleSettingCard
|
||||
cardMedia={
|
||||
<SettingsAccountsCardMedia>
|
||||
<IconRefresh
|
||||
size={theme.icon.size.sm}
|
||||
stroke={theme.icon.stroke.lg}
|
||||
/>
|
||||
</SettingsAccountsCardMedia>
|
||||
}
|
||||
title="Sync emails"
|
||||
value={!!messageChannel.isSyncEnabled}
|
||||
onToggle={handleIsSyncEnabledToggle}
|
||||
/>
|
||||
</Section>
|
||||
</StyledDetailsContainer>
|
||||
);
|
||||
};
|
@ -0,0 +1,71 @@
|
||||
import { useRecoilValue } from 'recoil';
|
||||
|
||||
import { ConnectedAccount } from '@/accounts/types/ConnectedAccount';
|
||||
import { MessageChannel } from '@/accounts/types/MessageChannel';
|
||||
import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
|
||||
import { SettingsAccountsListEmptyStateCard } from '@/settings/accounts/components/SettingsAccountsListEmptyStateCard';
|
||||
import { SettingsAccountsMessageChannelDetails } from '@/settings/accounts/components/SettingsAccountsMessageChannelDetails';
|
||||
import { SETTINGS_ACCOUNT_MESSAGE_CHANNELS_TAB_LIST_COMPONENT_ID } from '@/settings/accounts/constants/SettingsAccountMessageChannelsTabListComponentId';
|
||||
import { TabList } from '@/ui/layout/tab/components/TabList';
|
||||
import { useTabList } from '@/ui/layout/tab/hooks/useTabList';
|
||||
|
||||
export const SettingsAccountsMessageChannelsContainer = () => {
|
||||
const { activeTabIdState } = useTabList(
|
||||
SETTINGS_ACCOUNT_MESSAGE_CHANNELS_TAB_LIST_COMPONENT_ID,
|
||||
);
|
||||
const activeTabId = useRecoilValue(activeTabIdState);
|
||||
const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
|
||||
|
||||
const { records: accounts } = useFindManyRecords<ConnectedAccount>({
|
||||
objectNameSingular: CoreObjectNameSingular.ConnectedAccount,
|
||||
filter: {
|
||||
accountOwnerId: {
|
||||
eq: currentWorkspaceMember?.id,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const { records: messageChannels } = useFindManyRecords<
|
||||
MessageChannel & {
|
||||
connectedAccount: ConnectedAccount;
|
||||
}
|
||||
>({
|
||||
objectNameSingular: CoreObjectNameSingular.MessageChannel,
|
||||
filter: {
|
||||
connectedAccountId: {
|
||||
in: accounts.map((account) => account.id),
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const tabs = [
|
||||
...messageChannels.map((messageChannel) => ({
|
||||
id: messageChannel.id,
|
||||
title: messageChannel.handle,
|
||||
})),
|
||||
];
|
||||
|
||||
if (!messageChannels.length) {
|
||||
return <SettingsAccountsListEmptyStateCard />;
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<TabList
|
||||
tabListId={SETTINGS_ACCOUNT_MESSAGE_CHANNELS_TAB_LIST_COMPONENT_ID}
|
||||
tabs={tabs}
|
||||
/>
|
||||
{messageChannels.map((messageChannel) => (
|
||||
<>
|
||||
{messageChannel.id === activeTabId && (
|
||||
<SettingsAccountsMessageChannelDetails
|
||||
messageChannel={messageChannel}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
};
|
@ -1,86 +0,0 @@
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import styled from '@emotion/styled';
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import { IconChevronRight, IconGmail } from 'twenty-ui';
|
||||
|
||||
import { ConnectedAccount } from '@/accounts/types/ConnectedAccount';
|
||||
import { MessageChannel } from '@/accounts/types/MessageChannel';
|
||||
import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
|
||||
import { SettingsAccountsListEmptyStateCard } from '@/settings/accounts/components/SettingsAccountsListEmptyStateCard';
|
||||
import {
|
||||
SettingsAccountsSynchronizationStatus,
|
||||
SettingsAccountsSynchronizationStatusProps,
|
||||
} from '@/settings/accounts/components/SettingsAccountsSynchronizationStatus';
|
||||
import { SettingsListCard } from '@/settings/components/SettingsListCard';
|
||||
import { LightIconButton } from '@/ui/input/button/components/LightIconButton';
|
||||
|
||||
const StyledRowRightContainer = styled.div`
|
||||
align-items: center;
|
||||
display: flex;
|
||||
gap: ${({ theme }) => theme.spacing(1)};
|
||||
`;
|
||||
|
||||
export const SettingsAccountsMessageChannelsListCard = () => {
|
||||
const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
|
||||
const navigate = useNavigate();
|
||||
|
||||
const { records: accounts, loading: accountsLoading } =
|
||||
useFindManyRecords<ConnectedAccount>({
|
||||
objectNameSingular: CoreObjectNameSingular.ConnectedAccount,
|
||||
filter: {
|
||||
accountOwnerId: {
|
||||
eq: currentWorkspaceMember?.id,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const { records: messageChannels, loading: messageChannelsLoading } =
|
||||
useFindManyRecords<
|
||||
MessageChannel & {
|
||||
connectedAccount: ConnectedAccount;
|
||||
}
|
||||
>({
|
||||
objectNameSingular: CoreObjectNameSingular.MessageChannel,
|
||||
filter: {
|
||||
connectedAccountId: {
|
||||
in: accounts.map((account) => account.id),
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
const messageChannelsWithSyncedEmails: (MessageChannel & {
|
||||
connectedAccount: ConnectedAccount;
|
||||
} & SettingsAccountsSynchronizationStatusProps)[] = messageChannels.map(
|
||||
(messageChannel) => ({
|
||||
...messageChannel,
|
||||
syncStatus: messageChannel.syncStatus,
|
||||
}),
|
||||
);
|
||||
|
||||
if (!messageChannelsWithSyncedEmails.length) {
|
||||
return <SettingsAccountsListEmptyStateCard />;
|
||||
}
|
||||
|
||||
return (
|
||||
<SettingsListCard
|
||||
items={messageChannelsWithSyncedEmails}
|
||||
getItemLabel={(messageChannel) => messageChannel.handle}
|
||||
isLoading={accountsLoading || messageChannelsLoading}
|
||||
onRowClick={(messageChannel) =>
|
||||
navigate(`/settings/accounts/emails/${messageChannel.id}`)
|
||||
}
|
||||
RowIcon={IconGmail}
|
||||
RowRightComponent={({ item: messageChannel }) => (
|
||||
<StyledRowRightContainer>
|
||||
<SettingsAccountsSynchronizationStatus
|
||||
syncStatus={messageChannel.syncStatus}
|
||||
isSyncEnabled={messageChannel.isSyncEnabled}
|
||||
/>
|
||||
<LightIconButton Icon={IconChevronRight} accent="tertiary" />
|
||||
</StyledRowRightContainer>
|
||||
)}
|
||||
/>
|
||||
);
|
||||
};
|
@ -2,7 +2,7 @@ import { Decorator, Meta, StoryObj } from '@storybook/react';
|
||||
import { expect, fn, userEvent, within } from '@storybook/test';
|
||||
import { ComponentDecorator } from 'twenty-ui';
|
||||
|
||||
import { SettingsAccountsEmailsBlocklistInput } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistInput';
|
||||
import { SettingsAccountsBlocklistInput } from '@/settings/accounts/components/SettingsAccountsBlocklistInput';
|
||||
|
||||
const updateBlockedEmailListJestFn = fn();
|
||||
|
||||
@ -13,10 +13,9 @@ const ClearMocksDecorator: Decorator = (Story, context) => {
|
||||
return <Story />;
|
||||
};
|
||||
|
||||
const meta: Meta<typeof SettingsAccountsEmailsBlocklistInput> = {
|
||||
title:
|
||||
'Modules/Settings/Accounts/Blocklist/SettingsAccountsEmailsBlocklistInput',
|
||||
component: SettingsAccountsEmailsBlocklistInput,
|
||||
const meta: Meta<typeof SettingsAccountsBlocklistInput> = {
|
||||
title: 'Modules/Settings/Accounts/Blocklist/SettingsAccountsBlocklistInput',
|
||||
component: SettingsAccountsBlocklistInput,
|
||||
decorators: [ComponentDecorator, ClearMocksDecorator],
|
||||
args: {
|
||||
updateBlockedEmailList: updateBlockedEmailListJestFn,
|
||||
@ -31,7 +30,7 @@ const meta: Meta<typeof SettingsAccountsEmailsBlocklistInput> = {
|
||||
};
|
||||
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof SettingsAccountsEmailsBlocklistInput>;
|
||||
type Story = StoryObj<typeof SettingsAccountsBlocklistInput>;
|
||||
|
||||
export const Default: Story = {};
|
||||
|
@ -0,0 +1,16 @@
|
||||
import { Meta, StoryObj } from '@storybook/react';
|
||||
import { ComponentDecorator } from 'twenty-ui';
|
||||
|
||||
import { SettingsAccountsBlocklistInput } from '@/settings/accounts/components/SettingsAccountsBlocklistInput';
|
||||
import { SettingsAccountsBlocklistSection } from '@/settings/accounts/components/SettingsAccountsBlocklistSection';
|
||||
|
||||
const meta: Meta<typeof SettingsAccountsBlocklistSection> = {
|
||||
title: 'Modules/Settings/Accounts/Blocklist/SettingsAccountsBlocklistSection',
|
||||
component: SettingsAccountsBlocklistInput,
|
||||
decorators: [ComponentDecorator],
|
||||
};
|
||||
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof SettingsAccountsBlocklistSection>;
|
||||
|
||||
export const Default: Story = {};
|
@ -3,7 +3,7 @@ import { expect, fn, userEvent, within } from '@storybook/test';
|
||||
import { ComponentDecorator } from 'twenty-ui';
|
||||
|
||||
import { mockedBlocklist } from '@/settings/accounts/components/__stories__/mockedBlocklist';
|
||||
import { SettingsAccountsEmailsBlocklistTable } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistTable';
|
||||
import { SettingsAccountsBlocklistTable } from '@/settings/accounts/components/SettingsAccountsBlocklistTable';
|
||||
import { formatToHumanReadableDate } from '~/utils/date-utils';
|
||||
|
||||
const handleBlockedEmailRemoveJestFn = fn();
|
||||
@ -15,10 +15,9 @@ const ClearMocksDecorator: Decorator = (Story, context) => {
|
||||
return <Story />;
|
||||
};
|
||||
|
||||
const meta: Meta<typeof SettingsAccountsEmailsBlocklistTable> = {
|
||||
title:
|
||||
'Modules/Settings/Accounts/Blocklist/SettingsAccountsEmailsBlocklistTable',
|
||||
component: SettingsAccountsEmailsBlocklistTable,
|
||||
const meta: Meta<typeof SettingsAccountsBlocklistTable> = {
|
||||
title: 'Modules/Settings/Accounts/Blocklist/SettingsAccountsBlocklistTable',
|
||||
component: SettingsAccountsBlocklistTable,
|
||||
decorators: [ComponentDecorator, ClearMocksDecorator],
|
||||
args: {
|
||||
blocklist: mockedBlocklist,
|
||||
@ -34,7 +33,7 @@ const meta: Meta<typeof SettingsAccountsEmailsBlocklistTable> = {
|
||||
};
|
||||
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof SettingsAccountsEmailsBlocklistTable>;
|
||||
type Story = StoryObj<typeof SettingsAccountsBlocklistTable>;
|
||||
|
||||
export const Default: Story = {
|
||||
play: async ({ canvasElement }) => {
|
@ -3,7 +3,7 @@ import { expect, fn, userEvent, within } from '@storybook/test';
|
||||
import { ComponentDecorator } from 'twenty-ui';
|
||||
|
||||
import { mockedBlocklist } from '@/settings/accounts/components/__stories__/mockedBlocklist';
|
||||
import { SettingsAccountsEmailsBlocklistTableRow } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistTableRow';
|
||||
import { SettingsAccountsBlocklistTableRow } from '@/settings/accounts/components/SettingsAccountsBlocklistTableRow';
|
||||
import { formatToHumanReadableDate } from '~/utils/date-utils';
|
||||
|
||||
const onRemoveJestFn = fn();
|
||||
@ -15,10 +15,10 @@ const ClearMocksDecorator: Decorator = (Story, context) => {
|
||||
return <Story />;
|
||||
};
|
||||
|
||||
const meta: Meta<typeof SettingsAccountsEmailsBlocklistTableRow> = {
|
||||
const meta: Meta<typeof SettingsAccountsBlocklistTableRow> = {
|
||||
title:
|
||||
'Modules/Settings/Accounts/Blocklist/SettingsAccountsEmailsBlocklistTableRow',
|
||||
component: SettingsAccountsEmailsBlocklistTableRow,
|
||||
'Modules/Settings/Accounts/Blocklist/SettingsAccountsBlocklistTableRow',
|
||||
component: SettingsAccountsBlocklistTableRow,
|
||||
decorators: [ComponentDecorator, ClearMocksDecorator],
|
||||
args: {
|
||||
blocklistItem: mockedBlocklist[0],
|
||||
@ -34,7 +34,7 @@ const meta: Meta<typeof SettingsAccountsEmailsBlocklistTableRow> = {
|
||||
};
|
||||
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof SettingsAccountsEmailsBlocklistTableRow>;
|
||||
type Story = StoryObj<typeof SettingsAccountsBlocklistTableRow>;
|
||||
|
||||
export const Default: Story = {
|
||||
play: async ({ canvasElement }) => {
|
@ -1,17 +0,0 @@
|
||||
import { Meta, StoryObj } from '@storybook/react';
|
||||
import { ComponentDecorator } from 'twenty-ui';
|
||||
|
||||
import { SettingsAccountsEmailsBlocklistInput } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistInput';
|
||||
import { SettingsAccountsEmailsBlocklistSection } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistSection';
|
||||
|
||||
const meta: Meta<typeof SettingsAccountsEmailsBlocklistSection> = {
|
||||
title:
|
||||
'Modules/Settings/Accounts/Blocklist/SettingsAccountsEmailsBlocklistSection',
|
||||
component: SettingsAccountsEmailsBlocklistInput,
|
||||
decorators: [ComponentDecorator],
|
||||
};
|
||||
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof SettingsAccountsEmailsBlocklistSection>;
|
||||
|
||||
export const Default: Story = {};
|
@ -0,0 +1,30 @@
|
||||
import { Meta, StoryObj } from '@storybook/react';
|
||||
import { ComponentDecorator } from 'twenty-ui';
|
||||
|
||||
import { SettingsAccountsMessageChannelDetails } from '@/settings/accounts/components/SettingsAccountsMessageChannelDetails';
|
||||
import { MessageChannelVisibility } from '~/generated/graphql';
|
||||
|
||||
const meta: Meta<typeof SettingsAccountsMessageChannelDetails> = {
|
||||
title:
|
||||
'Modules/Settings/Accounts/MessageChannels/SettingsAccountsMessageChannelDetails',
|
||||
component: SettingsAccountsMessageChannelDetails,
|
||||
decorators: [ComponentDecorator],
|
||||
args: {
|
||||
messageChannel: {
|
||||
id: '20202020-ef5a-4822-9e08-ce6e6a4dcb6a',
|
||||
isContactAutoCreationEnabled: true,
|
||||
isSyncEnabled: true,
|
||||
visibility: MessageChannelVisibility.ShareEverything,
|
||||
},
|
||||
},
|
||||
argTypes: {
|
||||
messageChannel: { control: false },
|
||||
},
|
||||
};
|
||||
|
||||
export default meta;
|
||||
type Story = StoryObj<typeof SettingsAccountsMessageChannelDetails>;
|
||||
|
||||
export const Default: Story = {
|
||||
play: async () => {},
|
||||
};
|
@ -0,0 +1,2 @@
|
||||
export const SETTINGS_ACCOUNT_MESSAGE_CHANNELS_TAB_LIST_COMPONENT_ID =
|
||||
'settings-account-message-channels-tab-list';
|
@ -8,8 +8,8 @@ import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSi
|
||||
import { generateDepthOneRecordGqlFields } from '@/object-record/graphql/utils/generateDepthOneRecordGqlFields';
|
||||
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
|
||||
import { SettingsAccountLoader } from '@/settings/accounts/components/SettingsAccountLoader';
|
||||
import { SettingsAccountsBlocklistSection } from '@/settings/accounts/components/SettingsAccountsBlocklistSection';
|
||||
import { SettingsAccountsConnectedAccountsListCard } from '@/settings/accounts/components/SettingsAccountsConnectedAccountsListCard';
|
||||
import { SettingsAccountsEmailsBlocklistSection } from '@/settings/accounts/components/SettingsAccountsEmailsBlocklistSection';
|
||||
import { SettingsAccountsSettingsSection } from '@/settings/accounts/components/SettingsAccountsSettingsSection';
|
||||
import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
|
||||
import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
|
||||
@ -55,7 +55,7 @@ export const SettingsAccounts = () => {
|
||||
loading={loading}
|
||||
/>
|
||||
</Section>
|
||||
{isBlocklistEnabled && <SettingsAccountsEmailsBlocklistSection />}
|
||||
{isBlocklistEnabled && <SettingsAccountsBlocklistSection />}
|
||||
<SettingsAccountsSettingsSection />
|
||||
</>
|
||||
)}
|
||||
|
@ -1,6 +1,6 @@
|
||||
import { H2Title, IconSettings } from 'twenty-ui';
|
||||
import { IconSettings } from 'twenty-ui';
|
||||
|
||||
import { SettingsAccountsMessageChannelsListCard } from '@/settings/accounts/components/SettingsAccountsMessageChannelsListCard';
|
||||
import { SettingsAccountsMessageChannelsContainer } from '@/settings/accounts/components/SettingsAccountsMessageChannelsContainer';
|
||||
import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
|
||||
import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
|
||||
import { Section } from '@/ui/layout/section/components/Section';
|
||||
@ -16,11 +16,7 @@ export const SettingsAccountsEmails = () => (
|
||||
]}
|
||||
/>
|
||||
<Section>
|
||||
<H2Title
|
||||
title="Emails sync"
|
||||
description="Sync your inboxes and set your privacy settings"
|
||||
/>
|
||||
<SettingsAccountsMessageChannelsListCard />
|
||||
<SettingsAccountsMessageChannelsContainer />
|
||||
</Section>
|
||||
</SettingsPageContainer>
|
||||
</SubMenuTopBarContainer>
|
||||
|
@ -1,128 +0,0 @@
|
||||
import { useEffect } from 'react';
|
||||
import { useNavigate, useParams } from 'react-router-dom';
|
||||
import { useTheme } from '@emotion/react';
|
||||
import { H2Title, IconRefresh, IconSettings, IconUser } from 'twenty-ui';
|
||||
|
||||
import { MessageChannel } from '@/accounts/types/MessageChannel';
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { useFindOneRecord } from '@/object-record/hooks/useFindOneRecord';
|
||||
import { useUpdateOneRecord } from '@/object-record/hooks/useUpdateOneRecord';
|
||||
import { SettingsAccountsCardMedia } from '@/settings/accounts/components/SettingsAccountsCardMedia';
|
||||
import { SettingsAccountsInboxVisibilitySettingsCard } from '@/settings/accounts/components/SettingsAccountsInboxVisibilitySettingsCard';
|
||||
import { SettingsAccountsToggleSettingCard } from '@/settings/accounts/components/SettingsAccountsToggleSettingCard';
|
||||
import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
|
||||
import { AppPath } from '@/types/AppPath';
|
||||
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 { MessageChannelVisibility } from '~/generated/graphql';
|
||||
|
||||
export const SettingsAccountsEmailsInboxSettings = () => {
|
||||
const theme = useTheme();
|
||||
const navigate = useNavigate();
|
||||
const { accountUuid: messageChannelId = '' } = useParams();
|
||||
|
||||
const { record: messageChannel, loading } = useFindOneRecord<MessageChannel>({
|
||||
objectNameSingular: CoreObjectNameSingular.MessageChannel,
|
||||
objectRecordId: messageChannelId,
|
||||
});
|
||||
|
||||
const { updateOneRecord } = useUpdateOneRecord<MessageChannel>({
|
||||
objectNameSingular: CoreObjectNameSingular.MessageChannel,
|
||||
});
|
||||
|
||||
const handleVisibilityChange = (value: MessageChannelVisibility) => {
|
||||
updateOneRecord({
|
||||
idToUpdate: messageChannelId,
|
||||
updateOneRecordInput: {
|
||||
visibility: value,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleContactAutoCreationToggle = (value: boolean) => {
|
||||
updateOneRecord({
|
||||
idToUpdate: messageChannelId,
|
||||
updateOneRecordInput: {
|
||||
isContactAutoCreationEnabled: value,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleIsSyncEnabledToggle = (value: boolean) => {
|
||||
updateOneRecord({
|
||||
idToUpdate: messageChannelId,
|
||||
updateOneRecordInput: {
|
||||
isSyncEnabled: value,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!loading && !messageChannel) navigate(AppPath.NotFound);
|
||||
}, [loading, messageChannel, navigate]);
|
||||
|
||||
if (!messageChannel) return null;
|
||||
|
||||
return (
|
||||
<SubMenuTopBarContainer Icon={IconSettings} title="Settings">
|
||||
<SettingsPageContainer>
|
||||
<Breadcrumb
|
||||
links={[
|
||||
{ children: 'Accounts', href: '/settings/accounts' },
|
||||
{ children: 'Emails', href: '/settings/accounts/emails' },
|
||||
{ children: messageChannel.handle || '' },
|
||||
]}
|
||||
/>
|
||||
<Section>
|
||||
<H2Title
|
||||
title="Email visibility"
|
||||
description="Define what will be visible to other users in your workspace"
|
||||
/>
|
||||
<SettingsAccountsInboxVisibilitySettingsCard
|
||||
value={messageChannel.visibility}
|
||||
onChange={handleVisibilityChange}
|
||||
/>
|
||||
</Section>
|
||||
<Section>
|
||||
<H2Title
|
||||
title="Contact auto-creation"
|
||||
description="Automatically create contacts for people you’ve sent emails to"
|
||||
/>
|
||||
<SettingsAccountsToggleSettingCard
|
||||
cardMedia={
|
||||
<SettingsAccountsCardMedia>
|
||||
<IconUser
|
||||
size={theme.icon.size.sm}
|
||||
stroke={theme.icon.stroke.lg}
|
||||
/>
|
||||
</SettingsAccountsCardMedia>
|
||||
}
|
||||
title="Auto-creation"
|
||||
value={!!messageChannel.isContactAutoCreationEnabled}
|
||||
onToggle={handleContactAutoCreationToggle}
|
||||
/>
|
||||
</Section>
|
||||
<Section>
|
||||
<H2Title
|
||||
title="Synchronization"
|
||||
description="Past and future emails will automatically be synced to this workspace"
|
||||
/>
|
||||
<SettingsAccountsToggleSettingCard
|
||||
cardMedia={
|
||||
<SettingsAccountsCardMedia>
|
||||
<IconRefresh
|
||||
size={theme.icon.size.sm}
|
||||
stroke={theme.icon.stroke.lg}
|
||||
/>
|
||||
</SettingsAccountsCardMedia>
|
||||
}
|
||||
title="Sync emails"
|
||||
value={!!messageChannel.isSyncEnabled}
|
||||
onToggle={handleIsSyncEnabledToggle}
|
||||
/>
|
||||
</Section>
|
||||
</SettingsPageContainer>
|
||||
</SubMenuTopBarContainer>
|
||||
);
|
||||
};
|
@ -1,4 +1,5 @@
|
||||
import { Meta, StoryObj } from '@storybook/react';
|
||||
import { graphql, HttpResponse } from 'msw';
|
||||
|
||||
import {
|
||||
PageDecorator,
|
||||
@ -25,4 +26,120 @@ export default meta;
|
||||
|
||||
export type Story = StoryObj<typeof SettingsAccountsEmails>;
|
||||
|
||||
export const Default: Story = {};
|
||||
export const NoConnectedAccount: Story = {};
|
||||
|
||||
export const TwoConnectedAccounts: Story = {
|
||||
parameters: {
|
||||
msw: {
|
||||
handlers: [
|
||||
...graphqlMocks.handlers,
|
||||
graphql.query('FindManyConnectedAccounts', () => {
|
||||
return HttpResponse.json({
|
||||
data: {
|
||||
connectedAccounts: {
|
||||
__typename: 'ConnectedAccountConnection',
|
||||
totalCount: 1,
|
||||
pageInfo: {
|
||||
__typename: 'PageInfo',
|
||||
hasNextPage: false,
|
||||
startCursor: '',
|
||||
endCursor: '',
|
||||
},
|
||||
edges: [
|
||||
{
|
||||
__typename: 'ConnectedAccountEdge',
|
||||
cursor: '',
|
||||
node: {
|
||||
__typename: 'ConnectedAccount',
|
||||
accessToken: '',
|
||||
refreshToken: '',
|
||||
updatedAt: '2024-07-03T20:03:35.064Z',
|
||||
createdAt: '2024-07-03T20:03:35.064Z',
|
||||
id: '20202020-954c-4d76-9a87-e5f072d4b7ef',
|
||||
provider: 'google',
|
||||
accountOwnerId: '20202020-03f2-4d83-b0d5-2ec2bcee72d4',
|
||||
lastSyncHistoryId: '',
|
||||
emailAliases: '',
|
||||
handle: 'test.test@gmail.com',
|
||||
authFailedAt: null,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
});
|
||||
}),
|
||||
graphql.query('FindManyMessageChannels', () => {
|
||||
return HttpResponse.json({
|
||||
data: {
|
||||
messageChannels: {
|
||||
__typename: 'MessageChannelConnection',
|
||||
totalCount: 2,
|
||||
pageInfo: {
|
||||
__typename: 'PageInfo',
|
||||
hasNextPage: false,
|
||||
startCursor: '',
|
||||
endCursor: '',
|
||||
},
|
||||
edges: [
|
||||
{
|
||||
__typename: 'MessageChannelEdge',
|
||||
cursor: '',
|
||||
node: {
|
||||
__typename: 'MessageChannel',
|
||||
handle: 'test.test@gmail.com',
|
||||
excludeNonProfessionalEmails: true,
|
||||
syncStageStartedAt: null,
|
||||
id: '20202020-ef5a-4822-9e08-ce6e6a4dcb6f',
|
||||
updatedAt: '2024-07-03T20:03:11.903Z',
|
||||
createdAt: '2024-07-03T20:03:11.903Z',
|
||||
connectedAccountId:
|
||||
'20202020-954c-4d76-9a87-e5f072d4b7ef',
|
||||
contactAutoCreationPolicy: 'SENT',
|
||||
syncStage: 'PARTIAL_MESSAGE_LIST_FETCH_PENDING',
|
||||
type: 'email',
|
||||
isContactAutoCreationEnabled: true,
|
||||
syncCursor: '1562764',
|
||||
excludeGroupEmails: true,
|
||||
throttleFailureCount: 0,
|
||||
isSyncEnabled: true,
|
||||
visibility: 'SHARE_EVERYTHING',
|
||||
syncStatus: 'COMPLETED',
|
||||
syncedAt: '2024-07-04T16:25:04.960Z',
|
||||
},
|
||||
},
|
||||
{
|
||||
__typename: 'MessageChannelEdge',
|
||||
cursor: '',
|
||||
node: {
|
||||
__typename: 'MessageChannel',
|
||||
handle: 'test.test2@gmail.com',
|
||||
excludeNonProfessionalEmails: true,
|
||||
syncStageStartedAt: null,
|
||||
id: '20202020-ef5a-4822-9e08-ce6e6a4dcb6a',
|
||||
updatedAt: '2024-07-03T20:03:11.903Z',
|
||||
createdAt: '2024-07-03T20:03:11.903Z',
|
||||
connectedAccountId:
|
||||
'20202020-954c-4d76-9a87-e5f072d4b7ef',
|
||||
contactAutoCreationPolicy: 'SENT',
|
||||
syncStage: 'PARTIAL_MESSAGE_LIST_FETCH_PENDING',
|
||||
type: 'email',
|
||||
isContactAutoCreationEnabled: true,
|
||||
syncCursor: '1562764',
|
||||
excludeGroupEmails: true,
|
||||
throttleFailureCount: 0,
|
||||
isSyncEnabled: true,
|
||||
visibility: 'SHARE_EVERYTHING',
|
||||
syncStatus: 'COMPLETED',
|
||||
syncedAt: '2024-07-04T16:25:04.960Z',
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
},
|
||||
});
|
||||
}),
|
||||
],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
@ -1,79 +0,0 @@
|
||||
import { Meta, StoryObj } from '@storybook/react';
|
||||
import { within } from '@storybook/test';
|
||||
import { graphql, HttpResponse } from 'msw';
|
||||
|
||||
import { MessageChannelVisibility } from '~/generated/graphql';
|
||||
import { SettingsAccountsEmailsInboxSettings } from '~/pages/settings/accounts/SettingsAccountsEmailsInboxSettings';
|
||||
import {
|
||||
PageDecorator,
|
||||
PageDecoratorArgs,
|
||||
} from '~/testing/decorators/PageDecorator';
|
||||
import { graphqlMocks } from '~/testing/graphqlMocks';
|
||||
|
||||
const meta: Meta<PageDecoratorArgs> = {
|
||||
title: 'Pages/Settings/Accounts/SettingsAccountsEmailsInboxSettings',
|
||||
component: SettingsAccountsEmailsInboxSettings,
|
||||
decorators: [PageDecorator],
|
||||
args: {
|
||||
routePath: '/settings/accounts/emails/:accountUuid',
|
||||
routeParams: { ':accountUuid': '123' },
|
||||
},
|
||||
parameters: {
|
||||
layout: 'fullscreen',
|
||||
msw: {
|
||||
handlers: [
|
||||
graphql.query('FindOneMessageChannel', () => {
|
||||
return HttpResponse.json({
|
||||
data: {
|
||||
messageChannel: {
|
||||
id: '1',
|
||||
visibility: MessageChannelVisibility.ShareEverything,
|
||||
messageThreads: { edges: [] },
|
||||
createdAt: '2021-08-27T12:00:00Z',
|
||||
type: 'email',
|
||||
updatedAt: '2021-08-27T12:00:00Z',
|
||||
targetUrl: 'https://example.com/webhook',
|
||||
connectedAccountId: '1',
|
||||
handle: 'handle',
|
||||
connectedAccount: {
|
||||
id: '1',
|
||||
handle: 'handle',
|
||||
updatedAt: '2021-08-27T12:00:00Z',
|
||||
accessToken: 'accessToken',
|
||||
messageChannels: { edges: [] },
|
||||
refreshToken: 'refreshToken',
|
||||
__typename: 'ConnectedAccount',
|
||||
accountOwner: { id: '1', __typename: 'WorkspaceMember' },
|
||||
provider: 'provider',
|
||||
createdAt: '2021-08-27T12:00:00Z',
|
||||
accountOwnerId: '1',
|
||||
},
|
||||
__typename: 'MessageChannel',
|
||||
},
|
||||
},
|
||||
});
|
||||
}),
|
||||
graphqlMocks.handlers,
|
||||
],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export default meta;
|
||||
|
||||
export type Story = StoryObj<typeof SettingsAccountsEmailsInboxSettings>;
|
||||
|
||||
export const Default: Story = {
|
||||
play: async ({ canvasElement }) => {
|
||||
const canvas = within(canvasElement);
|
||||
|
||||
await canvas.findByText('Email visibility');
|
||||
await canvas.findByText(
|
||||
'Define what will be visible to other users in your workspace',
|
||||
);
|
||||
await canvas.findByText('Contact auto-creation');
|
||||
await canvas.findByText(
|
||||
'Automatically create contacts for people you’ve sent emails to',
|
||||
);
|
||||
},
|
||||
};
|
@ -0,0 +1,159 @@
|
||||
import { InjectDataSource, InjectRepository } from '@nestjs/typeorm';
|
||||
import { Logger } from '@nestjs/common';
|
||||
|
||||
import { Command, CommandRunner, Option } from 'nest-commander';
|
||||
import { Repository, IsNull, DataSource } from 'typeorm';
|
||||
import chalk from 'chalk';
|
||||
|
||||
import { DataSourceService } from 'src/engine/metadata-modules/data-source/data-source.service';
|
||||
import { Workspace } from 'src/engine/core-modules/workspace/workspace.entity';
|
||||
import { TypeORMService } from 'src/database/typeorm/typeorm.service';
|
||||
import {
|
||||
FieldMetadataEntity,
|
||||
FieldMetadataType,
|
||||
} from 'src/engine/metadata-modules/field-metadata/field-metadata.entity';
|
||||
import { WorkspaceCacheVersionService } from 'src/engine/metadata-modules/workspace-cache-version/workspace-cache-version.service';
|
||||
import { computeObjectTargetTable } from 'src/engine/utils/compute-object-target-table.util';
|
||||
|
||||
interface UpdateBooleanFieldsNullDefaultValuesAndNullValuesCommandOptions {
|
||||
workspaceId?: string;
|
||||
}
|
||||
|
||||
@Command({
|
||||
name: 'migrate-0.22:update-boolean-field-null-default-values-and-null-values',
|
||||
description:
|
||||
'Update boolean fields null default values and null values to false',
|
||||
})
|
||||
export class UpdateBooleanFieldsNullDefaultValuesAndNullValuesCommand extends CommandRunner {
|
||||
private readonly logger = new Logger(
|
||||
UpdateBooleanFieldsNullDefaultValuesAndNullValuesCommand.name,
|
||||
);
|
||||
constructor(
|
||||
@InjectRepository(Workspace, 'core')
|
||||
private readonly workspaceRepository: Repository<Workspace>,
|
||||
private readonly typeORMService: TypeORMService,
|
||||
private readonly dataSourceService: DataSourceService,
|
||||
private readonly workspaceCacheVersionService: WorkspaceCacheVersionService,
|
||||
@InjectDataSource('metadata')
|
||||
private readonly metadataDataSource: DataSource,
|
||||
) {
|
||||
super();
|
||||
}
|
||||
|
||||
@Option({
|
||||
flags: '-w, --workspace-id [workspace_id]',
|
||||
description: 'workspace id. Command runs on all workspaces if not provided',
|
||||
required: false,
|
||||
})
|
||||
parseWorkspaceId(value: string): string {
|
||||
return value;
|
||||
}
|
||||
|
||||
async run(
|
||||
_passedParam: string[],
|
||||
options: UpdateBooleanFieldsNullDefaultValuesAndNullValuesCommandOptions,
|
||||
): Promise<void> {
|
||||
const workspaceIds = options.workspaceId
|
||||
? [options.workspaceId]
|
||||
: (await this.workspaceRepository.find()).map(
|
||||
(workspace) => workspace.id,
|
||||
);
|
||||
|
||||
if (!workspaceIds.length) {
|
||||
this.logger.log(chalk.yellow('No workspace found'));
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
this.logger.log(
|
||||
chalk.green(`Running command on ${workspaceIds.length} workspaces`),
|
||||
);
|
||||
|
||||
for (const workspaceId of workspaceIds) {
|
||||
const dataSourceMetadata =
|
||||
await this.dataSourceService.getLastDataSourceMetadataFromWorkspaceId(
|
||||
workspaceId,
|
||||
);
|
||||
|
||||
if (!dataSourceMetadata) {
|
||||
throw new Error(
|
||||
`Could not find dataSourceMetadata for workspace ${workspaceId}`,
|
||||
);
|
||||
}
|
||||
|
||||
const workspaceDataSource =
|
||||
await this.typeORMService.connectToDataSource(dataSourceMetadata);
|
||||
|
||||
if (!workspaceDataSource) {
|
||||
throw new Error(
|
||||
`Could not connect to dataSource for workspace ${workspaceId}`,
|
||||
);
|
||||
}
|
||||
|
||||
const workspaceQueryRunner = workspaceDataSource.createQueryRunner();
|
||||
const metadataQueryRunner = this.metadataDataSource.createQueryRunner();
|
||||
|
||||
await workspaceQueryRunner.connect();
|
||||
await metadataQueryRunner.connect();
|
||||
|
||||
await workspaceQueryRunner.startTransaction();
|
||||
await metadataQueryRunner.startTransaction();
|
||||
|
||||
try {
|
||||
const fieldMetadataRepository =
|
||||
metadataQueryRunner.manager.getRepository(FieldMetadataEntity);
|
||||
|
||||
const booleanFieldsWithoutDefaultValue =
|
||||
await fieldMetadataRepository.find({
|
||||
where: {
|
||||
workspaceId,
|
||||
type: FieldMetadataType.BOOLEAN,
|
||||
defaultValue: IsNull(),
|
||||
},
|
||||
relations: ['object'],
|
||||
});
|
||||
|
||||
for (const booleanField of booleanFieldsWithoutDefaultValue) {
|
||||
if (!booleanField.object) {
|
||||
throw new Error(
|
||||
`Could not find objectMetadataItem for field ${booleanField.id}`,
|
||||
);
|
||||
}
|
||||
|
||||
// Could be done via a batch update but it's safer in this context to run it sequentially with the ALTER TABLE
|
||||
await fieldMetadataRepository.update(booleanField.id, {
|
||||
defaultValue: false,
|
||||
});
|
||||
|
||||
const fieldName = booleanField.name;
|
||||
const tableName = computeObjectTargetTable(booleanField.object);
|
||||
|
||||
await workspaceQueryRunner.query(
|
||||
`ALTER TABLE "${dataSourceMetadata.schema}"."${tableName}" ALTER COLUMN "${fieldName}" SET DEFAULT false;`,
|
||||
);
|
||||
}
|
||||
|
||||
await workspaceQueryRunner.commitTransaction();
|
||||
await metadataQueryRunner.commitTransaction();
|
||||
} catch (error) {
|
||||
await workspaceQueryRunner.rollbackTransaction();
|
||||
await metadataQueryRunner.rollbackTransaction();
|
||||
this.logger.log(
|
||||
chalk.red(`Running command on workspace ${workspaceId} failed`),
|
||||
);
|
||||
throw error;
|
||||
} finally {
|
||||
await workspaceQueryRunner.release();
|
||||
await metadataQueryRunner.release();
|
||||
}
|
||||
|
||||
await this.workspaceCacheVersionService.incrementVersion(workspaceId);
|
||||
|
||||
this.logger.log(
|
||||
chalk.green(`Running command on workspace ${workspaceId} done`),
|
||||
);
|
||||
}
|
||||
|
||||
this.logger.log(chalk.green(`Command completed!`));
|
||||
}
|
||||
}
|
@ -21,6 +21,7 @@ import { FieldMetadataEntity } from 'src/engine/metadata-modules/field-metadata/
|
||||
import { WorkspaceCacheVersionModule } from 'src/engine/metadata-modules/workspace-cache-version/workspace-cache-version.module';
|
||||
import { UpdateMessageChannelSyncStatusEnumCommand } from 'src/database/commands/0-20-update-message-channel-sync-status-enum.command';
|
||||
import { ObjectMetadataEntity } from 'src/engine/metadata-modules/object-metadata/object-metadata.entity';
|
||||
import { UpdateBooleanFieldsNullDefaultValuesAndNullValuesCommand } from 'src/database/commands/0-22-update-boolean-fields-null-default-values-and-null-values.command';
|
||||
|
||||
@Module({
|
||||
imports: [
|
||||
@ -48,6 +49,7 @@ import { ObjectMetadataEntity } from 'src/engine/metadata-modules/object-metadat
|
||||
StopDataSeedDemoWorkspaceCronCommand,
|
||||
UpdateMessageChannelVisibilityEnumCommand,
|
||||
UpdateMessageChannelSyncStatusEnumCommand,
|
||||
UpdateBooleanFieldsNullDefaultValuesAndNullValuesCommand,
|
||||
],
|
||||
})
|
||||
export class DatabaseCommandModule {}
|
||||
|
@ -44,6 +44,7 @@ export class CalendarEventWorkspaceEntity extends BaseWorkspaceEntity {
|
||||
label: 'Is canceled',
|
||||
description: 'Is canceled',
|
||||
icon: 'IconCalendarCancel',
|
||||
defaultValue: false,
|
||||
})
|
||||
isCanceled: boolean;
|
||||
|
||||
@ -53,6 +54,7 @@ export class CalendarEventWorkspaceEntity extends BaseWorkspaceEntity {
|
||||
label: 'Is Full Day',
|
||||
description: 'Is Full Day',
|
||||
icon: 'Icon24Hours',
|
||||
defaultValue: false,
|
||||
})
|
||||
isFullDay: boolean;
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user