@malloy-publisher/sdk 0.0.80 → 0.0.81

package/package.json

@@ -1,7 +1,7 @@
 {
    "name": "@malloy-publisher/sdk",
    "description": "Malloy Publisher SDK",
-   "version": "0.0.80",
+   "version": "0.0.81",
    "type": "module",
    "main": "dist/index.cjs.js",
    "module": "dist/index.es.js",
@@ -49,7 +49,8 @@
       "@tanstack/react-query": "^5.59.16",
       "@uiw/react-md-editor": "^4.0.6",
       "axios": "^1.7.7",
-      "markdown-to-jsx": "^7.7.6"
+      "markdown-to-jsx": "^7.7.6",
+      "duckdb": "^1.3.1"
    },
    "devDependencies": {
       "@openapitools/openapi-generator-cli": "^2.20.2",

package/src/components/AnalyzePackageButton.tsx

@@ -1,30 +1,38 @@
 import { Add, Launch } from "@mui/icons-material";
 import {
+   Box,
    Button,
    Dialog,
    DialogContent,
    DialogTitle,
    FormControl,
+   InputLabel,
    ListItemIcon,
    ListItemText,
    Menu,
    MenuItem,
+   Select,
    Stack,
    TextField,
    Typography,
 } from "@mui/material";
 import React from "react";
 import { useRouterClickHandler } from "./click_helper";
-import {
-   BrowserNotebookStorage,
-   MutableNotebookList,
-   NotebookStorageProvider,
-} from "./MutableNotebook";
+import { WorkbookList } from "./Workbook";
+import { useWorkbookStorage } from "./Workbook/WorkbookStorageProvider";
+import type { WorkbookLocator, Workspace } from "./Workbook/WorkbookStorage";
 import { useParams } from "react-router-dom";
+import { PackageContextProps, PackageProvider } from "./Package";
 
 export function AnalyzePackageButton() {
-   const { projectName, packageName } = useParams();
+   const packageContext = useParams() as unknown as PackageContextProps;
+   const { packageName, projectName } = packageContext;
+   const { workbookStorage } = useWorkbookStorage();
    const [workbookName, setWorkbookName] = React.useState("");
+   const [selectedWorkspace, setSelectedWorkspace] = React.useState("");
+   const [availableWorkspaces, setAvailableWorkspaces] = React.useState<
+      Workspace[]
+   >([]);
    const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
    const [newDialogOpen, setNewDialogOpen] = React.useState(false);
    const [openDialogOpen, setOpenDialogOpen] = React.useState(false);
@@ -42,25 +50,52 @@ export function AnalyzePackageButton() {
    };
    const handleNewDialogClose = () => {
       setNewDialogOpen(false);
+      setWorkbookName("");
+      setSelectedWorkspace("");
    };
 
-   const handleNotebookClick = (notebook: string, event: React.MouseEvent) => {
+   // Fetch available workspaces when the new dialog opens
+   React.useEffect(() => {
+      if (newDialogOpen && workbookStorage && packageContext) {
+         workbookStorage
+            .listWorkspaces(packageContext, true) // Only show writeable workspaces
+            .then((workspaces) => {
+               setAvailableWorkspaces(workspaces);
+               // If only one workspace, select it by default
+               if (workspaces.length === 1) {
+                  setSelectedWorkspace(workspaces[0].name);
+               }
+            })
+            .catch((error) => {
+               console.error("Error fetching workspaces:", error);
+               setAvailableWorkspaces([]);
+            });
+      }
+   }, [newDialogOpen, workbookStorage, packageContext]);
+
+   const handleWorkbookClick = (
+      workbook: WorkbookLocator,
+      event: React.MouseEvent,
+   ) => {
       setOpenDialogOpen(false);
-      // Navigate to the ScratchNotebookPage with anchor text for notebookPath
+      // Navigate to the WorkbookPage with anchor text for notebookPath
       navigate(
-         `/${projectName}/${packageName}/scratchNotebook/${encodeURIComponent(notebook)}`,
+         `/${projectName}/${packageName}/workbook/${encodeURIComponent(workbook.workspace)}/${encodeURIComponent(workbook.path)}`,
          event,
       );
    };
 
-   const createNotebookClick = (event?: React.MouseEvent) => {
+   const createWorkbookClick = (event?: React.MouseEvent) => {
       setNewDialogOpen(false);
-      // Navigate to the ScratchNotebookPage with anchor text for notebookPath
+      // Include workspace in the workbook path if selected
+      const workbookPath = `${encodeURIComponent(selectedWorkspace)}/${encodeURIComponent(workbookName)}`;
+      // Navigate to the WorkbookPage with anchor text for notebookPath
       navigate(
-         `/${projectName}/${packageName}/scratchNotebook/${encodeURIComponent(workbookName)}`,
+         `/${projectName}/${packageName}/workbook/${workbookPath}`,
          event,
       );
       setWorkbookName("");
+      setSelectedWorkspace("");
    };
 
    if (!projectName || !packageName) {
@@ -143,7 +178,10 @@ export function AnalyzePackageButton() {
             fullWidth
          >
             <DialogTitle sx={{ pb: 1, pt: 2, px: 2 }}>
-               <Typography variant="h6" fontWeight={600} sx={{ mb: 0.5 }}>
+               <Typography
+                  fontWeight={600}
+                  sx={{ fontSize: "1.5rem", mb: 0.5 }}
+               >
                   Create New Workbook
                </Typography>
                <Typography variant="body2" color="text.secondary">
@@ -152,6 +190,61 @@ export function AnalyzePackageButton() {
             </DialogTitle>
             <DialogContent sx={{ px: 2, pb: 2 }}>
                <Stack spacing={2} sx={{ mt: 1 }}>
+                  {availableWorkspaces.length > 1 ? (
+                     <FormControl fullWidth size="small">
+                        <InputLabel>Workspace</InputLabel>
+                        <Select
+                           value={selectedWorkspace}
+                           label="Workspace"
+                           onChange={(e) =>
+                              setSelectedWorkspace(e.target.value)
+                           }
+                        >
+                           {availableWorkspaces.map((workspace) => (
+                              <MenuItem
+                                 key={workspace.name}
+                                 value={workspace.name}
+                              >
+                                 <Box>
+                                    <Typography
+                                       variant="body2"
+                                       fontWeight={500}
+                                    >
+                                       {workspace.name}
+                                    </Typography>
+                                    <Typography
+                                       variant="caption"
+                                       color="text.secondary"
+                                    >
+                                       {workspace.description}
+                                    </Typography>
+                                 </Box>
+                              </MenuItem>
+                           ))}
+                        </Select>
+                     </FormControl>
+                  ) : availableWorkspaces.length === 1 ? (
+                     <Box
+                        sx={{
+                           p: 2,
+                           border: 1,
+                           borderColor: "divider",
+                           borderRadius: 1,
+                           backgroundColor: "grey.50",
+                        }}
+                     >
+                        <Typography
+                           variant="body2"
+                           fontWeight={500}
+                           gutterBottom
+                        >
+                           Workspace: {availableWorkspaces[0].name}
+                        </Typography>
+                        <Typography variant="caption" color="text.secondary">
+                           {availableWorkspaces[0].description}
+                        </Typography>
+                     </Box>
+                  ) : null}
                   <FormControl fullWidth>
                      <TextField
                         label="Workbook Name"
@@ -172,9 +265,13 @@ export function AnalyzePackageButton() {
                         Cancel
                      </Button>
                      <Button
-                        onClick={(event) => createNotebookClick(event)}
+                        onClick={(event) => createWorkbookClick(event)}
                         variant="contained"
-                        disabled={!workbookName.trim()}
+                        disabled={
+                           !workbookName.trim() ||
+                           (availableWorkspaces.length > 1 &&
+                              !selectedWorkspace)
+                        }
                         size="small"
                      >
                         Create Workbook
@@ -192,7 +289,10 @@ export function AnalyzePackageButton() {
             fullWidth
          >
             <DialogTitle sx={{ pb: 1, pt: 2, px: 2 }}>
-               <Typography variant="h6" fontWeight={600} sx={{ mb: 0.5 }}>
+               <Typography
+                  fontWeight={600}
+                  sx={{ mb: 0.5, fontSize: "1.5rem" }}
+               >
                   Open Workbook
                </Typography>
                <Typography variant="body2" color="text.secondary">
@@ -200,15 +300,12 @@ export function AnalyzePackageButton() {
                </Typography>
             </DialogTitle>
             <DialogContent sx={{ px: 2, pb: 2 }}>
-               <NotebookStorageProvider
-                  notebookStorage={new BrowserNotebookStorage()}
-                  userContext={{
-                     project: projectName,
-                     package: packageName,
-                  }}
+               <PackageProvider
+                  projectName={projectName}
+                  packageName={packageName}
                >
-                  <MutableNotebookList onNotebookClick={handleNotebookClick} />
-               </NotebookStorageProvider>
+                  <WorkbookList onWorkbookClick={handleWorkbookClick} />
+               </PackageProvider>
             </DialogContent>
          </Dialog>
       </>

package/src/components/Model/Model.tsx

@@ -21,7 +21,10 @@ import { ApiErrorDisplay } from "../ApiErrorDisplay";
 
 import "@malloydata/malloy-explorer/styles.css";
 import { usePackage } from "../Package/PackageProvider";
-import { SourceExplorerComponent } from "./SourcesExplorer";
+import {
+   QueryExplorerResult,
+   SourceExplorerComponent,
+} from "./SourcesExplorer";
 import { Loading } from "../Loading";
 import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
@@ -34,6 +37,7 @@ interface ModelProps {
    hideResultIcons?: boolean;
    expandEmbeddings?: boolean;
    hideEmbeddingIcons?: boolean;
+   onChange?: (query: QueryExplorerResult) => void;
 }
 
 // Note: For this to properly render outside of publisher,
@@ -46,6 +50,7 @@ export default function Model({
    hideResultIcons,
    expandEmbeddings,
    hideEmbeddingIcons,
+   onChange,
 }: ModelProps) {
    const [embeddingExpanded, setEmbeddingExpanded] =
       React.useState<boolean>(false);
@@ -203,6 +208,7 @@ export default function Model({
                               data.sourceInfos[selectedTab],
                            ),
                         }}
+                        onChange={onChange}
                      />
                   )}
                {data.queries?.length > 0 && (

package/src/components/Package/index.ts

@@ -5,3 +5,4 @@ export {
    PackageProvider as PublisherPackageProvider,
    usePackage as usePublisherPackage,
 } from "./PackageProvider";
+export { default as Models } from "./Models";

package/src/components/Project/index.ts

@@ -1 +1,2 @@
 export { default as Project, ProjectProvider, useProject } from "./Project";
+export { default as Packages } from "./Packages";

package/src/components/Workbook/BrowserWorkbookStorage.ts

@@ -0,0 +1,100 @@
+import { PackageContextProps } from "../Package";
+import type {
+   WorkbookLocator,
+   WorkbookStorage,
+   Workspace,
+} from "./WorkbookStorage";
+
+const LOCAL_WORKSPACE_NAME = "Local";
+
+export class BrowserWorkbookStorage implements WorkbookStorage {
+   private makeKey(context: PackageContextProps, path?: string): string {
+      let key = `BROWSER_NOTEBOOK_STORAGE/${context.projectName}/${context.packageName}`;
+      if (path) {
+         key += `/${path}`;
+      }
+      return key;
+   }
+
+   async listWorkspaces(
+      context: PackageContextProps,
+      writeableOnly: boolean,
+   ): Promise<Workspace[]> {
+      // Parameters not used in browser storage implementation
+      void context;
+      void writeableOnly;
+      return [
+         {
+            name: LOCAL_WORKSPACE_NAME,
+            description: "Stored locally- only accessible to this browser",
+            writeable: true,
+         },
+      ];
+   }
+
+   async listWorkbooks(
+      workspace: Workspace,
+      context: PackageContextProps,
+   ): Promise<WorkbookLocator[]> {
+      const prefix = this.makeKey(context);
+      const keys: WorkbookLocator[] = [];
+      for (let i = 0; i < localStorage.length; i++) {
+         const key = localStorage.key(i);
+         if (key && key.startsWith(prefix + "/")) {
+            // Extract the notebook path after the prefix
+            const notebookPath = key.substring(prefix.length + 1);
+            keys.push({ path: notebookPath, workspace: LOCAL_WORKSPACE_NAME });
+         }
+      }
+      return keys;
+   }
+
+   async getWorkbook(
+      context: PackageContextProps,
+      path: WorkbookLocator,
+   ): Promise<string> {
+      const key = this.makeKey(context, path.path);
+      const notebook = localStorage.getItem(key);
+      if (notebook === null) {
+         throw new Error(`Notebook not found at path: ${path}`);
+      }
+      return notebook;
+   }
+
+   async deleteWorkbook(
+      context: PackageContextProps,
+      path: WorkbookLocator,
+   ): Promise<void> {
+      const key = this.makeKey(context, path.path);
+      if (localStorage.getItem(key) === null) {
+         throw new Error(`Notebook not found at path: ${path}`);
+      }
+      localStorage.removeItem(key);
+   }
+
+   async saveWorkbook(
+      context: PackageContextProps,
+      path: WorkbookLocator,
+      notebook: string,
+   ): Promise<void> {
+      console.log("saveWorkbook", context, path, notebook);
+      const key = this.makeKey(context, path.path);
+      console.log("saveWorkbook", key);
+      localStorage.setItem(key, notebook);
+   }
+
+   async moveWorkbook(
+      context: PackageContextProps,
+      from: WorkbookLocator,
+      to: WorkbookLocator,
+   ): Promise<void> {
+      const fromKey = this.makeKey(context, from.path);
+      const toKey = this.makeKey(context, to.path);
+      const notebook = localStorage.getItem(fromKey);
+      if (notebook === null) {
+         throw new Error(`Notebook not found at path: ${from.path}`);
+      }
+      localStorage.setItem(toKey, notebook);
+      localStorage.removeItem(fromKey);
+   }
+}

package/src/components/{MutableNotebook → Workbook}/EditableMalloyCell.tsx

@@ -1,9 +1,9 @@
 import { SourceAndPath, SourcesExplorer } from "../Model";
 import { QueryExplorerResult } from "../Model/SourcesExplorer";
-import { NotebookCellValue } from "../NotebookManager";
+import { WorkbookCellValue } from "./WorkbookManager";
 
 interface EditableMalloyCellProps {
-   cell: NotebookCellValue;
+   cell: WorkbookCellValue;
    sourceAndPaths: SourceAndPath[];
    onQueryChange: (query: QueryExplorerResult) => void;
    onSourceChange?: (index: number) => void;

package/src/components/{MutableNotebook → Workbook}/MutableCell.tsx

@@ -24,20 +24,20 @@ import {
    QueryExplorerResult,
    SourceAndPath,
 } from "../Model/SourcesExplorer";
-import { NotebookCellValue } from "../NotebookManager";
+import { WorkbookCellValue } from "./WorkbookManager";
 import ResultContainer from "../RenderedResult/ResultContainer";
 import { StyledCard } from "../styles";
 import { EditableMalloyCell } from "./EditableMalloyCell";
 
 interface NotebookCellProps {
-   cell: NotebookCellValue;
+   cell: WorkbookCellValue;
    expandCodeCell?: boolean;
    expandEmbedding?: boolean;
    hideEmbeddingIcons?: boolean;
    editingMalloy?: boolean;
    editingMarkdown?: boolean;
    sourceAndPaths: SourceAndPath[];
-   onCellChange: (cell: NotebookCellValue) => void;
+   onCellChange: (cell: WorkbookCellValue) => void;
    onClose: () => void;
    onEdit: () => void;
    onDelete: () => void;