From 88ca846f83f63622373448ad73eceaec873eca49 Mon Sep 17 00:00:00 2001 From: bosiraphael <71827178+bosiraphael@users.noreply.github.com> Date: Mon, 6 Nov 2023 17:18:25 +0100 Subject: [PATCH] Rename InlineCell to RecordInlineCell (#2377) rename inline cell --- .../ActivityAssigneeEditableField.tsx | 4 +-- .../components/ActivityEditorDateField.tsx | 4 +-- .../ActivityRelationEditableField.tsx | 4 +-- .../companies/components/CompanyBoardCard.tsx | 4 +-- .../metadata/components/RecordShowPage.tsx | 4 +-- .../{InlineCell.tsx => RecordInlineCell.tsx} | 6 ++--- ...iner.tsx => RecordInlineCellContainer.tsx} | 26 +++++++++---------- ...de.tsx => RecordInlineCellDisplayMode.tsx} | 20 +++++++------- ...ton.tsx => RecordInlineCellEditButton.tsx} | 2 +- ...tMode.tsx => RecordInlineCellEditMode.tsx} | 8 +++--- front/src/pages/companies/CompanyShow.tsx | 4 +-- front/src/pages/people/PersonShow.tsx | 4 +-- 12 files changed, 46 insertions(+), 44 deletions(-) rename front/src/modules/ui/object/record-inline-cell/components/{InlineCell.tsx => RecordInlineCell.tsx} (94%) rename front/src/modules/ui/object/record-inline-cell/components/{InlineCellContainer.tsx => RecordInlineCellContainer.tsx} (86%) rename front/src/modules/ui/object/record-inline-cell/components/{InlineCellDisplayMode.tsx => RecordInlineCellDisplayMode.tsx} (75%) rename front/src/modules/ui/object/record-inline-cell/components/{InlineCellEditButton.tsx => RecordInlineCellEditButton.tsx} (86%) rename front/src/modules/ui/object/record-inline-cell/components/{InlineCellEditMode.tsx => RecordInlineCellEditMode.tsx} (72%) diff --git a/front/src/modules/activities/editable-fields/components/ActivityAssigneeEditableField.tsx b/front/src/modules/activities/editable-fields/components/ActivityAssigneeEditableField.tsx index bf2d4d756..f97b93eb9 100644 --- a/front/src/modules/activities/editable-fields/components/ActivityAssigneeEditableField.tsx +++ b/front/src/modules/activities/editable-fields/components/ActivityAssigneeEditableField.tsx @@ -5,7 +5,7 @@ import { Entity } from '@/ui/input/relation-picker/types/EntityTypeForSelect'; import { FieldContext } from '@/ui/object/field/contexts/FieldContext'; import { FieldDefinition } from '@/ui/object/field/types/FieldDefinition'; import { FieldRelationMetadata } from '@/ui/object/field/types/FieldMetadata'; -import { InlineCell } from '@/ui/object/record-inline-cell/components/InlineCell'; +import { RecordInlineCell } from '@/ui/object/record-inline-cell/components/RecordInlineCell'; import { InlineCellHotkeyScope } from '@/ui/object/record-inline-cell/types/InlineCellHotkeyScope'; import { Company, User, useUpdateActivityMutation } from '~/generated/graphql'; @@ -47,7 +47,7 @@ export const ActivityAssigneeEditableField = ({ return ( - + ); }; diff --git a/front/src/modules/activities/editable-fields/components/ActivityEditorDateField.tsx b/front/src/modules/activities/editable-fields/components/ActivityEditorDateField.tsx index 21a59757c..d7e4680f3 100644 --- a/front/src/modules/activities/editable-fields/components/ActivityEditorDateField.tsx +++ b/front/src/modules/activities/editable-fields/components/ActivityEditorDateField.tsx @@ -2,7 +2,7 @@ import { IconCalendar } from '@/ui/display/icon/index'; import { FieldContext } from '@/ui/object/field/contexts/FieldContext'; import { FieldDefinition } from '@/ui/object/field/types/FieldDefinition'; import { FieldDateMetadata } from '@/ui/object/field/types/FieldMetadata'; -import { InlineCell } from '@/ui/object/record-inline-cell/components/InlineCell'; +import { RecordInlineCell } from '@/ui/object/record-inline-cell/components/RecordInlineCell'; import { InlineCellHotkeyScope } from '@/ui/object/record-inline-cell/types/InlineCellHotkeyScope'; import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope'; import { useUpdateActivityMutation } from '~/generated/graphql'; @@ -33,7 +33,7 @@ export const ActivityEditorDateField = ({ hotkeyScope: InlineCellHotkeyScope.InlineCell, }} > - + ); diff --git a/front/src/modules/activities/editable-fields/components/ActivityRelationEditableField.tsx b/front/src/modules/activities/editable-fields/components/ActivityRelationEditableField.tsx index be6268713..5c9de6335 100644 --- a/front/src/modules/activities/editable-fields/components/ActivityRelationEditableField.tsx +++ b/front/src/modules/activities/editable-fields/components/ActivityRelationEditableField.tsx @@ -1,7 +1,7 @@ import { ActivityTargetChips } from '@/activities/components/ActivityTargetChips'; import { IconArrowUpRight, IconPencil } from '@/ui/display/icon'; import { RelationPickerHotkeyScope } from '@/ui/input/relation-picker/types/RelationPickerHotkeyScope'; -import { InlineCellContainer } from '@/ui/object/record-inline-cell/components/InlineCellContainer'; +import { RecordInlineCellContainer } from '@/ui/object/record-inline-cell/components/RecordInlineCellContainer'; import { FieldRecoilScopeContext } from '@/ui/object/record-inline-cell/states/recoil-scope-contexts/FieldRecoilScopeContext'; import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope'; import { Activity, ActivityTarget, Company, Person } from '~/generated/graphql'; @@ -25,7 +25,7 @@ export const ActivityRelationEditableField = ({ return ( - { hotkeyScope: InlineCellHotkeyScope.InlineCell, }} > - + ))} diff --git a/front/src/modules/metadata/components/RecordShowPage.tsx b/front/src/modules/metadata/components/RecordShowPage.tsx index aba96ca59..4c73d3881 100644 --- a/front/src/modules/metadata/components/RecordShowPage.tsx +++ b/front/src/modules/metadata/components/RecordShowPage.tsx @@ -17,7 +17,7 @@ import { ShowPageSummaryCard } from '@/ui/layout/show-page/components/ShowPageSu import { ShowPageRecoilScopeContext } from '@/ui/layout/states/ShowPageRecoilScopeContext'; import { FieldContext } from '@/ui/object/field/contexts/FieldContext'; import { entityFieldsFamilyState } from '@/ui/object/field/states/entityFieldsFamilyState'; -import { InlineCell } from '@/ui/object/record-inline-cell/components/InlineCell'; +import { RecordInlineCell } from '@/ui/object/record-inline-cell/components/RecordInlineCell'; import { PropertyBox } from '@/ui/object/record-inline-cell/property-box/components/PropertyBox'; import { InlineCellHotkeyScope } from '@/ui/object/record-inline-cell/types/InlineCellHotkeyScope'; import { PageTitle } from '@/ui/utilities/page-title/PageTitle'; @@ -140,7 +140,7 @@ export const RecordShowPage = () => { hotkeyScope: InlineCellHotkeyScope.InlineCell, }} > - + ); })} diff --git a/front/src/modules/ui/object/record-inline-cell/components/InlineCell.tsx b/front/src/modules/ui/object/record-inline-cell/components/RecordInlineCell.tsx similarity index 94% rename from front/src/modules/ui/object/record-inline-cell/components/InlineCell.tsx rename to front/src/modules/ui/object/record-inline-cell/components/RecordInlineCell.tsx index 54dff8f85..0a3c667f9 100644 --- a/front/src/modules/ui/object/record-inline-cell/components/InlineCell.tsx +++ b/front/src/modules/ui/object/record-inline-cell/components/RecordInlineCell.tsx @@ -12,9 +12,9 @@ import { FieldInputEvent } from '../../field/types/FieldInputEvent'; import { isFieldRelation } from '../../field/types/guards/isFieldRelation'; import { useInlineCell } from '../hooks/useInlineCell'; -import { InlineCellContainer } from './InlineCellContainer'; +import { RecordInlineCellContainer } from './RecordInlineCellContainer'; -export const InlineCell = () => { +export const RecordInlineCell = () => { const { fieldDefinition } = useContext(FieldContext); const buttonIcon = useGetButtonIcon(); @@ -59,7 +59,7 @@ export const InlineCell = () => { }; return ( - + Pick >` align-items: center; @@ -74,7 +74,7 @@ const StyledInlineCellBaseContainer = styled.div` width: 100%; `; -type InlineCellContainerProps = { +type RecordInlineCellContainerProps = { IconLabel?: IconComponent; label?: string; labelFixedWidth?: number; @@ -88,7 +88,7 @@ type InlineCellContainerProps = { disableHoverEffect?: boolean; }; -export const InlineCellContainer = ({ +export const RecordInlineCellContainer = ({ IconLabel, label, labelFixedWidth, @@ -100,7 +100,7 @@ export const InlineCellContainer = ({ editModeContentOnly, isDisplayModeFixHeight, disableHoverEffect, -}: InlineCellContainerProps) => { +}: RecordInlineCellContainerProps) => { const [isHovered, setIsHovered] = useState(false); const handleContainerMouseEnter = () => { @@ -141,28 +141,28 @@ export const InlineCellContainer = ({ {isInlineCellInEditMode ? ( - {editModeContent} + {editModeContent} ) : editModeContentOnly ? ( - {editModeContent} - + ) : ( - {displayModeContent} - + {showEditButton && ( - + )} diff --git a/front/src/modules/ui/object/record-inline-cell/components/InlineCellDisplayMode.tsx b/front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellDisplayMode.tsx similarity index 75% rename from front/src/modules/ui/object/record-inline-cell/components/InlineCellDisplayMode.tsx rename to front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellDisplayMode.tsx index 941b2654d..3233981f8 100644 --- a/front/src/modules/ui/object/record-inline-cell/components/InlineCellDisplayMode.tsx +++ b/front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellDisplayMode.tsx @@ -1,9 +1,9 @@ import { css } from '@emotion/react'; import styled from '@emotion/styled'; -const StyledInlineCellNormalModeOuterContainer = styled.div< +const StyledRecordInlineCellNormalModeOuterContainer = styled.div< Pick< - InlineCellDisplayModeProps, + RecordInlineCellDisplayModeProps, | 'isDisplayModeContentEmpty' | 'disableHoverEffect' | 'isDisplayModeFixHeight' @@ -32,7 +32,7 @@ const StyledInlineCellNormalModeOuterContainer = styled.div< }} `; -const StyledInlineCellNormalModeInnerContainer = styled.div` +const StyledRecordInlineCellNormalModeInnerContainer = styled.div` align-items: center; color: ${({ theme }) => theme.font.color.primary}; font-size: 'inherit'; @@ -50,32 +50,32 @@ const StyledEmptyField = styled.div` color: ${({ theme }) => theme.font.color.light}; `; -type InlineCellDisplayModeProps = { +type RecordInlineCellDisplayModeProps = { isDisplayModeContentEmpty?: boolean; disableHoverEffect?: boolean; isDisplayModeFixHeight?: boolean; isHovered?: boolean; }; -export const InlineCellDisplayMode = ({ +export const RecordInlineCellDisplayMode = ({ children, isDisplayModeContentEmpty, disableHoverEffect, isDisplayModeFixHeight, isHovered, -}: React.PropsWithChildren) => ( - ) => ( + - + {isDisplayModeContentEmpty || !children ? ( {'Empty'} ) : ( children )} - - + + ); diff --git a/front/src/modules/ui/object/record-inline-cell/components/InlineCellEditButton.tsx b/front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellEditButton.tsx similarity index 86% rename from front/src/modules/ui/object/record-inline-cell/components/InlineCellEditButton.tsx rename to front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellEditButton.tsx index 63d7eb470..33a6c504e 100644 --- a/front/src/modules/ui/object/record-inline-cell/components/InlineCellEditButton.tsx +++ b/front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellEditButton.tsx @@ -3,7 +3,7 @@ import { FloatingIconButton } from '@/ui/input/button/components/FloatingIconBut import { useInlineCell } from '../hooks/useInlineCell'; -export const InlineCellButton = ({ Icon }: { Icon: IconComponent }) => { +export const RecordInlineCellButton = ({ Icon }: { Icon: IconComponent }) => { const { openInlineCell } = useInlineCell(); const handleClick = () => { diff --git a/front/src/modules/ui/object/record-inline-cell/components/InlineCellEditMode.tsx b/front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellEditMode.tsx similarity index 72% rename from front/src/modules/ui/object/record-inline-cell/components/InlineCellEditMode.tsx rename to front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellEditMode.tsx index 11a5da30d..6cd57f123 100644 --- a/front/src/modules/ui/object/record-inline-cell/components/InlineCellEditMode.tsx +++ b/front/src/modules/ui/object/record-inline-cell/components/RecordInlineCellEditMode.tsx @@ -1,6 +1,6 @@ import styled from '@emotion/styled'; -const StyledInlineCellEditModeContainer = styled.div` +const StyledInlineCellEditModeContainer = styled.div` align-items: center; display: flex; @@ -22,11 +22,13 @@ const StyledInlineCellInput = styled.div` z-index: 10; `; -type InlineCellEditModeProps = { +type RecordInlineCellEditModeProps = { children: React.ReactNode; }; -export const InlineCellEditMode = ({ children }: InlineCellEditModeProps) => ( +export const RecordInlineCellEditMode = ({ + children, +}: RecordInlineCellEditModeProps) => ( {children} diff --git a/front/src/pages/companies/CompanyShow.tsx b/front/src/pages/companies/CompanyShow.tsx index 5f1d12b92..ec02de3e9 100644 --- a/front/src/pages/companies/CompanyShow.tsx +++ b/front/src/pages/companies/CompanyShow.tsx @@ -17,7 +17,7 @@ import { ShowPageRightContainer } from '@/ui/layout/show-page/components/ShowPag import { ShowPageSummaryCard } from '@/ui/layout/show-page/components/ShowPageSummaryCard'; import { ShowPageRecoilScopeContext } from '@/ui/layout/states/ShowPageRecoilScopeContext'; import { FieldContext } from '@/ui/object/field/contexts/FieldContext'; -import { InlineCell } from '@/ui/object/record-inline-cell/components/InlineCell'; +import { RecordInlineCell } from '@/ui/object/record-inline-cell/components/RecordInlineCell'; import { PropertyBox } from '@/ui/object/record-inline-cell/property-box/components/PropertyBox'; import { InlineCellHotkeyScope } from '@/ui/object/record-inline-cell/types/InlineCellHotkeyScope'; import { PageTitle } from '@/ui/utilities/page-title/PageTitle'; @@ -102,7 +102,7 @@ export const CompanyShow = () => { hotkeyScope: InlineCellHotkeyScope.InlineCell, }} > - + ); })} diff --git a/front/src/pages/people/PersonShow.tsx b/front/src/pages/people/PersonShow.tsx index 140c9806c..16c1bbce9 100644 --- a/front/src/pages/people/PersonShow.tsx +++ b/front/src/pages/people/PersonShow.tsx @@ -18,7 +18,7 @@ import { ShowPageRightContainer } from '@/ui/layout/show-page/components/ShowPag import { ShowPageSummaryCard } from '@/ui/layout/show-page/components/ShowPageSummaryCard'; import { ShowPageRecoilScopeContext } from '@/ui/layout/states/ShowPageRecoilScopeContext'; import { FieldContext } from '@/ui/object/field/contexts/FieldContext'; -import { InlineCell } from '@/ui/object/record-inline-cell/components/InlineCell'; +import { RecordInlineCell } from '@/ui/object/record-inline-cell/components/RecordInlineCell'; import { PropertyBox } from '@/ui/object/record-inline-cell/property-box/components/PropertyBox'; import { InlineCellHotkeyScope } from '@/ui/object/record-inline-cell/types/InlineCellHotkeyScope'; import { PageTitle } from '@/ui/utilities/page-title/PageTitle'; @@ -128,7 +128,7 @@ export const PersonShow = () => { }} key={person.id + fieldDefinition.label} > - + ); })}