diff --git a/frontend/layout/lib/TileLayout.stories.tsx b/frontend/layout/lib/TileLayout.stories.tsx
index 968596c2..96818a58 100644
--- a/frontend/layout/lib/TileLayout.stories.tsx
+++ b/frontend/layout/lib/TileLayout.stories.tsx
@@ -1,126 +1,132 @@
-// Copyright 2024, Command Line Inc.
-// SPDX-License-Identifier: Apache-2.0
+// // Copyright 2024, Command Line Inc.
+// // SPDX-License-Identifier: Apache-2.0
 
-import type { Meta, StoryObj } from "@storybook/react";
+// import type { Meta, StoryObj } from "@storybook/react";
 
-import { TileLayout } from "./TileLayout.jsx";
+// import { TileLayout } from "./TileLayout.jsx";
 
-import { useState } from "react";
-import { newLayoutTreeStateAtom, useLayoutTreeStateReducerAtom } from "./layoutAtom.js";
-import { newLayoutNode } from "./layoutNode.js";
-import "./tilelayout.stories.less";
-import { LayoutTreeActionType, LayoutTreeInsertNodeAction, WritableLayoutTreeStateAtom } from "./types.js";
+// import { atom } from "jotai";
+// import { useState } from "react";
+// import { newLayoutNode } from "./layoutNode.js";
+// import "./tilelayout.stories.less";
+// import {
+//     LayoutNode,
+//     LayoutTreeActionType,
+//     LayoutTreeInsertNodeAction,
+//     LayoutTreeState,
+//     NodeModel,
+//     WritableLayoutTreeStateAtom,
+// } from "./types.js";
 
-interface TestData {
-    name: string;
-}
+// const renderTestData = (data: string) => <div>{data}</div>;
 
-const renderTestData = (data: TestData) => <div>{data.name}</div>;
+// function newLayoutTreeStateAtom(node: LayoutNode): WritableLayoutTreeStateAtom {
+//     return atom({ rootNode: node } as LayoutTreeState);
+// }
 
-const meta = {
-    title: "TileLayout",
-    args: {
-        layoutTreeStateAtom: newLayoutTreeStateAtom<TestData>(
-            newLayoutNode(undefined, undefined, undefined, {
-                name: "Hello world!",
-            })
-        ),
-        contents: {
-            renderContent: (
-                data: TestData,
-                _ready: boolean,
-                _onClose: () => void,
-                dragHandleRef: React.RefObject<HTMLDivElement>
-            ) => (
-                <div ref={dragHandleRef} className="test-content" style={{ width: "100%", height: "100%" }}>
-                    {renderTestData(data)}
-                </div>
-            ),
-            renderPreview: renderTestData,
-            tabId: "",
-        },
-    },
-    component: TileLayout<TestData>,
-    // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
-    tags: ["autodocs"],
-} satisfies Meta<typeof TileLayout<TestData>>;
+// function renderContent(nodeModel: NodeModel) {
+//     return (
+//         <div ref={nodeModel.dragHandleRef} className="test-content" style={{ width: "100%", height: "100%" }}>
+//             {renderTestData(nodeModel.blockId)}
+//         </div>
+//     );
+// }
 
-export default meta;
-type Story = StoryObj<typeof meta>;
+// const meta = {
+//     title: "TileLayout",
+//     args: {
+//         layoutTreeStateAtom: newLayoutTreeStateAtom(
+//             newLayoutNode(undefined, undefined, undefined, {
+//                 blockId: "Hello world!",
+//             })
+//         ),
+//         contents: {
+//             renderContent,
+//             renderPreview: renderContent,
+//             tabId: "",
+//         },
+//     },
+//     component: TileLayout,
+//     // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/writing-docs/autodocs
+//     tags: ["autodocs"],
+// } satisfies Meta<typeof TileLayout>;
 
-export const Basic: Story = {
-    args: {
-        layoutTreeStateAtom: newLayoutTreeStateAtom<TestData>(
-            newLayoutNode(undefined, undefined, undefined, { name: "Hello world!" })
-        ),
-    },
-};
+// export default meta;
+// type Story = StoryObj<typeof meta>;
 
-export const More: Story = {
-    args: {
-        layoutTreeStateAtom: newLayoutTreeStateAtom<TestData>(
-            newLayoutNode(undefined, undefined, [
-                newLayoutNode(undefined, undefined, undefined, { name: "Hello world1!" }),
-                newLayoutNode(undefined, undefined, undefined, { name: "Hello world2!" }),
-                newLayoutNode(undefined, undefined, [
-                    newLayoutNode(undefined, undefined, undefined, { name: "Hello world3!" }),
-                    newLayoutNode(undefined, undefined, undefined, { name: "Hello world4!" }),
-                ]),
-            ])
-        ),
-    },
-};
+// export const Basic: Story = {
+//     args: {
+//         layoutTreeStateAtom: newLayoutTreeStateAtom(
+//             newLayoutNode(undefined, undefined, undefined, { blockId: "Hello world!" })
+//         ),
+//     },
+// };
 
