feat: activate, disable and erase fields in Object Detail (#2200)

* feat: activate and disable objects

Closes #2144, Closes #2148, Closes #2154

* feat: activate, disable and erase fields in Object Detail

Closes #2158

---------

Co-authored-by: Charles Bochet <charlesBochet@users.noreply.github.com>
This commit is contained in:
Thaïs
2023-10-24 08:30:13 +02:00
committed by GitHub
parent 26e8cd76be
commit 291feae595
9 changed files with 206 additions and 12 deletions

View File

@ -2,15 +2,18 @@ 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 { SettingsPageContainer } from '@/settings/components/SettingsPageContainer';
import { SettingsAboutSection } from '@/settings/data-model/object-details/components/SettingsObjectAboutSection';
import { SettingsObjectFieldActiveActionDropdown } from '@/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown';
import { SettingsObjectFieldDisabledActionDropdown } from '@/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown';
import {
SettingsObjectFieldItemTableRow,
StyledObjectFieldTableRow,
} from '@/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow';
import { AppPath } from '@/types/AppPath';
import { IconDotsVertical, IconPlus, IconSettings } from '@/ui/display/icon';
import { IconPlus, IconSettings } from '@/ui/display/icon';
import { H2Title } from '@/ui/display/typography/components/H2Title';
import { Button } from '@/ui/input/button/components/Button';
import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
@ -41,6 +44,7 @@ export const SettingsObjectDetail = () => {
}
}, [activeObject, activeObjects.length, navigate]);
const { activateField, disableField, eraseField } = useFieldMetadata();
const activeFields = activeObject?.fields.filter(
(fieldItem) => fieldItem.isActive,
);
@ -89,7 +93,18 @@ export const SettingsObjectDetail = () => {
<SettingsObjectFieldItemTableRow
key={fieldItem.id}
fieldItem={fieldItem}
ActionIcon={IconDotsVertical}
ActionIcon={
<SettingsObjectFieldActiveActionDropdown
isCustomField={fieldItem.isCustom}
scopeKey={fieldItem.id}
onEdit={() =>
navigate(
`/settings/objects/${pluralObjectName}/${fieldItem.name}`,
)
}
onDisable={() => disableField(fieldItem)}
/>
}
/>
))}
</TableSection>
@ -100,7 +115,14 @@ export const SettingsObjectDetail = () => {
<SettingsObjectFieldItemTableRow
key={fieldItem.id}
fieldItem={fieldItem}
ActionIcon={IconDotsVertical}
ActionIcon={
<SettingsObjectFieldDisabledActionDropdown
isCustomField={fieldItem.isCustom}
scopeKey={fieldItem.id}
onActivate={() => activateField(fieldItem)}
onErase={() => eraseField(fieldItem)}
/>
}
/>
))}
</TableSection>

View File

@ -14,6 +14,7 @@ import { AppPath } from '@/types/AppPath';
import { IconMinus, IconPlus, IconSettings } from '@/ui/display/icon';
import { H2Title } from '@/ui/display/typography/components/H2Title';
import { Button } from '@/ui/input/button/components/Button';
import { LightIconButton } from '@/ui/input/button/components/LightIconButton';
import { SubMenuTopBarContainer } from '@/ui/layout/page/SubMenuTopBarContainer';
import { Section } from '@/ui/layout/section/components/Section';
import { Table } from '@/ui/layout/table/components/Table';
@ -93,7 +94,9 @@ export const SettingsObjectNewFieldStep1 = () => {
<SettingsObjectFieldItemTableRow
key={fieldItem.id}
fieldItem={fieldItem}
ActionIcon={IconMinus}
ActionIcon={
<LightIconButton Icon={IconMinus} accent="tertiary" />
}
/>
))}
</TableSection>
@ -104,7 +107,9 @@ export const SettingsObjectNewFieldStep1 = () => {
<SettingsObjectFieldItemTableRow
key={fieldItem.name}
fieldItem={fieldItem}
ActionIcon={IconPlus}
ActionIcon={
<LightIconButton Icon={IconPlus} accent="tertiary" />
}
/>
))}
</TableSection>