-
Notifications
You must be signed in to change notification settings - Fork 2.6k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge commit '40bea0d95e81e9fee09d6d8d1ba41e459b1d0770' of https://gi…
…thub.com/twentyhq/twenty into TWNTY-3794
- Loading branch information
Showing
37 changed files
with
765 additions
and
56 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
6 changes: 6 additions & 0 deletions
6
...s/twenty-front/src/modules/object-metadata/constants/LabelIdentifierFieldMetadataTypes.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| import { FieldMetadataType } from '~/generated-metadata/graphql'; | ||
|
|
||
| export const LABEL_IDENTIFIER_FIELD_METADATA_TYPES = [ | ||
| FieldMetadataType.Number, | ||
| FieldMetadataType.Text, | ||
| ]; |
9 changes: 9 additions & 0 deletions
9
packages/twenty-front/src/modules/object-metadata/utils/getActiveFieldMetadataItems.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem'; | ||
|
|
||
| export const getActiveFieldMetadataItems = ( | ||
| objectMetadataItem: Pick<ObjectMetadataItem, 'fields'>, | ||
| ) => | ||
| objectMetadataItem.fields.filter( | ||
| (fieldMetadataItem) => | ||
| fieldMetadataItem.isActive && !fieldMetadataItem.isSystem, | ||
| ); |
9 changes: 9 additions & 0 deletions
9
packages/twenty-front/src/modules/object-metadata/utils/getDisabledFieldMetadataItems.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem'; | ||
|
|
||
| export const getDisabledFieldMetadataItems = ( | ||
| objectMetadataItem: Pick<ObjectMetadataItem, 'fields'>, | ||
| ) => | ||
| objectMetadataItem.fields.filter( | ||
| (fieldMetadataItem) => | ||
| !fieldMetadataItem.isActive && !fieldMetadataItem.isSystem, | ||
| ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
11 changes: 11 additions & 0 deletions
11
...es/twenty-front/src/modules/settings/data-model/components/SettingsDataModelCardTitle.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| import styled from '@emotion/styled'; | ||
|
|
||
| const StyledTitle = styled.h3` | ||
| color: ${({ theme }) => theme.font.color.extraLight}; | ||
| font-size: ${({ theme }) => theme.font.size.sm}; | ||
| font-weight: ${({ theme }) => theme.font.weight.medium}; | ||
| margin: 0; | ||
| margin-bottom: ${({ theme }) => theme.spacing(4)}; | ||
| `; | ||
|
|
||
| export { StyledTitle as SettingsDataModelCardTitle }; |
101 changes: 101 additions & 0 deletions
101
...s/settings/data-model/objects/forms/components/SettingsDataModelObjectIdentifiersForm.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,101 @@ | ||
| import { useMemo } from 'react'; | ||
| import { Controller, useFormContext } from 'react-hook-form'; | ||
| import styled from '@emotion/styled'; | ||
| import { z } from 'zod'; | ||
|
|
||
| import { LABEL_IDENTIFIER_FIELD_METADATA_TYPES } from '@/object-metadata/constants/LabelIdentifierFieldMetadataTypes'; | ||
| import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem'; | ||
| import { getActiveFieldMetadataItems } from '@/object-metadata/utils/getActiveFieldMetadataItems'; | ||
| import { objectMetadataItemSchema } from '@/object-metadata/validation-schemas/objectMetadataItemSchema'; | ||
| import { IconCircleOff } from '@/ui/display/icon'; | ||
| import { useIcons } from '@/ui/display/icon/hooks/useIcons'; | ||
| import { Select, SelectOption } from '@/ui/input/components/Select'; | ||
|
|
||
| export const settingsDataModelObjectIdentifiersFormSchema = | ||
| objectMetadataItemSchema.pick({ | ||
| labelIdentifierFieldMetadataId: true, | ||
| imageIdentifierFieldMetadataId: true, | ||
| }); | ||
|
|
||
| export type SettingsDataModelObjectIdentifiersFormValues = z.infer< | ||
| typeof settingsDataModelObjectIdentifiersFormSchema | ||
| >; | ||
|
|
||
| type SettingsDataModelObjectIdentifiersFormProps = { | ||
| objectMetadataItem: ObjectMetadataItem; | ||
| }; | ||
|
|
||
| const StyledContainer = styled.div` | ||
| display: flex; | ||
| gap: ${({ theme }) => theme.spacing(4)}; | ||
| `; | ||
|
|
||
| export const SettingsDataModelObjectIdentifiersForm = ({ | ||
| objectMetadataItem, | ||
| }: SettingsDataModelObjectIdentifiersFormProps) => { | ||
| const { control } = | ||
| useFormContext<SettingsDataModelObjectIdentifiersFormValues>(); | ||
| const { getIcon } = useIcons(); | ||
|
|
||
| const labelIdentifierFieldOptions = useMemo( | ||
| () => | ||
| getActiveFieldMetadataItems(objectMetadataItem) | ||
| .filter( | ||
| ({ id, type }) => | ||
| LABEL_IDENTIFIER_FIELD_METADATA_TYPES.includes(type) || | ||
| objectMetadataItem.labelIdentifierFieldMetadataId === id, | ||
| ) | ||
| .map<SelectOption<string | null>>((fieldMetadataItem) => ({ | ||
| Icon: getIcon(fieldMetadataItem.icon), | ||
| label: fieldMetadataItem.label, | ||
| value: fieldMetadataItem.id, | ||
| })), | ||
| [getIcon, objectMetadataItem], | ||
| ); | ||
| const imageIdentifierFieldOptions: SelectOption<string | null>[] = []; | ||
|
|
||
| const emptyOption: SelectOption<string | null> = { | ||
| Icon: IconCircleOff, | ||
| label: 'None', | ||
| value: null, | ||
| }; | ||
|
|
||
| return ( | ||
| <StyledContainer> | ||
| {[ | ||
| { | ||
| label: 'Record label', | ||
| fieldName: 'labelIdentifierFieldMetadataId' as const, | ||
| options: labelIdentifierFieldOptions, | ||
| }, | ||
| { | ||
| label: 'Record image', | ||
| fieldName: 'imageIdentifierFieldMetadataId' as const, | ||
| options: imageIdentifierFieldOptions, | ||
| }, | ||
| ].map(({ fieldName, label, options }) => ( | ||
| <Controller | ||
| key={fieldName} | ||
| name={fieldName} | ||
| control={control} | ||
| defaultValue={objectMetadataItem[fieldName]} | ||
| render={({ field: { onBlur, onChange, value } }) => { | ||
| return ( | ||
| <Select | ||
| label={label} | ||
| disabled={!objectMetadataItem.isCustom || !options.length} | ||
| fullWidth | ||
| dropdownId={`${fieldName}-select`} | ||
| emptyOption={emptyOption} | ||
| options={options} | ||
| value={value} | ||
| onChange={onChange} | ||
| onBlur={onBlur} | ||
| /> | ||
| ); | ||
| }} | ||
| /> | ||
| ))} | ||
| </StyledContainer> | ||
| ); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
19 changes: 19 additions & 0 deletions
19
packages/twenty-front/src/modules/ui/display/typography/components/H3Title.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,19 @@ | ||
| import { ReactNode } from 'react'; | ||
| import styled from '@emotion/styled'; | ||
|
|
||
| type H3TitleProps = { | ||
| title: ReactNode; | ||
| className?: string; | ||
| }; | ||
|
|
||
| const StyledH3Title = styled.h3` | ||
| color: ${({ theme }) => theme.font.color.primary}; | ||
| font-size: ${({ theme }) => theme.font.size.lg}; | ||
| font-weight: ${({ theme }) => theme.font.weight.semiBold}; | ||
| margin: 0; | ||
| margin-bottom: ${({ theme }) => theme.spacing(4)}; | ||
| `; | ||
|
|
||
| export const H3Title = ({ title, className }: H3TitleProps) => { | ||
| return <StyledH3Title className={className}>{title}</StyledH3Title>; | ||
| }; |
22 changes: 22 additions & 0 deletions
22
...twenty-front/src/modules/ui/display/typography/components/__stories__/H3Title.stories.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
| import { Meta, StoryObj } from '@storybook/react'; | ||
|
|
||
| import { ComponentDecorator } from '~/testing/decorators/ComponentDecorator'; | ||
|
|
||
| import { H3Title } from '../H3Title'; | ||
|
|
||
| const meta: Meta<typeof H3Title> = { | ||
| title: 'UI/Display/Typography/Title/H3Title', | ||
| component: H3Title, | ||
| decorators: [ComponentDecorator], | ||
| args: { | ||
| title: 'H3 title', | ||
| }, | ||
| }; | ||
|
|
||
| export default meta; | ||
|
|
||
| type Story = StoryObj<typeof H3Title>; | ||
|
|
||
| export const Default: Story = { | ||
| decorators: [ComponentDecorator], | ||
| }; |
Oops, something went wrong.