[REFACTOR][FRONT]: Remove objectMetadata and fieldMetadata sluggification (#9441)
# Introduction For motivations and context please have a look to https://github.com/twentyhq/twenty/pull/9394 whom this PR results from. In this pull-request we remove any `metadataField` and `objectMetadata` sluggification. We directly consume `objectMetadata.namePlural` and `metadataField.name`, ***it seems like that historically the consumed `metadataField.name`*** are we sure that we wanna change this behavior ? ## Notes Unless I'm mistaken by reverting the `kebabcase` url formatting we might be creating deadlinks that user could have save beforehand => Discussed with Charles said it's controlled risk. --------- Co-authored-by: Paul Rastoin <paulrastoin@Pauls-MacBook-Pro.local>
This commit is contained in:
Paul Rastoin
@ -68,7 +68,7 @@ export const SettingsDataModelNewFieldBreadcrumbDropDown = () => {
|
||||
const { closeDropdown } = useDropdown(dropdownId);
|
||||
const navigate = useNavigate();
|
||||
const location = useLocation();
|
||||
const { objectSlug = '' } = useParams();
|
||||
const { objectNamePlural = '' } = useParams();
|
||||
const [searchParams] = useSearchParams();
|
||||
const theme = useTheme();
|
||||
|
||||
@ -78,11 +78,11 @@ export const SettingsDataModelNewFieldBreadcrumbDropDown = () => {
|
||||
const handleClick = (step: 'select' | 'configure') => {
|
||||
if (step === 'configure' && isDefined(fieldType)) {
|
||||
navigate(
|
||||
`/settings/objects/${objectSlug}/new-field/configure?fieldType=${fieldType}`,
|
||||
`/settings/objects/${objectNamePlural}/new-field/configure?fieldType=${fieldType}`,
|
||||
);
|
||||
} else {
|
||||
navigate(
|
||||
`/settings/objects/${objectSlug}/new-field/select${fieldType ? `?fieldType=${fieldType}` : ''}`,
|
||||
`/settings/objects/${objectNamePlural}/new-field/select${fieldType ? `?fieldType=${fieldType}` : ''}`,
|
||||
);
|
||||
}
|
||||
closeDropdown();
|
||||
|
||||
@ -26,7 +26,7 @@ type SettingsObjectNewFieldSelectorProps = {
|
||||
'defaultValue' | 'options' | 'type'
|
||||
>;
|
||||
|
||||
objectSlug: string;
|
||||
objectNamePlural: string;
|
||||
};
|
||||
|
||||
const StyledTypeSelectContainer = styled.div`
|
||||
@ -58,7 +58,7 @@ const StyledSearchInput = styled(TextInput)`
|
||||
export const SettingsObjectNewFieldSelector = ({
|
||||
excludedFieldTypes = [],
|
||||
fieldMetadataItem,
|
||||
objectSlug,
|
||||
objectNamePlural,
|
||||
}: SettingsObjectNewFieldSelectorProps) => {
|
||||
const theme = useTheme();
|
||||
const { control, setValue } =
|
||||
@ -128,7 +128,7 @@ export const SettingsObjectNewFieldSelector = ({
|
||||
.map(([key, config]) => (
|
||||
<StyledCardContainer key={key}>
|
||||
<UndecoratedLink
|
||||
to={`/settings/objects/${objectSlug}/new-field/configure?fieldType=${key}`}
|
||||
to={`/settings/objects/${objectNamePlural}/new-field/configure?fieldType=${key}`}
|
||||
fullWidth
|
||||
onClick={() => {
|
||||
setValue('type', key as SettingsFieldType);
|
||||
|
||||
@ -5,7 +5,6 @@ import { Link } from 'react-router-dom';
|
||||
import { IconChevronDown, IconChevronUp, useIcons } from 'twenty-ui';
|
||||
|
||||
import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
|
||||
import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug';
|
||||
import { useFindManyRecords } from '@/object-record/hooks/useFindManyRecords';
|
||||
import { ObjectFieldRow } from '@/settings/data-model/graph-overview/components/SettingsDataModelOverviewField';
|
||||
import { SettingsDataModelObjectTypeTag } from '@/settings/data-model/objects/components/SettingsDataModelObjectTypeTag';
|
||||
@ -100,36 +99,38 @@ const StyledObjectLink = styled(Link)`
|
||||
`;
|
||||
|
||||
export const SettingsDataModelOverviewObject = ({
|
||||
data,
|
||||
data: objectMetadataItem,
|
||||
}: SettingsDataModelOverviewObjectProps) => {
|
||||
const theme = useTheme();
|
||||
const { getIcon } = useIcons();
|
||||
const [otherFieldsExpanded, setOtherFieldsExpanded] = useState(false);
|
||||
|
||||
const { totalCount } = useFindManyRecords({
|
||||
objectNameSingular: data.nameSingular,
|
||||
objectNameSingular: objectMetadataItem.nameSingular,
|
||||
});
|
||||
|
||||
const fields = data.fields.filter((x) => !x.isSystem);
|
||||
const fields = objectMetadataItem.fields.filter((x) => !x.isSystem);
|
||||
|
||||
const countNonRelation = fields.filter(
|
||||
(x) => x.type !== FieldMetadataType.Relation,
|
||||
).length;
|
||||
|
||||
const Icon = getIcon(data.icon);
|
||||
const Icon = getIcon(objectMetadataItem.icon);
|
||||
|
||||
return (
|
||||
<StyledNode>
|
||||
<StyledHeader>
|
||||
<StyledObjectName onMouseEnter={() => {}} onMouseLeave={() => {}}>
|
||||
<StyledObjectLink to={`/settings/objects/${getObjectSlug(data)}`}>
|
||||
<StyledObjectLink
|
||||
to={`/settings/objects/${objectMetadataItem.namePlural}`}
|
||||
>
|
||||
{Icon && <Icon size={theme.icon.size.md} />}
|
||||
{capitalize(data.namePlural)}
|
||||
{capitalize(objectMetadataItem.namePlural)}
|
||||
</StyledObjectLink>
|
||||
<StyledObjectInstanceCount> · {totalCount}</StyledObjectInstanceCount>
|
||||
</StyledObjectName>
|
||||
<SettingsDataModelObjectTypeTag
|
||||
objectTypeLabel={getObjectTypeLabel(data)}
|
||||
objectTypeLabel={getObjectTypeLabel(objectMetadataItem)}
|
||||
></SettingsDataModelObjectTypeTag>
|
||||
</StyledHeader>
|
||||
|
||||
|
||||
@ -4,8 +4,6 @@ import { useGetRelationMetadata } from '@/object-metadata/hooks/useGetRelationMe
|
||||
import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem';
|
||||
import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
|
||||
import { FieldMetadataItem } from '@/object-metadata/types/FieldMetadataItem';
|
||||
import { getFieldSlug } from '@/object-metadata/utils/getFieldSlug';
|
||||
import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug';
|
||||
import { isLabelIdentifierField } from '@/object-metadata/utils/isLabelIdentifierField';
|
||||
import { useDeleteRecordFromCache } from '@/object-record/cache/hooks/useDeleteRecordFromCache';
|
||||
import { usePrefetchedData } from '@/prefetch/hooks/usePrefetchedData';
|
||||
@ -110,7 +108,7 @@ export const SettingsObjectFieldItemTableRow = ({
|
||||
!isLabelIdentifier &&
|
||||
LABEL_IDENTIFIER_FIELD_METADATA_TYPES.includes(fieldMetadataItem.type);
|
||||
|
||||
const linkToNavigate = `./${getFieldSlug(fieldMetadataItem)}`;
|
||||
const linkToNavigate = `./${fieldMetadataItem.name}`;
|
||||
|
||||
const {
|
||||
activateMetadataField,
|
||||
@ -246,7 +244,7 @@ export const SettingsObjectFieldItemTableRow = ({
|
||||
}
|
||||
to={
|
||||
isRelatedObjectLinkable
|
||||
? `/settings/objects/${getObjectSlug(relationObjectMetadataItem)}`
|
||||
? `/settings/objects/${relationObjectMetadataItem.namePlural}`
|
||||
: undefined
|
||||
}
|
||||
value={fieldType}
|
||||
|
||||
@ -9,7 +9,6 @@ import { z, ZodError } from 'zod';
|
||||
import { useLastVisitedObjectMetadataItem } from '@/navigation/hooks/useLastVisitedObjectMetadataItem';
|
||||
import { useLastVisitedView } from '@/navigation/hooks/useLastVisitedView';
|
||||
import { useUpdateOneObjectMetadataItem } from '@/object-metadata/hooks/useUpdateOneObjectMetadataItem';
|
||||
import { getObjectSlug } from '@/object-metadata/utils/getObjectSlug';
|
||||
import { RecordFieldValueSelectorContextProvider } from '@/object-record/record-store/contexts/RecordFieldValueSelectorContext';
|
||||
import {
|
||||
IS_LABEL_SYNCED_WITH_NAME_LABEL,
|
||||
@ -28,7 +27,7 @@ import styled from '@emotion/styled';
|
||||
import isEmpty from 'lodash.isempty';
|
||||
import pick from 'lodash.pick';
|
||||
import { useSetRecoilState } from 'recoil';
|
||||
import { updatedObjectSlugState } from '~/pages/settings/data-model/states/updatedObjectSlugState';
|
||||
import { updatedObjectNamePluralState } from '~/pages/settings/data-model/states/updatedObjectNamePluralState';
|
||||
import { computeMetadataNameFromLabel } from '~/pages/settings/data-model/utils/compute-metadata-name-from-label.utils';
|
||||
|
||||
const objectEditFormSchema = z
|
||||
@ -57,7 +56,9 @@ const StyledFormSection = styled(Section)`
|
||||
export const ObjectSettings = ({ objectMetadataItem }: ObjectSettingsProps) => {
|
||||
const navigate = useNavigate();
|
||||
const { enqueueSnackBar } = useSnackBar();
|
||||
const setUpdatedObjectSlugState = useSetRecoilState(updatedObjectSlugState);
|
||||
const setUpdatedObjectNamePlural = useSetRecoilState(
|
||||
updatedObjectNamePluralState,
|
||||
);
|
||||
|
||||
const { updateOneObjectMetadataItem } = useUpdateOneObjectMetadataItem();
|
||||
const { lastVisitedObjectMetadataItemId } =
|
||||
@ -131,12 +132,8 @@ export const ObjectSettings = ({ objectMetadataItem }: ObjectSettingsProps) => {
|
||||
const updatePayload = getUpdatePayload(formValues);
|
||||
const objectNamePluralForRedirection =
|
||||
updatePayload.namePlural ?? objectMetadataItem.namePlural;
|
||||
const objectSlug = getObjectSlug({
|
||||
...updatePayload,
|
||||
namePlural: objectNamePluralForRedirection,
|
||||
});
|
||||
|
||||
setUpdatedObjectSlugState(objectSlug);
|
||||
setUpdatedObjectNamePlural(objectNamePluralForRedirection);
|
||||
|
||||
await updateOneObjectMetadataItem({
|
||||
idToUpdate: objectMetadataItem.id,
|
||||
@ -154,7 +151,7 @@ export const ObjectSettings = ({ objectMetadataItem }: ObjectSettingsProps) => {
|
||||
);
|
||||
}
|
||||
|
||||
navigate(`${settingsObjectsPagePath}/${objectSlug}`);
|
||||
navigate(`${settingsObjectsPagePath}/${objectNamePluralForRedirection}`);
|
||||
} catch (error) {
|
||||
if (error instanceof ZodError) {
|
||||
enqueueSnackBar(error.issues[0].message, {
|
||||
|
||||
Reference in New Issue
Block a user