TWNTY-3825 - ESLint rule: const naming (#4171)

* ESLint rule: const naming

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: KlingerMatheus <klinger.matheus@gitstart.dev>

* Refactor according to review

Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: KlingerMatheus <klinger.matheus@gitstart.dev>

* refactor: Reverts changes on `twenty-server`

Co-authored-by: KlingerMatheus <klinger.matheus@gitstart.dev>
Co-authored-by: v1b3m <vibenjamin6@gmail.com>

---------

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: v1b3m <vibenjamin6@gmail.com>
Co-authored-by: KlingerMatheus <klinger.matheus@gitstart.dev>
This commit is contained in:
gitstart-app[bot]
2024-02-25 13:52:48 +01:00
committed by GitHub
parent a108d36040
commit f543191552
184 changed files with 1121 additions and 828 deletions

View File

@ -1,4 +1,4 @@
import { availableTimeZoneOptions } from '@/settings/accounts/constants/timeZoneSelectOptions';
import { AVAILABLE_TIMEZONE_OPTIONS } from '@/settings/accounts/constants/AvailableTimezoneOptions';
import { detectTimeZone } from '@/settings/accounts/utils/detectTimeZone';
import { findAvailableTimeZoneOption } from '@/settings/accounts/utils/findAvailableTimeZoneOption';
import { Select } from '@/ui/input/components/Select';
@ -18,7 +18,7 @@ export const SettingsAccountsCalendarTimeZoneSelect = ({
label="Time zone"
fullWidth
value={findAvailableTimeZoneOption(value)?.value}
options={availableTimeZoneOptions}
options={AVAILABLE_TIMEZONE_OPTIONS}
onChange={onChange}
withSearchInput
/>

View File

@ -3,7 +3,10 @@ import styled from '@emotion/styled';
import { ColorPickerButton } from '@/ui/input/button/components/ColorPickerButton';
import { Card } from '@/ui/layout/card/components/Card';
import { CardContent } from '@/ui/layout/card/components/CardContent';
import { mainColorNames, ThemeColor } from '@/ui/theme/constants/colors';
import {
MAIN_COLOR_NAMES,
ThemeColor,
} from '@/ui/theme/constants/MainColorNames';
type SettingsAccountsColorSettingCardProps = {
onChange: (nextValue: ThemeColor) => void;
@ -22,7 +25,7 @@ export const SettingsAccountsColorSettingCard = ({
}: SettingsAccountsColorSettingCardProps) => (
<Card>
<StyledCardContent>
{mainColorNames.map((colorName) => (
{MAIN_COLOR_NAMES.map((colorName) => (
<ColorPickerButton
colorName={colorName}
isSelected={value === colorName}

View File

@ -0,0 +1,18 @@
/* eslint-disable @nx/workspace-max-consts-per-file */
import { getTimezoneOffset } from 'date-fns-tz';
import { AVAILABLE_TIME_ZONE_OPTIONS_BY_LABEL } from '@/settings/accounts/constants/AvailableTimezoneOptionsByLabel';
export const AVAILABLE_TIMEZONE_OPTIONS = Object.values(
AVAILABLE_TIME_ZONE_OPTIONS_BY_LABEL,
).sort((optionA, optionB) => {
// eslint-disable-next-line @typescript-eslint/naming-convention
const difference =
getTimezoneOffset(optionA.value) - getTimezoneOffset(optionB.value);
return difference === 0
? // Sort alphabetically if the time zone offsets are the same.
optionA.label.localeCompare(optionB.label)
: // Sort by time zone offset if different.
difference;
});

View File

@ -1,10 +1,10 @@
import { getTimezoneOffset } from 'date-fns-tz';
import { ianaTimeZones } from '@/settings/accounts/constants/ianaTimeZones';
/* eslint-disable @typescript-eslint/naming-convention */
/* eslint-disable @nx/workspace-max-consts-per-file */
import { IANA_TIME_ZONES } from '@/settings/accounts/constants/IanaTimeZones';
import { formatTimeZoneLabel } from '@/settings/accounts/utils/formatTimeZoneLabel';
import { SelectOption } from '@/ui/input/components/Select';
export const availableTimeZoneOptionsByLabel = ianaTimeZones.reduce<
export const AVAILABLE_TIME_ZONE_OPTIONS_BY_LABEL = IANA_TIME_ZONES.reduce<
Record<string, SelectOption<string>>
>((result, ianaTimeZone) => {
const timeZoneLabel = formatTimeZoneLabel(ianaTimeZone);
@ -28,16 +28,3 @@ export const availableTimeZoneOptionsByLabel = ianaTimeZones.reduce<
[timeZoneLabel]: { label: timeZoneLabel, value: ianaTimeZone },
};
}, {});
export const availableTimeZoneOptions = Object.values(
availableTimeZoneOptionsByLabel,
).sort((optionA, optionB) => {
const difference =
getTimezoneOffset(optionA.value) - getTimezoneOffset(optionB.value);
return difference === 0
? // Sort alphabetically if the time zone offsets are the same.
optionA.label.localeCompare(optionB.label)
: // Sort by time zone offset if different.
difference;
});

View File

@ -2,7 +2,7 @@
* Standard IANA time zones.
* @see https://www.iana.org/time-zones
*/
export const ianaTimeZones = [
export const IANA_TIME_ZONES = [
'Africa/Abidjan',
'Africa/Accra',
'Africa/Addis_Ababa',

View File

@ -1,4 +1,4 @@
import { availableTimeZoneOptionsByLabel } from '@/settings/accounts/constants/timeZoneSelectOptions';
import { AVAILABLE_TIME_ZONE_OPTIONS_BY_LABEL } from '@/settings/accounts/constants/AvailableTimezoneOptionsByLabel';
import { formatTimeZoneLabel } from '@/settings/accounts/utils/formatTimeZoneLabel';
/**
@ -7,4 +7,4 @@ import { formatTimeZoneLabel } from '@/settings/accounts/utils/formatTimeZoneLab
* @returns the matching available IANA time zone select option or undefined
*/
export const findAvailableTimeZoneOption = (value: string) =>
availableTimeZoneOptionsByLabel[formatTimeZoneLabel(value)];
AVAILABLE_TIME_ZONE_OPTIONS_BY_LABEL[formatTimeZoneLabel(value)];

View File

@ -1,6 +1,6 @@
import styled from '@emotion/styled';
import { objectSettingsWidth } from '@/settings/data-model/constants/objectSettings';
import { OBJECT_SETTINGS_WIDTH } from '@/settings/data-model/constants/ObjectSettings';
const StyledSettingsPageContainer = styled.div<{ width?: number }>`
display: flex;
@ -8,7 +8,8 @@ const StyledSettingsPageContainer = styled.div<{ width?: number }>`
gap: ${({ theme }) => theme.spacing(8)};
overflow: auto;
padding: ${({ theme }) => theme.spacing(8)};
width: ${({ width }) => (width ? width + 'px' : objectSettingsWidth + 'px')};
width: ${({ width }) =>
width ? width + 'px' : OBJECT_SETTINGS_WIDTH + 'px'};
`;
export { StyledSettingsPageContainer as SettingsPageContainer };

View File

@ -2,7 +2,7 @@ import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
import { Select } from '@/ui/input/components/Select';
import { CardContent } from '@/ui/layout/card/components/CardContent';
import { settingsFieldCurrencyCodes } from '../constants/settingsFieldCurrencyCodes';
import { SETTINGS_FIELD_CURRENCY_CODES } from '../constants/SettingsFieldCurrencyCodes';
export type SettingsObjectFieldCurrencyFormValues = {
currencyCode: CurrencyCode;
@ -26,7 +26,7 @@ export const SettingsObjectFieldCurrencyForm = ({
label="Unit"
dropdownId="currency-unit-select"
value={values.currencyCode}
options={Object.entries(settingsFieldCurrencyCodes).map(
options={Object.entries(SETTINGS_FIELD_CURRENCY_CODES).map(
([value, { label, Icon }]) => ({
label,
value: value as CurrencyCode,

View File

@ -9,7 +9,7 @@ import { Select } from '@/ui/input/components/Select';
import { TextInput } from '@/ui/input/components/TextInput';
import { Field } from '~/generated-metadata/graphql';
import { relationTypes } from '../constants/relationTypes';
import { RELATION_TYPES } from '../constants/RelationTypes';
import { RelationType } from '../types/RelationType';
export type SettingsObjectFieldRelationFormValues = {
@ -75,7 +75,7 @@ export const SettingsObjectFieldRelationForm = ({
fullWidth
disabled={disableRelationEdition}
value={values.type}
options={Object.entries(relationTypes)
options={Object.entries(RELATION_TYPES)
.filter(([value]) => 'ONE_TO_ONE' !== value)
.map(([value, { label, Icon }]) => ({
label,

View File

@ -8,7 +8,10 @@ import { CardContent } from '@/ui/layout/card/components/CardContent';
import { CardFooter } from '@/ui/layout/card/components/CardFooter';
import { DraggableItem } from '@/ui/layout/draggable-list/components/DraggableItem';
import { DraggableList } from '@/ui/layout/draggable-list/components/DraggableList';
import { mainColorNames, ThemeColor } from '@/ui/theme/constants/colors';
import {
MAIN_COLOR_NAMES,
ThemeColor,
} from '@/ui/theme/constants/MainColorNames';
import { moveArrayItem } from '~/utils/array/moveArrayItem';
import { SettingsObjectFieldSelectFormOption } from '../types/SettingsObjectFieldSelectFormOption';
@ -48,11 +51,11 @@ const StyledButton = styled(LightButton)`
`;
const getNextColor = (currentColor: ThemeColor) => {
const currentColorIndex = mainColorNames.findIndex(
const currentColorIndex = MAIN_COLOR_NAMES.findIndex(
(color) => color === currentColor,
);
const nextColorIndex = (currentColorIndex + 1) % mainColorNames.length;
return mainColorNames[nextColorIndex];
const nextColorIndex = (currentColorIndex + 1) % MAIN_COLOR_NAMES.length;
return MAIN_COLOR_NAMES[nextColorIndex];
};
export const SettingsObjectFieldSelectForm = ({

View File

@ -19,7 +19,7 @@ import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/Drop
import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
import { MenuItemSelectColor } from '@/ui/navigation/menu-item/components/MenuItemSelectColor';
import { mainColorNames } from '@/ui/theme/constants/colors';
import { MAIN_COLOR_NAMES } from '@/ui/theme/constants/MainColorNames';
import { SettingsObjectFieldSelectFormOption } from '../types/SettingsObjectFieldSelectFormOption';
@ -89,7 +89,7 @@ export const SettingsObjectFieldSelectFormOptionRow = ({
dropdownComponents={
<DropdownMenu>
<DropdownMenuItemsContainer>
{mainColorNames.map((colorName) => (
{MAIN_COLOR_NAMES.map((colorName) => (
<MenuItemSelectColor
key={colorName}
onClick={() => {

View File

@ -1,13 +1,12 @@
import styled from '@emotion/styled';
import { RELATION_TYPES } from '@/settings/data-model/constants/RelationTypes';
import { SETTINGS_FIELD_METADATA_TYPES } from '@/settings/data-model/constants/SettingsFieldMetadataTypes';
import { H2Title } from '@/ui/display/typography/components/H2Title';
import { Select } from '@/ui/input/components/Select';
import { Section } from '@/ui/layout/section/components/Section';
import { Field, FieldMetadataType } from '~/generated-metadata/graphql';
import { relationTypes } from '../constants/relationTypes';
import { settingsFieldMetadataTypes } from '../constants/settingsFieldMetadataTypes';
import {
SettingsObjectFieldCurrencyForm,
SettingsObjectFieldCurrencyFormValues,
@ -71,7 +70,7 @@ export const SettingsObjectFieldTypeSelectSection = ({
const relationFormConfig = values.relation;
const selectFormConfig = values.select;
const fieldTypeOptions = Object.entries(settingsFieldMetadataTypes)
const fieldTypeOptions = Object.entries(SETTINGS_FIELD_METADATA_TYPES)
.filter(([key]) => !excludedFieldTypes?.includes(key as FieldMetadataType))
.map(([key, dataTypeConfig]) => ({
value: key as FieldMetadataType,
@ -124,11 +123,11 @@ export const SettingsObjectFieldTypeSelectSection = ({
!!relationFormConfig.objectMetadataId && (
<>
<StyledRelationImage
src={relationTypes[relationFormConfig.type].imageSrc}
src={RELATION_TYPES[relationFormConfig.type].imageSrc}
flip={
relationTypes[relationFormConfig.type].isImageFlipped
RELATION_TYPES[relationFormConfig.type].isImageFlipped
}
alt={relationTypes[relationFormConfig.type].label}
alt={RELATION_TYPES[relationFormConfig.type].label}
/>
<StyledSettingsObjectFieldPreview
fieldMetadata={{

View File

@ -0,0 +1 @@
export const DEFAULT_DATE_VALUE = new Date();

View File

@ -0,0 +1 @@
export const OBJECT_SETTINGS_WIDTH = 512;

View File

@ -6,7 +6,7 @@ import OneToManySvg from '../assets/OneToMany.svg';
import OneToOneSvg from '../assets/OneToOne.svg';
import { RelationType } from '../types/RelationType';
export const relationTypes: Record<
export const RELATION_TYPES: Record<
RelationType,
{
label: string;

View File

@ -9,7 +9,7 @@ import {
} from '@/ui/display/icon';
import { IconComponent } from '@/ui/display/icon/types/IconComponent';
export const settingsFieldCurrencyCodes: Record<
export const SETTINGS_FIELD_CURRENCY_CODES: Record<
CurrencyCode,
{ label: string; Icon: IconComponent }
> = {

View File

@ -1,4 +1,5 @@
import { CurrencyCode } from '@/object-record/record-field/types/CurrencyCode';
import { DEFAULT_DATE_VALUE } from '@/settings/data-model/constants/DefaultDateValue';
import {
IconCalendarEvent,
IconCheck,
@ -17,10 +18,9 @@ import { IconTwentyStar } from '@/ui/display/icon/components/IconTwentyStar';
import { IconComponent } from '@/ui/display/icon/types/IconComponent';
import { FieldMetadataType } from '~/generated-metadata/graphql';
const defaultDateValue = new Date();
defaultDateValue.setFullYear(defaultDateValue.getFullYear() + 2);
DEFAULT_DATE_VALUE.setFullYear(DEFAULT_DATE_VALUE.getFullYear() + 2);
export const settingsFieldMetadataTypes: Partial<
export const SETTINGS_FIELD_METADATA_TYPES: Partial<
Record<
FieldMetadataType,
{ label: string; Icon: IconComponent; defaultValue?: unknown }
@ -60,7 +60,7 @@ export const settingsFieldMetadataTypes: Partial<
[FieldMetadataType.DateTime]: {
label: 'Date & Time',
Icon: IconCalendarEvent,
defaultValue: defaultDateValue.toISOString(),
defaultValue: DEFAULT_DATE_VALUE.toISOString(),
},
[FieldMetadataType.Select]: {
label: 'Select',

View File

@ -1 +0,0 @@
export const objectSettingsWidth = 512;

View File

@ -1,8 +1,8 @@
import { useObjectMetadataItemForSettings } from '@/object-metadata/hooks/useObjectMetadataItemForSettings';
import { SETTINGS_FIELD_METADATA_TYPES } from '@/settings/data-model/constants/SettingsFieldMetadataTypes';
import { useIcons } from '@/ui/display/icon/hooks/useIcons';
import { Field, FieldMetadataType } from '~/generated-metadata/graphql';
import { settingsFieldMetadataTypes } from '../constants/settingsFieldMetadataTypes';
import { SettingsObjectFieldSelectFormOption } from '../types/SettingsObjectFieldSelectFormOption';
import { useFieldPreviewValue } from './useFieldPreviewValue';
@ -46,7 +46,7 @@ export const useFieldPreview = ({
});
const settingsFieldMetadataType =
settingsFieldMetadataTypes[fieldMetadata.type];
SETTINGS_FIELD_METADATA_TYPES[fieldMetadata.type];
const defaultSelectValue = selectOptions?.[0];
const selectValue =

View File

@ -1,12 +1,11 @@
import { css, useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { SETTINGS_FIELD_METADATA_TYPES } from '@/settings/data-model/constants/SettingsFieldMetadataTypes';
import { IconTwentyStar } from '@/ui/display/icon/components/IconTwentyStar';
import { IconComponent } from '@/ui/display/icon/types/IconComponent';
import { FieldMetadataType } from '~/generated-metadata/graphql';
import { settingsFieldMetadataTypes } from '../../constants/settingsFieldMetadataTypes';
type SettingsObjectFieldDataTypeProps = {
onClick?: () => void;
Icon?: IconComponent;
@ -50,8 +49,8 @@ const StyledLabelContainer = styled.div`
export const SettingsObjectFieldDataType = ({
onClick,
value,
Icon = settingsFieldMetadataTypes[value]?.Icon ?? IconTwentyStar,
label = settingsFieldMetadataTypes[value]?.label,
Icon = SETTINGS_FIELD_METADATA_TYPES[value]?.Icon ?? IconTwentyStar,
label = SETTINGS_FIELD_METADATA_TYPES[value]?.label,
}: SettingsObjectFieldDataTypeProps) => {
const theme = useTheme();

View File

@ -6,14 +6,14 @@ import styled from '@emotion/styled';
import { useGetRelationMetadata } from '@/object-metadata/hooks/useGetRelationMetadata';
import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug';
import { SETTINGS_FIELD_METADATA_TYPES } from '@/settings/data-model/constants/SettingsFieldMetadataTypes';
import { FieldIdentifierType } from '@/settings/data-model/types/FieldIdentifierType';
import { useIcons } from '@/ui/display/icon/hooks/useIcons';
import { TableCell } from '@/ui/layout/table/components/TableCell';
import { TableRow } from '@/ui/layout/table/components/TableRow';
import { Nullable } from '~/types/Nullable';
import { relationTypes } from '../../constants/relationTypes';
import { settingsFieldMetadataTypes } from '../../constants/settingsFieldMetadataTypes';
import { RELATION_TYPES } from '../../constants/RelationTypes';
import { SettingsObjectFieldDataType } from './SettingsObjectFieldDataType';
@ -51,7 +51,7 @@ export const SettingsObjectFieldItemTableRow = ({
// TODO: parse with zod and merge types with FieldType (create a subset of FieldType for example)
const fieldDataTypeIsSupported =
fieldMetadataItem.type in settingsFieldMetadataTypes;
fieldMetadataItem.type in SETTINGS_FIELD_METADATA_TYPES;
const getRelationMetadata = useGetRelationMetadata();
@ -64,7 +64,7 @@ export const SettingsObjectFieldItemTableRow = ({
if (!fieldDataTypeIsSupported) return null;
const RelationIcon = relationType
? relationTypes[relationType].Icon
? RELATION_TYPES[relationType].Icon
: undefined;
return (

View File

@ -1,4 +1,4 @@
import { ThemeColor } from '@/ui/theme/constants/colors';
import { ThemeColor } from '@/ui/theme/constants/MainColorNames';
export type SettingsObjectFieldSelectFormOption = {
color: ThemeColor;

View File

@ -1,4 +1,4 @@
export const ExpirationDates: {
export const EXPIRATION_DATES: {
value: number | null;
label: string;
}[] = [