diff --git a/vuu-ui/packages/vuu-layout/src/layout-provider/LayoutProvider.tsx b/vuu-ui/packages/vuu-layout/src/layout-provider/LayoutProvider.tsx index f83a49d46..2742a0fd6 100644 --- a/vuu-ui/packages/vuu-layout/src/layout-provider/LayoutProvider.tsx +++ b/vuu-ui/packages/vuu-layout/src/layout-provider/LayoutProvider.tsx @@ -231,16 +231,10 @@ export const useLayoutCreateNewChild = () => { () => function createNewChild() { if (layoutPlaceholderJSON) { - const placeholder = (layoutPlaceholderJSON as unknown as LayoutJSON) - .props - ? (layoutPlaceholderJSON as unknown as LayoutJSON) - : (layoutPlaceholderJSON as unknown as LayoutJSON[])[ - (layoutPlaceholderJSON as unknown as LayoutJSON[]).length - 1 - ]; - const { props } = placeholder; + const { props } = layoutPlaceholderJSON; return layoutFromJson( { - ...placeholder, + ...layoutPlaceholderJSON, props: { ...props, resizeable: true, diff --git a/vuu-ui/packages/vuu-shell/src/workspace-management/WorkspaceProvider.tsx b/vuu-ui/packages/vuu-shell/src/workspace-management/WorkspaceProvider.tsx index 191345bd8..ef1bd94be 100644 --- a/vuu-ui/packages/vuu-shell/src/workspace-management/WorkspaceProvider.tsx +++ b/vuu-ui/packages/vuu-shell/src/workspace-management/WorkspaceProvider.tsx @@ -22,7 +22,7 @@ import { const { info } = logger("useLayoutManager"); export type WorkspaceProps = WorkspaceStackProps & { - layoutPlaceholderJSON?: LayoutJSON | LayoutJSON[]; + layoutPlaceholderJSON?: LayoutJSON; /** * layoutJSON defines the default layout to render on first load and until such time as * layout state has been persisted. After that, the persisted state will be rendered. @@ -42,7 +42,7 @@ export interface WorkspaceProviderProps extends WorkspaceProps { /** * layoutPlaceholderJSON defines the layout to render when a new workspace layout is created. */ - layoutPlaceholderJSON?: LayoutJSON | LayoutJSON[]; + layoutPlaceholderJSON?: LayoutJSON; } const ensureLayoutHasTitle = ( diff --git a/vuu-ui/packages/vuu-shell/src/workspace-management/defaultWorkspaceJSON.ts b/vuu-ui/packages/vuu-shell/src/workspace-management/defaultWorkspaceJSON.ts index 75780c942..be7637a58 100644 --- a/vuu-ui/packages/vuu-shell/src/workspace-management/defaultWorkspaceJSON.ts +++ b/vuu-ui/packages/vuu-shell/src/workspace-management/defaultWorkspaceJSON.ts @@ -33,26 +33,24 @@ export const getStackWorkspaceJSON = ( StackProps & { preserve: boolean; } -> => { - return { - type: "Stack", - id: VuuShellLocation.Workspace, - props: { - className: `${VuuShellLocation.Workspace}-tabs`, - TabstripProps: { - allowAddTab: true, - allowCloseTab: true, - allowRenameTab: true, - animateSelectionThumb: false, - "aria-label": "Workspace Tabs", - location: "workspace-tab", - variant: "primary", - }, - preserve: true, - active: activeLayoutIndex ?? 0, +> => ({ + type: "Stack", + id: VuuShellLocation.Workspace, + props: { + className: `${VuuShellLocation.Workspace}-tabs`, + TabstripProps: { + allowAddTab: true, + allowCloseTab: true, + allowRenameTab: true, + animateSelectionThumb: false, + "aria-label": "Workspace Tabs", + location: "workspace-tab", + variant: "primary", }, - }; -}; + preserve: true, + active: activeLayoutIndex ?? 0, + }, +}); const placeholderLayout: LayoutJSON = { props: { diff --git a/vuu-ui/packages/vuu-utils/src/context-definitions/WorkspaceContext.tsx b/vuu-ui/packages/vuu-utils/src/context-definitions/WorkspaceContext.tsx index 63a053f22..bbc114f3f 100644 --- a/vuu-ui/packages/vuu-utils/src/context-definitions/WorkspaceContext.tsx +++ b/vuu-ui/packages/vuu-utils/src/context-definitions/WorkspaceContext.tsx @@ -8,7 +8,7 @@ import { LayoutMetadata, LayoutMetadataDto } from "../layout-types"; export interface WorkspaceContextProps { layoutMetadata: LayoutMetadata[]; - layoutPlaceholderJSON?: LayoutJSON | LayoutJSON[]; + layoutPlaceholderJSON?: LayoutJSON; getApplicationSettings: ( key?: keyof ApplicationSettings ) => ApplicationSettings | ApplicationSetting | undefined; diff --git a/vuu-ui/showcase/src/examples/Shell/ShellLayout.examples.tsx b/vuu-ui/showcase/src/examples/Shell/ShellLayout.examples.tsx index f681bbc1d..946f2a609 100644 --- a/vuu-ui/showcase/src/examples/Shell/ShellLayout.examples.tsx +++ b/vuu-ui/showcase/src/examples/Shell/ShellLayout.examples.tsx @@ -210,7 +210,16 @@ export const SimpleShellMultiLayouts = () => { const persistNothing = useMemo(() => new StaticPersistenceManager({}), []); const workspaceProps = useMemo(() => { - const placeHolder = [ + const placeHolder = { + type: "Placeholder", + props: { + "data-testid": "custom-placeholder", + style: { + background: "yellow", + }, + }, + }; + const layouts = [ { type: "Placeholder", props: { @@ -240,7 +249,7 @@ export const SimpleShellMultiLayouts = () => { }, ]; return { - layoutJSON: placeHolder, + layoutJSON: layouts, layoutPlaceholderJSON: placeHolder, activeLayoutIndex: 1, };