✨ feat(form-select): use character length to trigger select button

dashpresshq · Dec 28, 2023 · ddd6425 · ddd6425
1 parent b310667
commit ddd6425
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 13 deletions.
diff --git a/src/frontend/components/SchemaForm/_RenderFormInput.tsx b/src/frontend/components/SchemaForm/_RenderFormInput.tsx
@@ -38,7 +38,11 @@ export function RenderFormInput(props: IRenderFormInputProps) {
   };
 
   if (entityFieldSelections.length > 0) {
-    if (entityFieldSelections.length > 1 && entityFieldSelections.length <= 4) {
+    if (
+      entityFieldSelections.reduce((acc, selection) => {
+        return acc + selection.label.length;
+      }, 0) < 15
+    ) {
       return (
         <FormSelectButton {...formProps} selectData={entityFieldSelections} />
       );

diff --git a/src/frontend/design-system/components/Table/Stories.tsx b/src/frontend/design-system/components/Table/Stories.tsx
@@ -5,7 +5,7 @@ import { action } from "@storybook/addon-actions";
 import { IPaginatedDataState } from "shared/types/data";
 import { ApplicationRoot } from "frontend/components/ApplicationRoot";
 import { Table, DEFAULT_TABLE_STATE } from ".";
-import { IProps } from "./types";
+import { ITableProps } from "./types";
 import { TABLE_COLUMNS, TABLE_DATA } from "./data";
 
 export default {
@@ -29,10 +29,10 @@ export default {
     syncPaginatedDataStateOut: action("setPaginatedDataState"),
     columns: TABLE_COLUMNS,
     tableData: TABLE_DATA,
-  } as IProps<unknown>,
+  } as ITableProps<unknown>,
 };
 
-const Template: Story<IProps<unknown>> = (args) => {
+const Template: Story<ITableProps<unknown>> = (args) => {
   const [paginatedDataState, setPaginatedDataState] = useState<
     IPaginatedDataState<any>
   >({ ...DEFAULT_TABLE_STATE });

diff --git a/src/frontend/views/data/Details/RelationsDetails.tsx b/src/frontend/views/data/Details/RelationsDetails.tsx
@@ -92,11 +92,7 @@ export function EntityRelationDetails() {
   });
 
   return (
-    <DetailsLayout
-      entity={parentEntity}
-      menuKey={childEntity}
-      childEntity={childEntity}
-    >
+    <DetailsLayout entity={parentEntity} menuKey={childEntity}>
       {dataDetails.error ? (
         <SectionBox
           title={title}

diff --git a/src/frontend/views/data/Details/RelationsTable.tsx b/src/frontend/views/data/Details/RelationsTable.tsx
@@ -49,7 +49,6 @@ export function EntityRelationTable() {
   return (
     <DetailsLayout
       entity={parentEntity}
-      childEntity={childEntity}
       menuKey={childEntity}
       menuItems={menuItems}
     >

diff --git a/src/frontend/views/data/Details/_Layout.tsx b/src/frontend/views/data/Details/_Layout.tsx
@@ -30,13 +30,11 @@ interface IProps {
   entity: string;
   menuItems?: IDropDownMenuItem[];
   menuKey: string;
-  childEntity?: string;
 }
 
 export function DetailsLayout({
   children,
   entity,
-  childEntity,
   menuKey,
   menuItems = [],
 }: IProps) {
@@ -46,7 +44,7 @@ export function DetailsLayout({
       EntityActionTypes.Form,
       EntityActionTypes.Labels,
     ],
-    childEntity
+    entity
   );
   const entityId = useEntityId();