-const evenMoreRootNode = newLayoutNode<TestData>(undefined, undefined, [
-    newLayoutNode(undefined, undefined, undefined, { name: "Hello world1!" }),
-    newLayoutNode(undefined, undefined, [
-        newLayoutNode(undefined, undefined, undefined, { name: "Hello world2!" }),
-        newLayoutNode(undefined, undefined, undefined, { name: "Hello world3!" }),
-    ]),
-    newLayoutNode(undefined, undefined, [
-        newLayoutNode(undefined, undefined, undefined, { name: "Hello world4!" }),
-        newLayoutNode(undefined, undefined, undefined, { name: "Hello world5!" }),
-        newLayoutNode(undefined, undefined, [
-            newLayoutNode(undefined, undefined, undefined, { name: "Hello world6!" }),
-            newLayoutNode(undefined, undefined, undefined, { name: "Hello world7!" }),
-            newLayoutNode(undefined, undefined, undefined, { name: "Hello world8!" }),
-        ]),
-    ]),
-]);
+// export const More: Story = {
+//     args: {
+//         layoutTreeStateAtom: newLayoutTreeStateAtom<TestData>(
+//             newLayoutNode(undefined, undefined, [
+//                 newLayoutNode(undefined, undefined, undefined, { name: "Hello world1!" }),
+//                 newLayoutNode(undefined, undefined, undefined, { name: "Hello world2!" }),
+//                 newLayoutNode(undefined, undefined, [
+//                     newLayoutNode(undefined, undefined, undefined, { name: "Hello world3!" }),
+//                     newLayoutNode(undefined, undefined, undefined, { name: "Hello world4!" }),
+//                 ]),
+//             ])
+//         ),
+//     },
+// };
 
-export const EvenMore: Story = {
-    args: {
-        layoutTreeStateAtom: newLayoutTreeStateAtom<TestData>(evenMoreRootNode),
-    },
-};
+// const evenMoreRootNode = newLayoutNode<TestData>(undefined, undefined, [
+//     newLayoutNode(undefined, undefined, undefined, { name: "Hello world1!" }),
+//     newLayoutNode(undefined, undefined, [
+//         newLayoutNode(undefined, undefined, undefined, { name: "Hello world2!" }),
+//         newLayoutNode(undefined, undefined, undefined, { name: "Hello world3!" }),
+//     ]),
+//     newLayoutNode(undefined, undefined, [
+//         newLayoutNode(undefined, undefined, undefined, { name: "Hello world4!" }),
+//         newLayoutNode(undefined, undefined, undefined, { name: "Hello world5!" }),
+//         newLayoutNode(undefined, undefined, [
+//             newLayoutNode(undefined, undefined, undefined, { name: "Hello world6!" }),
+//             newLayoutNode(undefined, undefined, undefined, { name: "Hello world7!" }),
+//             newLayoutNode(undefined, undefined, undefined, { name: "Hello world8!" }),
+//         ]),
+//     ]),
+// ]);
 
-const addNodeAtom = newLayoutTreeStateAtom(evenMoreRootNode);
+// export const EvenMore: Story = {
+//     args: {
+//         layoutTreeStateAtom: newLayoutTreeStateAtom<TestData>(evenMoreRootNode),
+//     },
+// };
 
-export const AddNode: Story = {
-    render: () => {
-        const [, dispatch] = useLayoutTreeStateReducerAtom(addNodeAtom);
-        const [numAddedNodes, setNumAddedNodes] = useState(0);
-        const dispatchAddNode = () => {
-            const newNode = newLayoutNode(undefined, undefined, undefined, {
-                name: "New Node" + numAddedNodes,
-            });
-            const insertNodeAction: LayoutTreeInsertNodeAction<TestData> = {
-                type: LayoutTreeActionType.InsertNode,
-                node: newNode,
-            };
-            dispatch(insertNodeAction);
-            setNumAddedNodes(numAddedNodes + 1);
-        };
-        return (
-            <div style={{ display: "flex", flexDirection: "column", width: "100%", height: "100%" }}>
-                <div>
-                    <button onClick={dispatchAddNode}>Add node</button>
-                </div>
-                <TileLayout
-                    layoutTreeStateAtom={addNodeAtom as WritableLayoutTreeStateAtom<TestData>}
-                    contents={meta.args.contents}
-                />
-            </div>
-        );
-    },
-};
+// const addNodeAtom = newLayoutTreeStateAtom(evenMoreRootNode);
+
+// export const AddNode: Story = {
+//     render: () => {
+//         const [, dispatch] = useLayoutTreeStateReducerAtom(addNodeAtom);
+//         const [numAddedNodes, setNumAddedNodes] = useState(0);
+//         const dispatchAddNode = () => {
+//             const newNode = newLayoutNode(undefined, undefined, undefined, {
+//                 name: "New Node" + numAddedNodes,
+//             });
+//             const insertNodeAction: LayoutTreeInsertNodeAction<TestData> = {
+//                 type: LayoutTreeActionType.InsertNode,
+//                 node: newNode,
+//             };
+//             dispatch(insertNodeAction);
+//             setNumAddedNodes(numAddedNodes + 1);
+//         };
+//         return (
+//             <div style={{ display: "flex", flexDirection: "column", width: "100%", height: "100%" }}>
+//                 <div>
+//                     <button onClick={dispatchAddNode}>Add node</button>
+//                 </div>
+//                 <TileLayout
+//                     layoutTreeStateAtom={addNodeAtom as WritableLayoutTreeStateAtom<TestData>}
+//                     contents={meta.args.contents}
+//                 />
+//             </div>
+//         );
+//     },
+// };