feat: activate standard objects in New Object page (#2232)

* feat: activate standard objects in New Object page

Closes #2010, Closes #2173

* Pagination limit = 1000

* Various fixes

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Thaïs
2023-10-27 15:46:29 +02:00
committed by GitHub
parent ec3327ca81
commit 3c6ce75606
29 changed files with 470 additions and 343 deletions

View File

@ -2,8 +2,8 @@ import { useEffect } from 'react';
import { useNavigate, useParams } from 'react-router-dom';
import styled from '@emotion/styled';
import { useFieldMetadata } from '@/metadata/hooks/useFieldMetadata';
import { useObjectMetadata } from '@/metadata/hooks/useObjectMetadata';
import { useMetadataField } from '@/metadata/hooks/useMetadataField';
import { useMetadataObjectForSettings } from '@/metadata/hooks/useMetadataObjectForSettings';
import { getFieldSlug } from '@/metadata/utils/getFieldSlug';
import { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
import { SettingsAboutSection } from '@/settings/data-model/object-details/components/SettingsObjectAboutSection';
@ -34,28 +34,30 @@ export const SettingsObjectDetail = () => {
const navigate = useNavigate();
const { objectSlug = '' } = useParams();
const { disableObject, findActiveObjectBySlug, loading } =
useObjectMetadata();
const activeObject = findActiveObjectBySlug(objectSlug);
const { disableMetadataObject, findActiveMetadataObjectBySlug, loading } =
useMetadataObjectForSettings();
const activeMetadataObject = findActiveMetadataObjectBySlug(objectSlug);
useEffect(() => {
if (loading) return;
if (!activeObject) navigate(AppPath.NotFound);
}, [activeObject, loading, navigate]);
if (!activeMetadataObject) navigate(AppPath.NotFound);
}, [activeMetadataObject, loading, navigate]);
const { activateField, disableField, eraseField } = useFieldMetadata();
const { activateMetadataField, disableMetadataField, eraseMetadataField } =
useMetadataField();
if (!activeObject) return null;
if (!activeMetadataObject) return null;
const activeFields = activeObject.fields.filter(
(fieldItem) => fieldItem.isActive,
const activeMetadataFields = activeMetadataObject.fields.filter(
(metadataField) => metadataField.isActive,
);
const disabledFields = activeObject.fields.filter(
(fieldItem) => !fieldItem.isActive,
const disabledMetadataFields = activeMetadataObject.fields.filter(
(metadataField) => !metadataField.isActive,
);
const handleDisable = async () => {
await disableObject(activeObject);
await disableMetadataObject(activeMetadataObject);
navigate('/settings/objects');
};
@ -65,20 +67,20 @@ export const SettingsObjectDetail = () => {
<Breadcrumb
links={[
{ children: 'Objects', href: '/settings/objects' },
{ children: activeObject.labelPlural },
{ children: activeMetadataObject.labelPlural },
]}
/>
<SettingsAboutSection
iconKey={activeObject.icon ?? undefined}
name={activeObject.labelPlural || ''}
isCustom={activeObject.isCustom}
iconKey={activeMetadataObject.icon ?? undefined}
name={activeMetadataObject.labelPlural || ''}
isCustom={activeMetadataObject.isCustom}
onDisable={handleDisable}
onEdit={() => navigate('./edit')}
/>
<Section>
<H2Title
title="Fields"
description={`Customise the fields available in the ${activeObject.labelSingular} views and their display order in the ${activeObject.labelSingular} detail view and menus.`}
description={`Customise the fields available in the ${activeMetadataObject.labelSingular} views and their display order in the ${activeMetadataObject.labelSingular} detail view and menus.`}
/>
<Table>
<StyledObjectFieldTableRow>
@ -87,36 +89,44 @@ export const SettingsObjectDetail = () => {
<TableHeader>Data type</TableHeader>
<TableHeader></TableHeader>
</StyledObjectFieldTableRow>
{!!activeFields.length && (
{!!activeMetadataFields.length && (
<TableSection title="Active">
{activeFields.map((fieldItem) => (
{activeMetadataFields.map((activeMetadataField) => (
<SettingsObjectFieldItemTableRow
key={fieldItem.id}
fieldItem={fieldItem}
key={activeMetadataField.id}
fieldItem={activeMetadataField}
ActionIcon={
<SettingsObjectFieldActiveActionDropdown
isCustomField={fieldItem.isCustom}
scopeKey={fieldItem.id}
onEdit={() => navigate(`./${getFieldSlug(fieldItem)}`)}
onDisable={() => disableField(fieldItem)}
isCustomField={activeMetadataField.isCustom}
scopeKey={activeMetadataField.id}
onEdit={() =>
navigate(`./${getFieldSlug(activeMetadataField)}`)
}
onDisable={() =>
disableMetadataField(activeMetadataField)
}
/>
}
/>
))}
</TableSection>
)}
{!!disabledFields.length && (
{!!disabledMetadataFields.length && (
<TableSection isInitiallyExpanded={false} title="Disabled">
{disabledFields.map((fieldItem) => (
{disabledMetadataFields.map((disabledMetadataField) => (
<SettingsObjectFieldItemTableRow
key={fieldItem.id}
fieldItem={fieldItem}
key={disabledMetadataField.id}
fieldItem={disabledMetadataField}
ActionIcon={
<SettingsObjectFieldDisabledActionDropdown
isCustomField={fieldItem.isCustom}
scopeKey={fieldItem.id}
onActivate={() => activateField(fieldItem)}
onErase={() => eraseField(fieldItem)}
isCustomField={disabledMetadataField.isCustom}
scopeKey={disabledMetadataField.id}
onActivate={() =>
activateMetadataField(disabledMetadataField)
}
onErase={() =>
eraseMetadataField(disabledMetadataField)
}
/>
}
/>
@ -132,7 +142,7 @@ export const SettingsObjectDetail = () => {
variant="secondary"
onClick={() =>
navigate(
disabledFields.length
disabledMetadataFields.length
? './new-field/step-1'
: './new-field/step-2',
)