Merge pull request #70 from biggraph/darabos-lint

.gitignore

@@ -1,5 +1,6 @@
 .vscode/*
 !.vscode/extensions.json
+!.vscode/settings.json
 .idea
 .DS_Store
 *.suo
@@ -14,4 +15,4 @@ build
 joblib-cache
 *.egg-info
 
-lynxkite-app/crdt_data
+lynxkite-app/crdt_data

.pre-commit-config.yaml

@@ -0,0 +1,17 @@
+repos:
+- repo: https://github.com/pre-commit/pre-commit-hooks
+  rev: v4.5.0
+  hooks:
+    - id: trailing-whitespace
+    - id: end-of-file-fixer
+    - id: check-yaml
+- repo: https://github.com/astral-sh/ruff-pre-commit
+  rev: v0.9.6
+  hooks:
+    - id: ruff
+      args: [ --fix ]
+    - id: ruff-format
+- repo: https://github.com/biomejs/pre-commit
+  rev: v1.9.4
+  hooks:
+    - id: biome-check

.python-version

@@ -0,0 +1 @@
+3.11

.vscode/settings.json

@@ -0,0 +1,15 @@
+{
+  "editor.formatOnSave": true,
+  "ruff.enable": true,
+  "html.format.enable": true,
+  "css.format.enable": true,
+  "typescript.format.enable": true,
+  "files.insertFinalNewline": true,
+  "files.trimTrailingWhitespace": true,
+  "[python]": {
+    "editor.defaultFormatter": "charliermarsh.ruff"
+  },
+  "[javascript]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  }
+}

README.md

@@ -23,6 +23,7 @@ Install everything like this:
 ```bash
 uv venv
 source .venv/bin/activate
+uvx pre-commit install
 # The [dev] tag is only needed if you intend on running tests
 uv pip install -e lynxkite-core/[dev] -e lynxkite-app/[dev] -e lynxkite-graph-analytics/[dev] -e lynxkite-lynxscribe/ -e lynxkite-pillow-example/
 ```

biome.json

@@ -0,0 +1,24 @@
+{
+  "formatter": {
+    "ignore": ["**/node_modules/**", "**/dist/**"],
+    "indentStyle": "space"
+  },
+  "linter": {
+    "ignore": ["**/node_modules/**", "**/dist/**"],
+    "rules": {
+      "suspicious": {
+        "noExplicitAny": "off",
+        "noArrayIndexKey": "off"
+      },
+      "style": {
+        "noNonNullAssertion": "off"
+      },
+      "a11y": {
+        "useKeyWithClickEvents": "off",
+        "useValidAnchor": "off",
+        "useButtonType": "off",
+        "noNoninteractiveTabindex": "off"
+      }
+    }
+  }
+}

lynxkite-app/README.md

@@ -23,3 +23,9 @@ cd web
 npm i
 npm run dev
 ```
+
+To update the frontend types with the backend types:
+
+```bash
+$ uv run pydantic2ts --module lynxkite_app.main --output ./web/src/apiTypes.ts --json2ts-cmd "npx json-schema-to-typescript"
+```

lynxkite-app/pyproject.toml

@@ -9,12 +9,12 @@ dependencies = [
     "lynxkite-core",
     "orjson>=3.10.13",
     "pycrdt-websocket>=0.15.3",
-    "pydantic-to-typescript>=2.0.0",
     "sse-starlette>=2.2.1",
 ]
 
 [project.optional-dependencies]
 dev = [
+    "pydantic-to-typescript>=2.0.0",
     "pytest>=8.3.4",
 ]
 

lynxkite-app/src/lynxkite_app/main.py

@@ -2,12 +2,7 @@
 
 import os
 import shutil
-
-if os.environ.get("NX_CUGRAPH_AUTOCONFIG", "").strip().lower() == "true":
-    import cudf.pandas
-
-    cudf.pandas.install()
-import dataclasses
+import pydantic
 import fastapi
 import importlib
 import pathlib
@@ -18,6 +13,11 @@ from lynxkite.core import ops
 from lynxkite.core import workspace
 from . import crdt, config
 
+if os.environ.get("NX_CUGRAPH_AUTOCONFIG", "").strip().lower() == "true":
+    import cudf.pandas
+
+    cudf.pandas.install()
+
 
 def detect_plugins():
     plugins = {}
@@ -82,8 +82,7 @@ def load(path: str):
     return workspace.load(path)
 
 
-@dataclasses.dataclass(order=True)
-class DirectoryEntry:
+class DirectoryEntry(pydantic.BaseModel):
     name: str
     type: str
 
@@ -95,11 +94,12 @@ def list_dir(path: str):
     return sorted(
         [
             DirectoryEntry(
-                p.relative_to(config.DATA_PATH),
-                "directory" if p.is_dir() else "workspace",
+                name=str(p.relative_to(config.DATA_PATH)),
+                type="directory" if p.is_dir() else "workspace",
             )
             for p in path.iterdir()
-        ]
+        ],
+        key=lambda x: x.name,
     )
 
 

lynxkite-app/uv.lock

@@ -194,6 +194,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/76/c6/c88e154df9c4e1a2a66ccf0005a88dfb2650c1dffb6f5ce603dfbd452ce3/idna-3.10-py3-none-any.whl", hash = "sha256:946d195a0d259cbba61165e88e65941f16e9b36ea6ddb97f00452bae8b1287d3", size = 70442 },
 ]
 
+[[package]]
+name = "iniconfig"
+version = "2.0.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/d7/4b/cbd8e699e64a6f16ca3a8220661b5f83792b3017d0f79807cb8708d33913/iniconfig-2.0.0.tar.gz", hash = "sha256:2d91e135bf72d31a410b17c16da610a82cb55f6b0477d1a902134b24a455b8b3", size = 4646 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/ef/a6/62565a6e1cf69e10f5727360368e451d4b7f58beeac6173dc9db836a5b46/iniconfig-2.0.0-py3-none-any.whl", hash = "sha256:b6a85871a79d2e3b22d2d1b94ac2824226a63c6b741c88f7ae975f18b6778374", size = 5892 },
+]
+
 [[package]]
 name = "jinja2"
 version = "3.1.5"
@@ -215,17 +224,23 @@ dependencies = [
     { name = "lynxkite-core" },
     { name = "orjson" },
     { name = "pycrdt-websocket" },
-    { name = "pydantic-to-typescript" },
     { name = "sse-starlette" },
 ]
 
+[package.optional-dependencies]
+dev = [
+    { name = "pydantic-to-typescript" },
+    { name = "pytest" },
+]
+
 [package.metadata]
 requires-dist = [
     { name = "fastapi", extras = ["standard"], specifier = ">=0.115.6" },
     { name = "lynxkite-core", virtual = "../lynxkite-core" },
     { name = "orjson", specifier = ">=3.10.13" },
     { name = "pycrdt-websocket", specifier = ">=0.15.3" },
-    { name = "pydantic-to-typescript", specifier = ">=2.0.0" },
+    { name = "pydantic-to-typescript", marker = "extra == 'dev'", specifier = ">=2.0.0" },
+    { name = "pytest", marker = "extra == 'dev'", specifier = ">=8.3.4" },
     { name = "sse-starlette", specifier = ">=2.2.1" },
 ]
 
@@ -234,6 +249,9 @@ name = "lynxkite-core"
 version = "0.1.0"
 source = { virtual = "../lynxkite-core" }
 
+[package.metadata]
+requires-dist = [{ name = "pytest", marker = "extra == 'dev'" }]
+
 [[package]]
 name = "markdown-it-py"
 version = "3.0.0"
@@ -346,6 +364,24 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/59/ac/5e96cad01083015f7bfdb02ccafa489da8e6caa7f4c519e215f04d2bd856/orjson-3.10.14-cp313-cp313-win_amd64.whl", hash = "sha256:eca04dfd792cedad53dc9a917da1a522486255360cb4e77619343a20d9f35364", size = 133388 },
 ]
 
+[[package]]
+name = "packaging"
+version = "24.2"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/d0/63/68dbb6eb2de9cb10ee4c9c14a0148804425e13c4fb20d61cce69f53106da/packaging-24.2.tar.gz", hash = "sha256:c228a6dc5e932d346bc5739379109d49e8853dd8223571c7c5b55260edc0b97f", size = 163950 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/88/ef/eb23f262cca3c0c4eb7ab1933c3b1f03d021f2c48f54763065b6f0e321be/packaging-24.2-py3-none-any.whl", hash = "sha256:09abb1bccd265c01f4a3aa3f7a7db064b36514d2cba19a2f694fe6150451a759", size = 65451 },
+]
+
+[[package]]
+name = "pluggy"
+version = "1.5.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/96/2d/02d4312c973c6050a18b314a5ad0b3210edb65a906f868e31c111dede4a6/pluggy-1.5.0.tar.gz", hash = "sha256:2cffa88e94fdc978c4c574f15f9e59b7f4201d439195c3715ca9e2486f1d0cf1", size = 67955 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/88/5f/e351af9a41f866ac3f1fac4ca0613908d9a41741cfcf2228f4ad853b697d/pluggy-1.5.0-py3-none-any.whl", hash = "sha256:44e1ad92c8ca002de6377e165f3e0f1be63266ab4d554740532335b9d75ea669", size = 20556 },
+]
+
 [[package]]
 name = "pycrdt"
 version = "0.10.9"
@@ -486,6 +522,21 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/8a/0b/9fcc47d19c48b59121088dd6da2488a49d5f72dacf8262e2790a1d2c7d15/pygments-2.19.1-py3-none-any.whl", hash = "sha256:9ea1544ad55cecf4b8242fab6dd35a93bbce657034b0611ee383099054ab6d8c", size = 1225293 },
 ]
 
+[[package]]
+name = "pytest"
+version = "8.3.4"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "colorama", marker = "sys_platform == 'win32'" },
+    { name = "iniconfig" },
+    { name = "packaging" },
+    { name = "pluggy" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/05/35/30e0d83068951d90a01852cb1cef56e5d8a09d20c7f511634cc2f7e0372a/pytest-8.3.4.tar.gz", hash = "sha256:965370d062bce11e73868e0335abac31b4d3de0e82f4007408d242b4f8610761", size = 1445919 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/11/92/76a1c94d3afee238333bc0a42b82935dd8f9cf8ce9e336ff87ee14d9e1cf/pytest-8.3.4-py3-none-any.whl", hash = "sha256:50e16d954148559c9a74109af1eaf0c945ba2d8f30f0a3d3335edde19788b6f6", size = 343083 },
+]
+
 [[package]]
 name = "python-dotenv"
 version = "1.0.1"

lynxkite-app/web/eslint.config.js

@@ -1,28 +1,28 @@
-import js from '@eslint/js'
-import globals from 'globals'
-import reactHooks from 'eslint-plugin-react-hooks'
-import reactRefresh from 'eslint-plugin-react-refresh'
-import tseslint from 'typescript-eslint'
+import js from "@eslint/js";
+import reactHooks from "eslint-plugin-react-hooks";
+import reactRefresh from "eslint-plugin-react-refresh";
+import globals from "globals";
+import tseslint from "typescript-eslint";
 
 export default tseslint.config(
-  { ignores: ['dist'] },
+  { ignores: ["dist"] },
   {
     extends: [js.configs.recommended, ...tseslint.configs.recommended],
-    files: ['**/*.{ts,tsx}'],
+    files: ["**/*.{ts,tsx}"],
     languageOptions: {
       ecmaVersion: 2020,
       globals: globals.browser,
     },
     plugins: {
-      'react-hooks': reactHooks,
-      'react-refresh': reactRefresh,
+      "react-hooks": reactHooks,
+      "react-refresh": reactRefresh,
     },
     rules: {
       ...reactHooks.configs.recommended.rules,
-      'react-refresh/only-export-components': [
-        'warn',
+      "react-refresh/only-export-components": [
+        "warn",
         { allowConstantExport: true },
       ],
     },
   },
-)
+);

lynxkite-app/web/playwright.config.ts

@@ -1,31 +1,30 @@
-import { defineConfig, devices } from '@playwright/test';
-
+import { defineConfig, devices } from "@playwright/test";
 
 export default defineConfig({
-  testDir: './tests',
+  testDir: "./tests",
   timeout: 30000,
   fullyParallel: false,
   /* Fail the build on CI if you accidentally left test.only in the source code. */
   forbidOnly: !!process.env.CI,
   retries: process.env.CI ? 1 : 0,
   workers: 1,
-  reporter: process.env.CI ? [['github'], ['html']] : 'html',
+  reporter: process.env.CI ? [["github"], ["html"]] : "html",
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
-    baseURL: 'http://127.0.0.1:8000',
+    baseURL: "http://127.0.0.1:8000",
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: 'on-first-retry',
-    testIdAttribute: 'data-nodeid' // Useful for easily selecting nodes using getByTestId
+    trace: "on-first-retry",
+    testIdAttribute: "data-nodeid", // Useful for easily selecting nodes using getByTestId
   },
   projects: [
     {
-      name: 'chromium',
-      use: { ...devices['Desktop Chrome'] },
+      name: "chromium",
+      use: { ...devices["Desktop Chrome"] },
     },
   ],
   webServer: {
-    command: 'cd ../.. && LYNXKITE_DATA=examples lynxkite',
-    url: 'http://127.0.0.1:8000',
+    command: "cd ../.. && LYNXKITE_DATA=examples lynxkite",
+    url: "http://127.0.0.1:8000",
     reuseExistingServer: false,
   },
 });

lynxkite-app/web/postcss.config.js

@@ -3,4 +3,4 @@ export default {
     tailwindcss: {},
     autoprefixer: {},
   },
-}
+};

lynxkite-app/web/src/Directory.tsx

@@ -1,73 +1,76 @@
-// The directory browser.
-import { useParams, useNavigate } from "react-router";
 import { useState } from "react";
-import useSWR from 'swr'
-
+// The directory browser.
+import { useNavigate, useParams } from "react-router";
+import useSWR from "swr";
+import type { DirectoryEntry } from "./apiTypes.ts";
 
-import logo from './assets/logo.png';
 // @ts-ignore
-import Home from '~icons/tabler/home'
+import File from "~icons/tabler/file";
 // @ts-ignore
-import Folder from '~icons/tabler/folder'
+import FilePlus from "~icons/tabler/file-plus";
 // @ts-ignore
-import FolderPlus from '~icons/tabler/folder-plus'
+import Folder from "~icons/tabler/folder";
 // @ts-ignore
-import File from '~icons/tabler/file'
+import FolderPlus from "~icons/tabler/folder-plus";
 // @ts-ignore
-import FilePlus from '~icons/tabler/file-plus'
+import Home from "~icons/tabler/home";
 // @ts-ignore
-import Trash from '~icons/tabler/trash';
-
-
+import Trash from "~icons/tabler/trash";
+import logo from "./assets/logo.png";
 
 const fetcher = (url: string) => fetch(url).then((res) => res.json());
 
 export default function () {
   const { path } = useParams();
-  const encodedPath = encodeURIComponent(path || '');
+  const encodedPath = encodeURIComponent(path || "");
   const list = useSWR(`/api/dir/list?path=${encodedPath}`, fetcher);
   const navigate = useNavigate();
   const [isCreatingDir, setIsCreatingDir] = useState(false);
   const [isCreatingWorkspace, setIsCreatingWorkspace] = useState(false);
 
-
-  function link(item: any) {
-    if (item.type === 'directory') {
+  function link(item: DirectoryEntry) {
+    if (item.type === "directory") {
       return `/dir/${item.name}`;
-    } else {
-      return `/edit/${item.name}`;
     }
+    return `/edit/${item.name}`;
   }
 
-  function shortName(item: any) {
-    return item.name.split('/').pop();
+  function shortName(item: DirectoryEntry) {
+    return item.name.split("/").pop();
   }
 
-  function newName(list: any[], baseName: string = "Untitled") {
+  function newName(list: DirectoryEntry[], baseName = "Untitled") {
     let i = 0;
     while (true) {
-      const name = `${baseName}${i ? ` ${i}` : ''}`;
-      if (!list.find(item => item.name === name)) {
+      const name = `${baseName}${i ? ` ${i}` : ""}`;
+      if (!list.find((item) => item.name === name)) {
         return name;
       }
       i++;
     }
   }
 
-  function newWorkspaceIn(path: string, list: any[], workspaceName?: string) {
+  function newWorkspaceIn(
+    path: string,
+    list: DirectoryEntry[],
+    workspaceName?: string,
+  ) {
     const pathSlash = path ? `${path}/` : "";
     const name = workspaceName || newName(list);
     navigate(`/edit/${pathSlash}${name}`, { replace: true });
   }
 
-
-  async function newFolderIn(path: string, list: any[], folderName?: string) {
+  async function newFolderIn(
+    path: string,
+    list: DirectoryEntry[],
+    folderName?: string,
+  ) {
     const name = folderName || newName(list, "New Folder");
     const pathSlash = path ? `${path}/` : "";
 
-    const res = await fetch(`/api/dir/mkdir`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
+    const res = await fetch("/api/dir/mkdir", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
       body: JSON.stringify({ path: pathSlash + name }),
     });
     if (res.ok) {
@@ -77,11 +80,13 @@ export default function () {
     }
   }
 
-  async function deleteItem(item: any) {
-    if (!window.confirm(`Are you sure you want to delete "${item.name}"?`)) return;
+  async function deleteItem(item: DirectoryEntry) {
+    if (!window.confirm(`Are you sure you want to delete "${item.name}"?`))
+      return;
     const pathSlash = path ? `${path}/` : "";
 
-    const apiPath = item.type === "directory" ? `/api/dir/delete` : `/api/delete`;
+    const apiPath =
+      item.type === "directory" ? "/api/dir/delete" : "/api/delete";
     await fetch(apiPath, {
       method: "POST",
       headers: { "Content-Type": "application/json" },
@@ -97,22 +102,32 @@ export default function () {
         </a>
         <div className="tagline">The Complete Graph Data Science Platform</div>
       </div>
-
       <div className="entry-list">
         {list.error && <p className="error">{list.error.message}</p>}
         {list.isLoading && (
-          <div className="loading spinner-border" role="status">
+          <output className="loading spinner-border">
             <span className="visually-hidden">Loading...</span>
-          </div>
+          </output>
         )}
 
         {list.data && (
           <>
             <div className="actions">
               <div className="new-workspace">
-                {isCreatingWorkspace &&
+                {isCreatingWorkspace && (
                   // @ts-ignore
-                  <form onSubmit={(e) => { e.preventDefault(); newWorkspaceIn(path || "", list.data, e.target.workspaceName.value.trim()) }}>
+                  <form
+                    onSubmit={(e) => {
+                      e.preventDefault();
+                      newWorkspaceIn(
+                        path || "",
+                        list.data,
+                        (
+                          e.target as HTMLFormElement
+                        ).workspaceName.value.trim(),
+                      );
+                    }}
+                  >
                     <input
                       type="text"
                       name="workspaceName"
@@ -120,16 +135,28 @@ export default function () {
                       placeholder={newName(list.data)}
                     />
                   </form>
-                }
-                <button type="button" onClick={() => setIsCreatingWorkspace(true)}>
+                )}
+                <button
+                  type="button"
+                  onClick={() => setIsCreatingWorkspace(true)}
+                >
                   <FolderPlus /> New workspace
                 </button>
               </div>
 
               <div className="new-folder">
-                {isCreatingDir &&
+                {isCreatingDir && (
                   // @ts-ignore
-                  <form onSubmit={(e) => { e.preventDefault(); newFolderIn(path || "", list.data, e.target.folderName.value.trim()) }}>
+                  <form
+                    onSubmit={(e) => {
+                      e.preventDefault();
+                      newFolderIn(
+                        path || "",
+                        list.data,
+                        (e.target as HTMLFormElement).folderName.value.trim(),
+                      );
+                    }}
+                  >
                     <input
                       type="text"
                       name="folderName"
@@ -137,7 +164,7 @@ export default function () {
                       placeholder={newName(list.data)}
                     />
                   </form>
-                }
+                )}
                 <button type="button" onClick={() => setIsCreatingDir(true)}>
                   <FolderPlus /> New folder
                 </button>
@@ -153,20 +180,25 @@ export default function () {
               </div>
             )}
 
-            {list.data.map((item: any) => (
+            {list.data.map((item: DirectoryEntry) => (
               <div key={item.name} className="entry">
                 <a key={link(item)} href={link(item)}>
-                  {item.type === 'directory' ? <Folder /> : <File />}
+                  {item.type === "directory" ? <Folder /> : <File />}
                   {shortName(item)}
                 </a>
-                <button onClick={() => { deleteItem(item) }}>
+                <button
+                  type="button"
+                  onClick={() => {
+                    deleteItem(item);
+                  }}
+                >
                   <Trash />
                 </button>
               </div>
             ))}
           </>
         )}
-      </div>
+      </div>{" "}
     </div>
   );
 }

lynxkite-app/web/src/apiTypes.ts

@@ -5,21 +5,22 @@
 /* Do not modify it by hand - just update the pydantic models and then re-run the script
 */
 
-/* eslint-disable */
-/**
- * This file was automatically generated by json-schema-to-typescript.
- * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
- * and run json-schema-to-typescript to regenerate this file.
- */
-
-export interface BaseConfig {
-  [k: string]: unknown;
+export interface DirectoryEntry {
+  name: string;
+  type: string;
 }
-export interface Position {
-  x: number;
-  y: number;
+export interface SaveRequest {
+  path: string;
+  ws: Workspace;
   [k: string]: unknown;
 }
+/**
+ * A workspace is a representation of a computational graph that consists of nodes and edges.
+ *
+ * Each node represents an operation or task, and the edges represent the flow of data between
+ * the nodes. Each workspace is associated with an environment, which determines the operations
+ * that can be performed in the workspace and the execution method for the operations.
+ */
 export interface Workspace {
   env?: string;
   nodes?: WorkspaceNode[];
@@ -42,6 +43,11 @@ export interface WorkspaceNodeData {
   error?: string | null;
   [k: string]: unknown;
 }
+export interface Position {
+  x: number;
+  y: number;
+  [k: string]: unknown;
+}
 export interface WorkspaceEdge {
   id: string;
   source: string;

lynxkite-app/web/src/index.css

@@ -154,7 +154,6 @@ body {
       width: fit-content;
       padding: 2px 8px;
       border-radius: 4px 4px 0 0;
-      ;
     }
 
     .collapsed-param {
@@ -317,7 +316,6 @@ body {
   }
 }
 
-
 path.react-flow__edge-path {
   stroke-width: 2;
   stroke: black;

lynxkite-app/web/src/main.tsx

@@ -1,12 +1,12 @@
-import { StrictMode } from 'react'
-import { createRoot } from 'react-dom/client'
-import '@xyflow/react/dist/style.css';
-import './index.css'
-import Directory from './Directory.tsx'
-import Workspace from './workspace/Workspace.tsx'
-import { BrowserRouter, Routes, Route } from "react-router";
+import { StrictMode } from "react";
+import { createRoot } from "react-dom/client";
+import "@xyflow/react/dist/style.css";
+import "./index.css";
+import { BrowserRouter, Route, Routes } from "react-router";
+import Directory from "./Directory.tsx";
+import Workspace from "./workspace/Workspace.tsx";
 
-createRoot(document.getElementById('root')!).render(
+createRoot(document.getElementById("root")!).render(
   <StrictMode>
     <BrowserRouter>
       <Routes>
@@ -17,4 +17,4 @@ createRoot(document.getElementById('root')!).render(
       </Routes>
     </BrowserRouter>
   </StrictMode>,
-)
+);

lynxkite-app/web/src/workspace/EnvironmentSelector.tsx

@@ -1,14 +1,21 @@
-export default function EnvironmentSelector(props: { options: string[], value: string, onChange: (val: string) => void }) {
+export default function EnvironmentSelector(props: {
+  options: string[];
+  value: string;
+  onChange: (val: string) => void;
+}) {
   return (
     <>
-      <select className="select w-full max-w-xs"
+      <select
+        className="select w-full max-w-xs"
         name="workspace-env"
         value={props.value}
         onChange={(evt) => props.onChange(evt.currentTarget.value)}
       >
-        {props.options.map(option =>
-          <option key={option} value={option}>{option}</option>
-        )}
+        {props.options.map((option) => (
+          <option key={option} value={option}>
+            {option}
+          </option>
+        ))}
       </select>
     </>
   );

lynxkite-app/web/src/workspace/LynxKiteState.ts

@@ -1,4 +1,4 @@
 import { createContext } from "react";
-import { Workspace } from "../apiTypes.ts";
+import type { Workspace } from "../apiTypes.ts";
 
 export const LynxKiteState = createContext({ workspace: {} as Workspace });

lynxkite-app/web/src/workspace/NodeSearch.tsx

@@ -1,22 +1,33 @@
-import Fuse from 'fuse.js'
-import { useEffect, useMemo, useRef, useState } from 'react';
+import Fuse from "fuse.js";
+import { useEffect, useMemo, useRef, useState } from "react";
 
 export type OpsOp = {
-  name: string
-  type: string
-  position: { x: number, y: number }
-  params: { name: string, default: any }[]
-}
+  name: string;
+  type: string;
+  position: { x: number; y: number };
+  params: { name: string; default: any }[];
+};
 export type Catalog = { [op: string]: OpsOp };
 export type Catalogs = { [env: string]: Catalog };
 
-export default function (props: { boxes: Catalog, onCancel: any, onAdd: any, pos: { x: number, y: number } }) {
+export default function (props: {
+  boxes: Catalog;
+  onCancel: any;
+  onAdd: any;
+  pos: { x: number; y: number };
+}) {
   const searchBox = useRef(null as unknown as HTMLInputElement);
-  const [searchText, setSearchText] = useState('');
-  const fuse = useMemo(() => new Fuse(Object.values(props.boxes), {
-    keys: ['name']
-  }), [props.boxes]);
-  const hits: { item: OpsOp }[] = searchText ? fuse.search<OpsOp>(searchText) : Object.values(props.boxes).map(box => ({ item: box }));
+  const [searchText, setSearchText] = useState("");
+  const fuse = useMemo(
+    () =>
+      new Fuse(Object.values(props.boxes), {
+        keys: ["name"],
+      }),
+    [props.boxes],
+  );
+  const hits: { item: OpsOp }[] = searchText
+    ? fuse.search<OpsOp>(searchText)
+    : Object.values(props.boxes).map((box) => ({ item: box }));
   const [selectedIndex, setSelectedIndex] = useState(0);
   useEffect(() => searchBox.current.focus());
   function typed(text: string) {
@@ -24,15 +35,15 @@ export default function (props: { boxes: Catalog, onCancel: any, onAdd: any, pos
     setSelectedIndex(Math.max(0, Math.min(selectedIndex, hits.length - 1)));
   }
   function onKeyDown(e: React.KeyboardEvent<HTMLInputElement>) {
-    if (e.key === 'ArrowDown') {
+    if (e.key === "ArrowDown") {
       e.preventDefault();
       setSelectedIndex(Math.min(selectedIndex + 1, hits.length - 1));
-    } else if (e.key === 'ArrowUp') {
+    } else if (e.key === "ArrowUp") {
       e.preventDefault();
       setSelectedIndex(Math.max(selectedIndex - 1, 0));
-    } else if (e.key === 'Enter') {
+    } else if (e.key === "Enter") {
       addSelected();
-    } else if (e.key === 'Escape') {
+    } else if (e.key === "Escape") {
       props.onCancel();
     }
   }
@@ -43,33 +54,37 @@ export default function (props: { boxes: Catalog, onCancel: any, onAdd: any, pos
   }
   async function lostFocus(e: any) {
     // If it's a click on a result, let the click handler handle it.
-    if (e.relatedTarget && e.relatedTarget.closest('.node-search')) return;
+    if (e.relatedTarget?.closest(".node-search")) return;
     props.onCancel();
   }
 
-
   return (
-    <div className="node-search" style={{ top: props.pos.y, left: props.pos.x }}>
+    <div
+      className="node-search"
+      style={{ top: props.pos.y, left: props.pos.x }}
+    >
       <input
         ref={searchBox}
         value={searchText}
-        onChange={event => typed(event.target.value)}
+        onChange={(event) => typed(event.target.value)}
         onKeyDown={onKeyDown}
         onBlur={lostFocus}
-        placeholder="Search for box" />
+        placeholder="Search for box"
+      />
       <div className="matches">
-        {hits.map((box, index) =>
+        {hits.map((box, index) => (
           <div
             key={box.item.name}
             tabIndex={0}
             onFocus={() => setSelectedIndex(index)}
             onMouseEnter={() => setSelectedIndex(index)}
             onClick={addSelected}
-            className={`search-result ${index === selectedIndex ? 'selected' : ''}`}>
+            className={`search-result ${index === selectedIndex ? "selected" : ""}`}
+          >
             {box.item.name}
           </div>
-        )}
+        ))}
       </div>
-    </div >
+    </div>
   );
 }

lynxkite-app/web/src/workspace/Workspace.tsx

@@ -1,40 +1,50 @@
-// The LynxKite workspace editor.
-import { useParams } from "react-router";
-import useSWR, { Fetcher } from 'swr';
-import { useEffect, useMemo, useCallback, useState, MouseEvent } from "react";
-import favicon from '../assets/favicon.ico';
+import { getYjsDoc, syncedStore } from "@syncedstore/core";
 import {
-  ReactFlow,
+  type Connection,
   Controls,
+  type Edge,
   MarkerType,
+  MiniMap,
+  type Node,
+  ReactFlow,
   ReactFlowProvider,
+  type XYPosition,
   applyEdgeChanges,
   applyNodeChanges,
-  useUpdateNodeInternals,
-  type XYPosition,
-  type Node,
-  type Edge,
-  type Connection,
   useReactFlow,
-  MiniMap,
-} from '@xyflow/react';
+  useUpdateNodeInternals,
+} from "@xyflow/react";
+import {
+  type MouseEvent,
+  useCallback,
+  useEffect,
+  useMemo,
+  useState,
+} from "react";
+// The LynxKite workspace editor.
+import { useParams } from "react-router";
+import useSWR, { type Fetcher } from "swr";
+import { WebsocketProvider } from "y-websocket";
 // @ts-ignore
-import ArrowBack from '~icons/tabler/arrow-back.jsx';
+import ArrowBack from "~icons/tabler/arrow-back.jsx";
 // @ts-ignore
-import Backspace from '~icons/tabler/backspace.jsx';
+import Atom from "~icons/tabler/atom.jsx";
 // @ts-ignore
-import Atom from '~icons/tabler/atom.jsx';
-import { syncedStore, getYjsDoc } from "@syncedstore/core";
-import { WebsocketProvider } from "y-websocket";
-import NodeWithParams from './nodes/NodeWithParams';
+import Backspace from "~icons/tabler/backspace.jsx";
+import type { Workspace, WorkspaceNode } from "../apiTypes.ts";
+import favicon from "../assets/favicon.ico";
 // import NodeWithTableView from './NodeWithTableView';
-import EnvironmentSelector from './EnvironmentSelector';
-import { LynxKiteState } from './LynxKiteState';
-import { Workspace, WorkspaceNode } from "../apiTypes.ts";
-import NodeSearch, { OpsOp, Catalog, Catalogs } from "./NodeSearch.tsx";
-import NodeWithVisualization from "./nodes/NodeWithVisualization.tsx";
+import EnvironmentSelector from "./EnvironmentSelector";
+import { LynxKiteState } from "./LynxKiteState";
+import NodeSearch, {
+  type OpsOp,
+  type Catalog,
+  type Catalogs,
+} from "./NodeSearch.tsx";
 import NodeWithImage from "./nodes/NodeWithImage.tsx";
+import NodeWithParams from "./nodes/NodeWithParams";
 import NodeWithTableView from "./nodes/NodeWithTableView.tsx";
+import NodeWithVisualization from "./nodes/NodeWithVisualization.tsx";
 
 export default function (props: any) {
   return (
@@ -44,9 +54,8 @@ export default function (props: any) {
   );
 }
 
-
 function LynxKiteFlow() {
-  const updateNodeInternals = useUpdateNodeInternals()
+  const updateNodeInternals = useUpdateNodeInternals();
   const reactFlow = useReactFlow();
   const [nodes, setNodes] = useState([] as Node[]);
   const [edges, setEdges] = useState([] as Edge[]);
@@ -56,7 +65,11 @@ function LynxKiteFlow() {
     const state = syncedStore({ workspace: {} as Workspace });
     setState(state);
     const doc = getYjsDoc(state);
-    const wsProvider = new WebsocketProvider(`ws://${location.host}/ws/crdt`, path!, doc);
+    const wsProvider = new WebsocketProvider(
+      `ws://${location.host}/ws/crdt`,
+      path!,
+      doc,
+    );
     const onChange = (_update: any, origin: any, _doc: any, _tr: any) => {
       if (origin === wsProvider) {
         // An update from the CRDT. Apply it to the local state.
@@ -72,154 +85,196 @@ function LynxKiteFlow() {
         }
       }
     };
-    doc.on('update', onChange);
+    doc.on("update", onChange);
     return () => {
       doc.destroy();
       wsProvider.destroy();
-    }
-  }, [path]);
+    };
+  }, [path, updateNodeInternals]);
 
-  const onNodesChange = useCallback((changes: any[]) => {
-    // An update from the UI. Apply it to the local state...
-    setNodes((nds) => applyNodeChanges(changes, nds));
-    // ...and to the CRDT state. (Which could be the same, except for ReactFlow's internal copies.)
-    const wnodes = state.workspace?.nodes;
-    if (!wnodes) return;
-    for (const ch of changes) {
-      const nodeIndex = wnodes.findIndex((n) => n.id === ch.id);
-      if (nodeIndex === -1) continue;
-      const node = wnodes[nodeIndex];
-      if (!node) continue;
-      // Position events sometimes come with NaN values. Ignore them.
-      if (ch.type === 'position' && !isNaN(ch.position.x) && !isNaN(ch.position.y)) {
-        getYjsDoc(state).transact(() => {
-          Object.assign(node.position, ch.position);
-        });
-      } else if (ch.type === 'select') {
-      } else if (ch.type === 'dimensions') {
-        getYjsDoc(state).transact(() => Object.assign(node, ch.dimensions));
-      } else if (ch.type === 'remove') {
-        wnodes.splice(nodeIndex, 1);
-      } else if (ch.type === 'replace') {
-        // Ideally we would only update the parameter that changed. But ReactFlow does not give us that detail.
-        const u = {
-          collapsed: ch.item.data.collapsed,
-          // The "..." expansion on a Y.map returns an empty object. Copying with fromEntries/entries instead.
-          params: { ...Object.fromEntries(Object.entries(ch.item.data.params)) },
-          __execution_delay: ch.item.data.__execution_delay,
-        };
-        getYjsDoc(state).transact(() => Object.assign(node.data, u));
-      } else {
-        console.log('Unknown node change', ch);
+  const onNodesChange = useCallback(
+    (changes: any[]) => {
+      // An update from the UI. Apply it to the local state...
+      setNodes((nds) => applyNodeChanges(changes, nds));
+      // ...and to the CRDT state. (Which could be the same, except for ReactFlow's internal copies.)
+      const wnodes = state.workspace?.nodes;
+      if (!wnodes) return;
+      for (const ch of changes) {
+        const nodeIndex = wnodes.findIndex((n) => n.id === ch.id);
+        if (nodeIndex === -1) continue;
+        const node = wnodes[nodeIndex];
+        if (!node) continue;
+        // Position events sometimes come with NaN values. Ignore them.
+        if (
+          ch.type === "position" &&
+          !Number.isNaN(ch.position.x) &&
+          !Number.isNaN(ch.position.y)
+        ) {
+          getYjsDoc(state).transact(() => {
+            Object.assign(node.position, ch.position);
+          });
+        } else if (ch.type === "select") {
+        } else if (ch.type === "dimensions") {
+          getYjsDoc(state).transact(() => Object.assign(node, ch.dimensions));
+        } else if (ch.type === "remove") {
+          wnodes.splice(nodeIndex, 1);
+        } else if (ch.type === "replace") {
+          // Ideally we would only update the parameter that changed. But ReactFlow does not give us that detail.
+          const u = {
+            collapsed: ch.item.data.collapsed,
+            // The "..." expansion on a Y.map returns an empty object. Copying with fromEntries/entries instead.
+            params: {
+              ...Object.fromEntries(Object.entries(ch.item.data.params)),
+            },
+            __execution_delay: ch.item.data.__execution_delay,
+          };
+          getYjsDoc(state).transact(() => Object.assign(node.data, u));
+        } else {
+          console.log("Unknown node change", ch);
+        }
       }
-    }
-  }, [state]);
-  const onEdgesChange = useCallback((changes: any[]) => {
-    setEdges((eds) => applyEdgeChanges(changes, eds));
-    const wedges = state.workspace?.edges;
-    if (!wedges) return;
-    for (const ch of changes) {
-      const edgeIndex = wedges.findIndex((e) => e.id === ch.id);
-      if (ch.type === 'remove') {
-        wedges.splice(edgeIndex, 1);
-      } else if (ch.type === 'select') {
-      } else {
-        console.log('Unknown edge change', ch);
+    },
+    [state],
+  );
+  const onEdgesChange = useCallback(
+    (changes: any[]) => {
+      setEdges((eds) => applyEdgeChanges(changes, eds));
+      const wedges = state.workspace?.edges;
+      if (!wedges) return;
+      for (const ch of changes) {
+        const edgeIndex = wedges.findIndex((e) => e.id === ch.id);
+        if (ch.type === "remove") {
+          wedges.splice(edgeIndex, 1);
+        } else if (ch.type === "select") {
+        } else {
+          console.log("Unknown edge change", ch);
+        }
       }
-    }
-  }, [state]);
+    },
+    [state],
+  );
 
-  const fetcher: Fetcher<Catalogs> = (resource: string, init?: RequestInit) => fetch(resource, init).then(res => res.json());
-  const catalog = useSWR('/api/catalog', fetcher);
+  const fetcher: Fetcher<Catalogs> = (resource: string, init?: RequestInit) =>
+    fetch(resource, init).then((res) => res.json());
+  const catalog = useSWR("/api/catalog", fetcher);
   const [suppressSearchUntil, setSuppressSearchUntil] = useState(0);
-  const [nodeSearchSettings, setNodeSearchSettings] = useState(undefined as {
-    pos: XYPosition,
-    boxes: Catalog,
-  } | undefined);
-  const nodeTypes = useMemo(() => ({
-    basic: NodeWithParams,
-    visualization: NodeWithVisualization,
-    image: NodeWithImage,
-    table_view: NodeWithTableView,
-  }), []);
+  const [nodeSearchSettings, setNodeSearchSettings] = useState(
+    undefined as
+      | {
+          pos: XYPosition;
+          boxes: Catalog;
+        }
+      | undefined,
+  );
+  const nodeTypes = useMemo(
+    () => ({
+      basic: NodeWithParams,
+      visualization: NodeWithVisualization,
+      image: NodeWithImage,
+      table_view: NodeWithTableView,
+    }),
+    [],
+  );
   const closeNodeSearch = useCallback(() => {
     setNodeSearchSettings(undefined);
     setSuppressSearchUntil(Date.now() + 200);
-  }, [setNodeSearchSettings, setSuppressSearchUntil]);
-  const toggleNodeSearch = useCallback((event: MouseEvent) => {
-    if (suppressSearchUntil > Date.now()) return;
-    if (nodeSearchSettings) {
-      closeNodeSearch();
-      return;
-    }
-    event.preventDefault();
-    setNodeSearchSettings({
-      pos: { x: event.clientX, y: event.clientY },
-      boxes: catalog.data![state.workspace.env!],
-    });
-  }, [catalog, state, setNodeSearchSettings, suppressSearchUntil]);
-  const addNode = useCallback((meta: OpsOp) => {
-    const node: Partial<WorkspaceNode> = {
-      type: meta.type,
-      data: {
-        meta: meta,
-        title: meta.name,
-        params: Object.fromEntries(
-          Object.values(meta.params).map((p) => [p.name, p.default])),
-      },
-    };
-    const nss = nodeSearchSettings!;
-    node.position = reactFlow.screenToFlowPosition({ x: nss.pos.x, y: nss.pos.y });
-    const title = meta.name;
-    let i = 1;
-    node.id = `${title} ${i}`;
-    const wnodes = state.workspace.nodes!;
-    while (wnodes.find((x) => x.id === node.id)) {
-      i += 1;
+  }, []);
+  const toggleNodeSearch = useCallback(
+    (event: MouseEvent) => {
+      if (suppressSearchUntil > Date.now()) return;
+      if (nodeSearchSettings) {
+        closeNodeSearch();
+        return;
+      }
+      event.preventDefault();
+      setNodeSearchSettings({
+        pos: { x: event.clientX, y: event.clientY },
+        boxes: catalog.data![state.workspace.env!],
+      });
+    },
+    [catalog, state, nodeSearchSettings, suppressSearchUntil, closeNodeSearch],
+  );
+  const addNode = useCallback(
+    (meta: OpsOp) => {
+      const node: Partial<WorkspaceNode> = {
+        type: meta.type,
+        data: {
+          meta: meta,
+          title: meta.name,
+          params: Object.fromEntries(
+            Object.values(meta.params).map((p) => [p.name, p.default]),
+          ),
+        },
+      };
+      const nss = nodeSearchSettings!;
+      node.position = reactFlow.screenToFlowPosition({
+        x: nss.pos.x,
+        y: nss.pos.y,
+      });
+      const title = meta.name;
+      let i = 1;
       node.id = `${title} ${i}`;
-    }
-    wnodes.push(node as WorkspaceNode);
-    setNodes([...nodes, node as WorkspaceNode]);
-    closeNodeSearch();
-  }, [nodeSearchSettings, state, reactFlow, setNodes]);
+      const wnodes = state.workspace.nodes!;
+      while (wnodes.find((x) => x.id === node.id)) {
+        i += 1;
+        node.id = `${title} ${i}`;
+      }
+      wnodes.push(node as WorkspaceNode);
+      setNodes([...nodes, node as WorkspaceNode]);
+      closeNodeSearch();
+    },
+    [nodeSearchSettings, state, reactFlow, nodes, closeNodeSearch],
+  );
 
-  const onConnect = useCallback((connection: Connection) => {
-    setSuppressSearchUntil(Date.now() + 200);
-    const edge = {
-      id: `${connection.source} ${connection.target}`,
-      source: connection.source,
-      sourceHandle: connection.sourceHandle!,
-      target: connection.target,
-      targetHandle: connection.targetHandle!,
-    };
-    state.workspace.edges!.push(edge);
-    setEdges((oldEdges) => [...oldEdges, edge]);
-  }, [state, setEdges]);
-  const parentDir = path!.split('/').slice(0, -1).join('/');
+  const onConnect = useCallback(
+    (connection: Connection) => {
+      setSuppressSearchUntil(Date.now() + 200);
+      const edge = {
+        id: `${connection.source} ${connection.target}`,
+        source: connection.source,
+        sourceHandle: connection.sourceHandle!,
+        target: connection.target,
+        targetHandle: connection.targetHandle!,
+      };
+      state.workspace.edges!.push(edge);
+      setEdges((oldEdges) => [...oldEdges, edge]);
+    },
+    [state],
+  );
+  const parentDir = path!.split("/").slice(0, -1).join("/");
   return (
     <div className="workspace">
       <div className="top-bar bg-neutral">
-        <a className="logo" href=""><img src={favicon} /></a>
-        <div className="ws-name">
-          {path}
-        </div>
+        <a className="logo" href="">
+          <img alt="" src={favicon} />
+        </a>
+        <div className="ws-name">{path}</div>
         <EnvironmentSelector
           options={Object.keys(catalog.data || {})}
           value={state.workspace.env!}
-          onChange={(env) => { state.workspace.env = env; }}
+          onChange={(env) => {
+            state.workspace.env = env;
+          }}
         />
         <div className="tools text-secondary">
-          <a href=""><Atom /></a>
-          <a href=""><Backspace /></a>
-          <a href={'/dir/' + parentDir}><ArrowBack /></a>
+          <a href="">
+            <Atom />
+          </a>
+          <a href="">
+            <Backspace />
+          </a>
+          <a href={`/dir/${parentDir}`}>
+            <ArrowBack />
+          </a>
         </div>
       </div>
-      <div style={{ height: "100%", width: '100vw' }}>
+      <div style={{ height: "100%", width: "100vw" }}>
         <LynxKiteState.Provider value={state}>
           <ReactFlow
             nodes={nodes}
             edges={edges}
-            nodeTypes={nodeTypes} fitView
+            nodeTypes={nodeTypes}
+            fitView
             onNodesChange={onNodesChange}
             onEdgesChange={onEdgesChange}
             onPaneClick={toggleNodeSearch}
@@ -231,13 +286,17 @@ function LynxKiteFlow() {
           >
             <Controls />
             <MiniMap />
-            {nodeSearchSettings &&
-              <NodeSearch pos={nodeSearchSettings.pos} boxes={nodeSearchSettings.boxes} onCancel={closeNodeSearch} onAdd={addNode} />
-            }
+            {nodeSearchSettings && (
+              <NodeSearch
+                pos={nodeSearchSettings.pos}
+                boxes={nodeSearchSettings.boxes}
+                onCancel={closeNodeSearch}
+                onAdd={addNode}
+              />
+            )}
           </ReactFlow>
         </LynxKiteState.Provider>
       </div>
     </div>
-
   );
 }

lynxkite-app/web/src/workspace/nodes/LynxKiteNode.tsx

@@ -1,6 +1,11 @@
-import { useReactFlow, Handle, NodeResizeControl, Position } from '@xyflow/react';
+import {
+  Handle,
+  NodeResizeControl,
+  type Position,
+  useReactFlow,
+} from "@xyflow/react";
 // @ts-ignore
-import ChevronDownRight from '~icons/tabler/chevron-down-right.jsx';
+import ChevronDownRight from "~icons/tabler/chevron-down-right.jsx";
 
 interface LynxKiteNodeProps {
   id: string;
@@ -13,18 +18,18 @@ interface LynxKiteNodeProps {
 
 function getHandles(inputs: object, outputs: object) {
   const handles: {
-    position: 'top' | 'bottom' | 'left' | 'right',
-    name: string,
-    index: number,
-    offsetPercentage: number,
-    showLabel: boolean,
-    type: 'source' | 'target',
+    position: "top" | "bottom" | "left" | "right";
+    name: string;
+    index: number;
+    offsetPercentage: number;
+    showLabel: boolean;
+    type: "source" | "target";
   }[] = [];
   for (const e of Object.values(inputs)) {
-    handles.push({ ...e, type: 'target' });
+    handles.push({ ...e, type: "target" });
   }
   for (const e of Object.values(outputs)) {
-    handles.push({ ...e, type: 'source' });
+    handles.push({ ...e, type: "source" });
   }
   const counts = { top: 0, bottom: 0, left: 0, right: 0 };
   for (const e of handles) {
@@ -32,9 +37,11 @@ function getHandles(inputs: object, outputs: object) {
     counts[e.position]++;
   }
   for (const e of handles) {
-    e.offsetPercentage = 100 * (e.index + 1) / (counts[e.position] + 1);
-    const simpleHorizontal = counts.top === 0 && counts.bottom === 0 && handles.length <= 2;
-    const simpleVertical = counts.left === 0 && counts.right === 0 && handles.length <= 2;
+    e.offsetPercentage = (100 * (e.index + 1)) / (counts[e.position] + 1);
+    const simpleHorizontal =
+      counts.top === 0 && counts.bottom === 0 && handles.length <= 2;
+    const simpleVertical =
+      counts.left === 0 && counts.right === 0 && handles.length <= 2;
     e.showLabel = !simpleHorizontal && !simpleVertical;
   }
   return handles;
@@ -48,37 +55,57 @@ export default function LynxKiteNode(props: LynxKiteNodeProps) {
   function titleClicked() {
     reactFlow.updateNodeData(props.id, { collapsed: expanded });
   }
-  const handleOffsetDirection = { top: 'left', bottom: 'left', left: 'top', right: 'top' };
+  const handleOffsetDirection = {
+    top: "left",
+    bottom: "left",
+    left: "top",
+    right: "top",
+  };
 
   return (
-    <div className={'node-container ' + (expanded ? 'expanded' : 'collapsed')}
-      style={{ width: props.width || 200, height: expanded ? props.height || 200 : undefined }}>
+    <div
+      className={`node-container·${expanded ? "expanded" : "collapsed"} `}
+      style={{
+        width: props.width || 200,
+        height: expanded ? props.height || 200 : undefined,
+      }}
+    >
       <div className="lynxkite-node" style={props.nodeStyle}>
         <div className="title bg-primary" onClick={titleClicked}>
           {data.title}
           {data.error && <span className="title-icon">⚠️</span>}
           {expanded || <span className="title-icon">⋯</span>}
         </div>
-        {expanded && <>
-          {data.error &&
-            <div className="error">{data.error}</div>
-          }
-          {props.children}
-          <NodeResizeControl
-            minWidth={100}
-            minHeight={50}
-            style={{ 'background': 'transparent', 'border': 'none' }}
-          >
-            <ChevronDownRight className="node-resizer" />
-          </NodeResizeControl>
-        </>}
-        {handles.map(handle => (
+        {expanded && (
+          <>
+            {data.error && <div className="error">{data.error}</div>}
+            {props.children}
+            <NodeResizeControl
+              minWidth={100}
+              minHeight={50}
+              style={{ background: "transparent", border: "none" }}
+            >
+              <ChevronDownRight className="node-resizer" />
+            </NodeResizeControl>
+          </>
+        )}
+        {handles.map((handle) => (
           <Handle
             key={handle.name}
-            id={handle.name} type={handle.type} position={handle.position as Position}
-            style={{ [handleOffsetDirection[handle.position]]: handle.offsetPercentage + '%' }}>
-            {handle.showLabel && <span className="handle-name">{handle.name.replace(/_/g, " ")}</span>}
-          </Handle >
+            id={handle.name}
+            type={handle.type}
+            position={handle.position as Position}
+            style={{
+              [handleOffsetDirection[handle.position]]:
+                `${handle.offsetPercentage}% `,
+            }}
+          >
+            {handle.showLabel && (
+              <span className="handle-name">
+                {handle.name.replace(/_/g, " ")}
+              </span>
+            )}
+          </Handle>
         ))}
       </div>
     </div>

lynxkite-app/web/src/workspace/nodes/NodeParameter.tsx

@@ -1,7 +1,9 @@
 const BOOLEAN = "<class 'bool'>";
 
 function ParamName({ name }: { name: string }) {
-  return <span className="param-name bg-base-200">{name.replace(/_/g, ' ')}</span>;
+  return (
+    <span className="param-name bg-base-200">{name.replace(/_/g, " ")}</span>
+  );
 }
 
 interface NodeParameterProps {
@@ -11,50 +13,69 @@ interface NodeParameterProps {
   onChange: (value: any, options?: { delay: number }) => void;
 }
 
-export default function NodeParameter({ name, value, meta, onChange }: NodeParameterProps) {
+export default function NodeParameter({
+  name,
+  value,
+  meta,
+  onChange,
+}: NodeParameterProps) {
   return (
+    // biome-ignore lint/a11y/noLabelWithoutControl: Most of the time there is a control.
     <label className="param">
-      {meta?.type?.format === 'collapsed' ? <>
-        <ParamName name={name} />
-        <button className="collapsed-param">
-          ⋯
-        </button>
-      </> : meta?.type?.format === 'textarea' ? <>
-        <ParamName name={name} />
-        <textarea className="textarea textarea-bordered w-full max-w-xs"
-          rows={6}
-          value={value}
-          onChange={(evt) => onChange(evt.currentTarget.value, { delay: 2 })}
-          onBlur={(evt) => onChange(evt.currentTarget.value, { delay: 0 })}
-        />
-      </> : meta?.type?.enum ? <>
-        <ParamName name={name} />
-        <select className="select select-bordered w-full max-w-xs"
-          value={value || meta.type.enum[0]}
-          onChange={(evt) => onChange(evt.currentTarget.value)}
-        >
-          {meta.type.enum.map((option: string) =>
-            <option key={option} value={option}>{option}</option>
-          )}
-        </select>
-      </> : meta?.type?.type === BOOLEAN ? <div className="form-control">
-        <label className="label cursor-pointer">
-          <input className="checkbox"
-            type="checkbox"
-            checked={value}
-            onChange={(evt) => onChange(evt.currentTarget.checked)}
+      {meta?.type?.format === "collapsed" ? (
+        <>
+          <ParamName name={name} />
+          <button className="collapsed-param">⋯</button>
+        </>
+      ) : meta?.type?.format === "textarea" ? (
+        <>
+          <ParamName name={name} />
+          <textarea
+            className="textarea textarea-bordered w-full max-w-xs"
+            rows={6}
+            value={value}
+            onChange={(evt) => onChange(evt.currentTarget.value, { delay: 2 })}
+            onBlur={(evt) => onChange(evt.currentTarget.value, { delay: 0 })}
+          />
+        </>
+      ) : meta?.type?.enum ? (
+        <>
+          <ParamName name={name} />
+          <select
+            className="select select-bordered w-full max-w-xs"
+            value={value || meta.type.enum[0]}
+            onChange={(evt) => onChange(evt.currentTarget.value)}
+          >
+            {meta.type.enum.map((option: string) => (
+              <option key={option} value={option}>
+                {option}
+              </option>
+            ))}
+          </select>
+        </>
+      ) : meta?.type?.type === BOOLEAN ? (
+        <div className="form-control">
+          <label className="label cursor-pointer">
+            <input
+              className="checkbox"
+              type="checkbox"
+              checked={value}
+              onChange={(evt) => onChange(evt.currentTarget.checked)}
+            />
+            {name.replace(/_/g, " ")}
+          </label>
+        </div>
+      ) : (
+        <>
+          <ParamName name={name} />
+          <input
+            className="input input-bordered w-full max-w-xs"
+            value={value || ""}
+            onChange={(evt) => onChange(evt.currentTarget.value, { delay: 2 })}
+            onBlur={(evt) => onChange(evt.currentTarget.value, { delay: 0 })}
           />
-          {name.replace(/_/g, ' ')}
-        </label>
-      </div> : <>
-        <ParamName name={name} />
-        <input className="input input-bordered w-full max-w-xs"
-          value={value || ""}
-          onChange={(evt) => onChange(evt.currentTarget.value, { delay: 2 })}
-          onBlur={(evt) => onChange(evt.currentTarget.value, { delay: 0 })}
-        />
-      </>
-      }
-    </label >
+        </>
+      )}
+    </label>
   );
 }

lynxkite-app/web/src/workspace/nodes/NodeWithImage.tsx

@@ -1,9 +1,11 @@
-import NodeWithParams from './NodeWithParams';
+import NodeWithParams from "./NodeWithParams";
 
 const NodeWithImage = (props: any) => {
   return (
     <NodeWithParams {...props}>
-      {props.data.display && <img src={props.data.display} alt="Node Display" />}
+      {props.data.display && (
+        <img src={props.data.display} alt="Node Display" />
+      )}
     </NodeWithParams>
   );
 };

lynxkite-app/web/src/workspace/nodes/NodeWithParams.tsx

@@ -1,6 +1,6 @@
-import LynxKiteNode from './LynxKiteNode';
-import { useReactFlow } from '@xyflow/react';
-import NodeParameter from './NodeParameter';
+import { useReactFlow } from "@xyflow/react";
+import LynxKiteNode from "./LynxKiteNode";
+import NodeParameter from "./NodeParameter";
 
 export type UpdateOptions = { delay?: number };
 
@@ -8,23 +8,28 @@ function NodeWithParams(props: any) {
   const reactFlow = useReactFlow();
   const metaParams = props.data.meta?.params;
   function setParam(name: string, newValue: any, opts: UpdateOptions) {
-    reactFlow.updateNodeData(props.id, { params: { ...props.data.params, [name]: newValue }, __execution_delay: opts.delay || 0 });
+    reactFlow.updateNodeData(props.id, {
+      params: { ...props.data.params, [name]: newValue },
+      __execution_delay: opts.delay || 0,
+    });
   }
   const params = props.data?.params ? Object.entries(props.data.params) : [];
 
   return (
     <LynxKiteNode {...props}>
-      {params.map(([name, value]) =>
+      {params.map(([name, value]) => (
         <NodeParameter
           name={name}
           key={name}
           value={value}
           meta={metaParams?.[name]}
-          onChange={(value: any, opts?: UpdateOptions) => setParam(name, value, opts || {})}
+          onChange={(value: any, opts?: UpdateOptions) =>
+            setParam(name, value, opts || {})
+          }
         />
-      )}
+      ))}
       {props.children}
-    </LynxKiteNode >
+    </LynxKiteNode>
   );
 }
 

lynxkite-app/web/src/workspace/nodes/NodeWithTableView.tsx

@@ -1,15 +1,15 @@
-import { useState } from 'react';
-import Markdown from 'react-markdown'
-import LynxKiteNode from './LynxKiteNode';
-import Table from './Table';
-import React from 'react';
+import { useState } from "react";
+import React from "react";
+import Markdown from "react-markdown";
+import LynxKiteNode from "./LynxKiteNode";
+import Table from "./Table";
 
 function toMD(v: any): string {
-  if (typeof v === 'string') {
+  if (typeof v === "string") {
     return v;
   }
   if (Array.isArray(v)) {
-    return v.map(toMD).join('\n\n');
+    return v.map(toMD).join("\n\n");
   }
   return JSON.stringify(v);
 }
@@ -17,33 +17,60 @@ function toMD(v: any): string {
 export default function NodeWithTableView(props: any) {
   const [open, setOpen] = useState({} as { [name: string]: boolean });
   const display = props.data.display?.value;
-  const single = display?.dataframes && Object.keys(display?.dataframes).length === 1;
+  const single =
+    display?.dataframes && Object.keys(display?.dataframes).length === 1;
   return (
     <LynxKiteNode {...props}>
       {display && [
-        Object.entries(display.dataframes || {}).map(([name, df]: [string, any]) => <React.Fragment key={name}>
-          {!single && <div key={name + '-header'} className="df-head" onClick={() => setOpen({ ...open, [name]: !open[name] })}>{name}</div>}
-          {(single || open[name]) &&
-            (df.data.length > 1 ?
-              <Table key={name + '-table'} columns={df.columns} data={df.data} />
-              :
-              df.data.length ?
-                <dl key={name + '-dl'}>
-                  {df.columns.map((c: string, i: number) =>
-                    <React.Fragment key={name + '-' + c}>
-                      <dt>{c}</dt>
-                      <dd><Markdown>{toMD(df.data[0][i])}</Markdown></dd>
-                    </React.Fragment>)
-                  }
-                </dl>
-                :
-                JSON.stringify(df.data))}
-        </React.Fragment>),
-        Object.entries(display.others || {}).map(([name, o]) => <>
-          <div className="df-head" onClick={() => setOpen({ ...open, [name]: !open[name] })}>{name}</div>
-          {open[name] && <pre>{(o as any).toString()}</pre>}
-        </>
-        )]}
-    </LynxKiteNode >
+        Object.entries(display.dataframes || {}).map(
+          ([name, df]: [string, any]) => (
+            <React.Fragment key={name}>
+              {!single && (
+                <div
+                  key={`${name}-header`}
+                  className="df-head"
+                  onClick={() => setOpen({ ...open, [name]: !open[name] })}
+                >
+                  {name}
+                </div>
+              )}
+              {(single || open[name]) &&
+                (df.data.length > 1 ? (
+                  <Table
+                    key={`${name}-table`}
+                    columns={df.columns}
+                    data={df.data}
+                  />
+                ) : df.data.length ? (
+                  <dl key={`${name}-dl`}>
+                    {df.columns.map((c: string, i: number) => (
+                      <React.Fragment key={`${name}-${c}`}>
+                        <dt>{c}</dt>
+                        <dd>
+                          <Markdown>{toMD(df.data[0][i])}</Markdown>
+                        </dd>
+                      </React.Fragment>
+                    ))}
+                  </dl>
+                ) : (
+                  JSON.stringify(df.data)
+                ))}
+            </React.Fragment>
+          ),
+        ),
+        Object.entries(display.others || {}).map(([name, o]) => (
+          <>
+            <div
+              key={`${name}-header`}
+              className="df-head"
+              onClick={() => setOpen({ ...open, [name]: !open[name] })}
+            >
+              {name}
+            </div>
+            {open[name] && <pre>{(o as any).toString()}</pre>}
+          </>
+        )),
+      ]}
+    </LynxKiteNode>
   );
 }

lynxkite-app/web/src/workspace/nodes/NodeWithVisualization.tsx

@@ -1,6 +1,6 @@
-import React, { useEffect } from 'react';
-import NodeWithParams from './NodeWithParams';
-const echarts = await import('echarts');
+import React, { useEffect } from "react";
+import NodeWithParams from "./NodeWithParams";
+const echarts = await import("echarts");
 
 const NodeWithVisualization = (props: any) => {
   const chartsRef = React.useRef<HTMLDivElement>(null);
@@ -8,12 +8,16 @@ const NodeWithVisualization = (props: any) => {
   useEffect(() => {
     const opts = props.data?.display?.value;
     if (!opts || !chartsRef.current) return;
-    chartsInstanceRef.current = echarts.init(chartsRef.current, null, { renderer: 'canvas', width: 250, height: 250 });
+    chartsInstanceRef.current = echarts.init(chartsRef.current, null, {
+      renderer: "canvas",
+      width: 250,
+      height: 250,
+    });
     chartsInstanceRef.current.setOption(opts);
     const onResize = () => chartsInstanceRef.current?.resize();
-    window.addEventListener('resize', onResize);
+    window.addEventListener("resize", onResize);
     return () => {
-      window.removeEventListener('resize', onResize);
+      window.removeEventListener("resize", onResize);
       chartsInstanceRef.current?.dispose();
     };
   }, [props.data?.display?.value]);

lynxkite-app/web/src/workspace/nodes/Table.tsx

@@ -1,17 +1,22 @@
 export default function Table(props: any) {
-  return (<table>
-    <thead>
-      <tr>
-        {props.columns.map((column: string) =>
-          <th key={column}>{column}</th>)}
-      </tr>
-    </thead>
-    <tbody>
-      {props.data.map((row: { [column: string]: any }, i: number) =>
-        <tr key={`row-${i}`}>
-          {props.columns.map((_column: string, j: number) =>
-            <td key={`cell ${i}, ${j}`}>{JSON.stringify(row[j])}</td>)}
-        </tr>)}
-    </tbody>
-  </table>);
+  return (
+    <table>
+      <thead>
+        <tr>
+          {props.columns.map((column: string) => (
+            <th key={column}>{column}</th>
+          ))}
+        </tr>
+      </thead>
+      <tbody>
+        {props.data.map((row: { [column: string]: any }, i: number) => (
+          <tr key={`row-${i}`}>
+            {props.columns.map((_column: string, j: number) => (
+              <td key={`cell ${i}, ${j}`}>{JSON.stringify(row[j])}</td>
+            ))}
+          </tr>
+        ))}
+      </tbody>
+    </table>
+  );
 }

lynxkite-app/web/tailwind.config.js

@@ -1,21 +1,21 @@
 /** @type {import('tailwindcss').Config} */
 export default {
-  darkMode: 'selector',
-  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
+  darkMode: "selector",
+  content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
   theme: {
     extend: {},
   },
-  plugins: [require('daisyui')],
+  plugins: [require("daisyui")],
   daisyui: {
     logs: false,
     themes: [
       {
         lynxkite: {
-          primary: 'oklch(75% 0.2 55)',
-          secondary: 'oklch(75% 0.13 230)',
-          accent: 'oklch(55% 0.25 320)',
-          neutral: 'oklch(35% 0.1 240)',
-          'base-100': '#ffffff',
+          primary: "oklch(75% 0.2 55)",
+          secondary: "oklch(75% 0.13 230)",
+          accent: "oklch(55% 0.25 320)",
+          neutral: "oklch(35% 0.1 240)",
+          "base-100": "#ffffff",
         },
       },
     ],

lynxkite-app/web/tests/basic.spec.ts

@@ -1,25 +1,25 @@
 // Tests some basic operations like box creation, deletion, and dragging.
-import { test, expect } from '@playwright/test';
-import { Splash, Workspace } from './lynxkite';
-
+import { expect, test } from "@playwright/test";
+import { Splash, Workspace } from "./lynxkite";
 
 let workspace: Workspace;
 
-
 test.beforeEach(async ({ browser }) => {
-  workspace = await Workspace.empty(await browser.newPage(), 'basic_spec_test');
+  workspace = await Workspace.empty(await browser.newPage(), "basic_spec_test");
 });
 
 test.afterEach(async () => {
   await workspace.close();
   const splash = await new Splash(workspace.page);
-  splash.page.on('dialog', async dialog => { await dialog.accept(); });
-  await splash.deleteEntry('basic_spec_test');
+  splash.page.on("dialog", async (dialog) => {
+    await dialog.accept();
+  });
+  await splash.deleteEntry("basic_spec_test");
 });
 
-test('Box creation & deletion per env', async () => {
+test("Box creation & deletion per env", async () => {
   const envs = await workspace.getEnvs();
-  for(const env of envs) {
+  for (const env of envs) {
     await workspace.setEnv(env);
     const catalog = await workspace.getCatalog();
     expect(catalog).not.toHaveLength(0);
@@ -31,23 +31,18 @@ test('Box creation & deletion per env', async () => {
   }
 });
 
-
-test('Delete multi-handle boxes', async () => {
-  await workspace.addBox('Compute PageRank');
-  await workspace.deleteBoxes(['Compute PageRank 1']);
-  await expect(workspace.getBox('Compute PageRank 1')).not.toBeVisible();
+test("Delete multi-handle boxes", async () => {
+  await workspace.addBox("Compute PageRank");
+  await workspace.deleteBoxes(["Compute PageRank 1"]);
+  await expect(workspace.getBox("Compute PageRank 1")).not.toBeVisible();
 });
 
-
-test ('Drag box', async () => {
-  await workspace.addBox('Import Parquet');
-  const originalPos = await workspace.getBox('Import Parquet 1').boundingBox();
-  await workspace.moveBox('Import Parquet 1', {offsetX: 100, offsetY: 100});
-  const newPos = await workspace.getBox('Import Parquet 1').boundingBox();
+test("Drag box", async () => {
+  await workspace.addBox("Import Parquet");
+  const originalPos = await workspace.getBox("Import Parquet 1").boundingBox();
+  await workspace.moveBox("Import Parquet 1", { offsetX: 100, offsetY: 100 });
+  const newPos = await workspace.getBox("Import Parquet 1").boundingBox();
   // Exact position is not guaranteed, but it should have moved
   expect(newPos.x).toBeGreaterThan(originalPos.x);
   expect(newPos.y).toBeGreaterThan(originalPos.y);
 });
-
-
-

lynxkite-app/web/tests/directory.spec.ts

@@ -1,39 +1,38 @@
 // Tests some basic operations like box creation, deletion, and dragging.
-import { test, expect } from '@playwright/test';
-import { Workspace, Splash } from './lynxkite';
-
+import { expect, test } from "@playwright/test";
+import { Splash, Workspace } from "./lynxkite";
 
 test.describe("Directory operations", () => {
-
   let splash: Splash;
 
   test.beforeAll(async ({ browser }) => {
-    const page = await browser.newPage()
+    const page = await browser.newPage();
     // To make deletion confirmation dialog to be automatically accepted
-    page.on('dialog', async dialog => { await dialog.accept(); });
+    page.on("dialog", async (dialog) => {
+      await dialog.accept();
+    });
     splash = await Splash.open(page);
   });
 
-
-  test('Create workspace with default name', async () => {
+  test("Create workspace with default name", async () => {
     const workspace = await Workspace.empty(splash.page);
     // Not checking for exact match, since there may be pre-existing "Untitled" workspaces
-    expect(workspace.name).toContain('Untitled');
+    expect(workspace.name).toContain("Untitled");
     await workspace.close();
   });
 
-  test('Create & delete workspace', async () => {
+  test("Create & delete workspace", async () => {
     const workspaceName = `TestWorkspace-${Date.now()}`;
     const workspace = await Workspace.empty(splash.page, workspaceName);
     await workspace.expectCurrentWorkspaceIs(workspaceName);
     // Add a box so the workspace is saved
-    await workspace.addBox('Import Parquet');
+    await workspace.addBox("Import Parquet");
     await workspace.close();
     await splash.deleteEntry(workspaceName);
     await expect(splash.getEntry(workspaceName)).not.toBeVisible();
   });
 
-  test('Create & delete folder', async () => {
+  test("Create & delete folder", async () => {
     const folderName = `TestFolder-${Date.now()}`;
     await splash.createFolder(folderName);
     await expect(splash.currentFolder()).toHaveText(folderName);
@@ -42,56 +41,57 @@ test.describe("Directory operations", () => {
     await expect(splash.getEntry(folderName)).not.toBeVisible();
   });
 
-  test('Create folder with default name', async () => {
+  test("Create folder with default name", async () => {
     await splash.createFolder();
-    await expect(splash.currentFolder()).toContainText('Untitled');
+    await expect(splash.currentFolder()).toContainText("Untitled");
   });
 });
 
-
-test.describe.serial('Nested folders & workspaces operations', () => {
-
-  let splash;
-
-  test.beforeEach(() => {
-    // Nested navigation doesn't work yet
-    test.skip();
-  });
-
-  test.beforeAll(async ({ browser }) => {
-    const page = await browser.newPage()
-    // To make deletion confirmation dialog to be automatically accepted
-    page.on('dialog', async dialog => { await dialog.accept(); });
-    splash = await Splash.open(page);
-    await splash.createFolder('TestFolder');
-  });
-
-  test.afterAll(async () => {
-    //cleanup
-    test.skip();
-    await splash.goHome();
-    await splash.deleteEntry('TestFolder');
-  });
-
-  test('Create nested folder', async () => {
-    await splash.createFolder('TestFolder2');
-    await expect(splash.currentFolder()).toHaveText('TestFolder2');
-    await splash.toParent();
-  });
-
-  test('Delete nested folder', async () => {
-    await splash.deleteEntry('TestFolder2');
-    await expect(splash.getEntry('TestFolder2')).not.toBeVisible();
+test.describe
+  .serial("Nested folders & workspaces operations", () => {
+    let splash: Splash;
+
+    test.beforeEach(() => {
+      // Nested navigation doesn't work yet
+      test.skip();
+    });
+
+    test.beforeAll(async ({ browser }) => {
+      const page = await browser.newPage();
+      // To make deletion confirmation dialog to be automatically accepted
+      page.on("dialog", async (dialog) => {
+        await dialog.accept();
+      });
+      splash = await Splash.open(page);
+      await splash.createFolder("TestFolder");
+    });
+
+    test.afterAll(async () => {
+      //cleanup
+      test.skip();
+      await splash.goHome();
+      await splash.deleteEntry("TestFolder");
+    });
+
+    test("Create nested folder", async () => {
+      await splash.createFolder("TestFolder2");
+      await expect(splash.currentFolder()).toHaveText("TestFolder2");
+      await splash.toParent();
+    });
+
+    test("Delete nested folder", async () => {
+      await splash.deleteEntry("TestFolder2");
+      await expect(splash.getEntry("TestFolder2")).not.toBeVisible();
+    });
+
+    test("Create nested workspace", async () => {
+      const workspace = splash.createWorkspace("TestWorkspace");
+      await workspace.expectCurrentWorkspaceIs("TestWorkspace");
+      await workspace.close();
+    });
+
+    test("Delete nested workspace", async () => {
+      await splash.deleteEntry("TestWorkspace");
+      await expect(splash.getEntry("TestWorkspace")).not.toBeVisible();
+    });
   });
-
-  test('Create nested workspace', async () => {
-    const workspace = splash.createWorkspace('TestWorkspace');
-    await workspace.expectCurrentWorkspaceIs('TestWorkspace');
-    await workspace.close();
-  });
-
-  test('Delete nested workspace', async () => {
-    await splash.deleteEntry('TestWorkspace');
-    await expect(splash.getEntry('TestWorkspace')).not.toBeVisible();
-  });
-});

lynxkite-app/web/tests/errors.spec.ts

@@ -1,43 +1,43 @@
 // Tests error reporting.
-import { test, expect } from '@playwright/test';
-import { Splash, Workspace } from './lynxkite';
-
+import { expect, test } from "@playwright/test";
+import { Splash, Workspace } from "./lynxkite";
 
 let workspace: Workspace;
 
-
 test.beforeEach(async ({ browser }) => {
-  workspace = await Workspace.empty(await browser.newPage(), 'error_spec_test');
+  workspace = await Workspace.empty(await browser.newPage(), "error_spec_test");
 });
 
-test.afterEach(async ({ }) => {
+test.afterEach(async () => {
   await workspace.close();
   const splash = await new Splash(workspace.page);
-  splash.page.on('dialog', async dialog => { await dialog.accept(); });
-  await splash.deleteEntry('error_spec_test');
+  splash.page.on("dialog", async (dialog) => {
+    await dialog.accept();
+  });
+  await splash.deleteEntry("error_spec_test");
 });
 
-
-test('missing parameter', async () => {
+test("missing parameter", async () => {
   // Test the correct error message is displayed when a required parameter is missing,
   // and that the error message is removed when the parameter is filled.
-  await workspace.addBox('Create scale-free graph');
-  const graphBox = workspace.getBox('Create scale-free graph 1');
-  await graphBox.locator('input').fill('');
-  expect(await graphBox.locator('.error').innerText()).toBe("invalid literal for int() with base 10: ''");
-  await graphBox.locator('input').fill('10');
-  await expect(graphBox.locator('.error')).not.toBeVisible();
+  await workspace.addBox("Create scale-free graph");
+  const graphBox = workspace.getBox("Create scale-free graph 1");
+  await graphBox.locator("input").fill("");
+  expect(await graphBox.locator(".error").innerText()).toBe(
+    "invalid literal for int() with base 10: ''",
+  );
+  await graphBox.locator("input").fill("10");
+  await expect(graphBox.locator(".error")).not.toBeVisible();
 });
 
-
-test('unknown operation', async () => {
+test("unknown operation", async () => {
   // Test that the correct error is displayed when the operation does not belong to
   // the current environment.
-  await workspace.addBox('Create scale-free graph');
-  await workspace.setEnv('LynxScribe');
-  const csvBox =  workspace.getBox('Create scale-free graph 1');
-  const errorText = await csvBox.locator('.error').innerText();
+  await workspace.addBox("Create scale-free graph");
+  await workspace.setEnv("LynxScribe");
+  const csvBox = workspace.getBox("Create scale-free graph 1");
+  const errorText = await csvBox.locator(".error").innerText();
   expect(errorText).toBe('Operation "Create scale-free graph" not found.');
-  await workspace.setEnv('LynxKite Graph Analytics');
-  await expect(csvBox.locator('.error')).not.toBeVisible();
+  await workspace.setEnv("LynxKite Graph Analytics");
+  await expect(csvBox.locator(".error")).not.toBeVisible();
 });

lynxkite-app/web/tests/examples.spec.ts

@@ -1,57 +1,47 @@
 // Test the execution of the example workspaces
-import { test, expect } from '@playwright/test';
-import { Workspace } from './lynxkite';
+import { expect, test } from "@playwright/test";
+import { Workspace } from "./lynxkite";
 
-
-test('LynxKite Graph Analytics example', async ({ page }) => {
-    const ws = await Workspace.open(page, "NetworkX demo");
-    expect(await ws.isErrorFree(process.env.CI? 2000: 1000)).toBeTruthy();
+test("LynxKite Graph Analytics example", async ({ page }) => {
+  const ws = await Workspace.open(page, "NetworkX demo");
+  expect(await ws.isErrorFree(process.env.CI ? 2000 : 1000)).toBeTruthy();
 });
 
-
-test('Pytorch example', async ({ page }) => {
-    const ws = await Workspace.open(page, "PyTorch demo");
-    expect(await ws.isErrorFree()).toBeTruthy();
+test("Pytorch example", async ({ page }) => {
+  const ws = await Workspace.open(page, "PyTorch demo");
+  expect(await ws.isErrorFree()).toBeTruthy();
 });
 
-
-test.fail('AIMO example', async ({ page }) => {
-    // Fails because of missing OPENAI_API_KEY
-    const ws = await Workspace.open(page, "AIMO");
-    expect(await ws.isErrorFree()).toBeTruthy();
+test.fail("AIMO example", async ({ page }) => {
+  // Fails because of missing OPENAI_API_KEY
+  const ws = await Workspace.open(page, "AIMO");
+  expect(await ws.isErrorFree()).toBeTruthy();
 });
 
-test.fail('LynxScribe example', async ({ page }) => {
-    // Fails because of missing OPENAI_API_KEY
-    const ws = await Workspace.open(page, "LynxScribe demo");
-    expect(await ws.isErrorFree()).toBeTruthy();
+test.fail("LynxScribe example", async ({ page }) => {
+  // Fails because of missing OPENAI_API_KEY
+  const ws = await Workspace.open(page, "LynxScribe demo");
+  expect(await ws.isErrorFree()).toBeTruthy();
 });
 
-
-test.fail('Graph RAG', async ({ page }) => {
-    // Fails due to some issue with ChromaDB
-    const ws = await Workspace.open(page, "Graph RAG");
-    expect(await ws.isErrorFree(process.env.CI? 2000: 500)).toBeTruthy();
+test.fail("Graph RAG", async ({ page }) => {
+  // Fails due to some issue with ChromaDB
+  const ws = await Workspace.open(page, "Graph RAG");
+  expect(await ws.isErrorFree(process.env.CI ? 2000 : 500)).toBeTruthy();
 });
 
-
-test.fail('RAG chatbot app', async ({ page }) => {
-    // Fail due to all operation being unknown
-    const ws = await Workspace.open(page, "RAG chatbot app");
-    expect(await ws.isErrorFree()).toBeTruthy();
+test.fail("RAG chatbot app", async ({ page }) => {
+  // Fail due to all operation being unknown
+  const ws = await Workspace.open(page, "RAG chatbot app");
+  expect(await ws.isErrorFree()).toBeTruthy();
 });
 
-
-test.fail('night demo', async ({ page }) => {
-    // airlines.graphml file not found
-    // requires cugraph
-    const ws = await Workspace.open(page, "night demo");
-    expect(await ws.isErrorFree(process.env.CI? 10000: 500)).toBeTruthy();
+test("Airlines demo", async ({ page }) => {
+  const ws = await Workspace.open(page, "Airlines demo");
+  expect(await ws.isErrorFree(process.env.CI ? 10000 : 500)).toBeTruthy();
 });
 
-
-test('Pillow example', async ({ page }) => {
-    const ws = await Workspace.open(page, "Image processing");
-    expect(await ws.isErrorFree()).toBeTruthy();
+test("Pillow example", async ({ page }) => {
+  const ws = await Workspace.open(page, "Image processing");
+  expect(await ws.isErrorFree()).toBeTruthy();
 });
-

lynxkite-app/web/tests/lynxkite.ts

@@ -1,15 +1,12 @@
 // Shared testing utilities.
-import { expect, Locator, Page } from '@playwright/test';
-
+import { type Locator, type Page, expect } from "@playwright/test";
 
 // Mirrors the "id" filter.
 export function toId(x) {
-  return x.toLowerCase().replace(/[ !?,./]/g, '-');
+  return x.toLowerCase().replace(/[ !?,./]/g, "-");
 }
 
-
-export const ROOT = 'automated-tests';
-
+export const ROOT = "automated-tests";
 
 export class Workspace {
   readonly page: Page;
@@ -31,12 +28,12 @@ export class Workspace {
     const ws = await splash.openWorkspace(workspaceName);
     await ws.waitForNodesToLoad();
     await ws.expectCurrentWorkspaceIs(workspaceName);
-    return ws
+    return ws;
   }
 
   async getEnvs() {
     // Return all available workspace environments
-    const envs =  this.page.locator('select[name="workspace-env"] option');
+    const envs = this.page.locator('select[name="workspace-env"] option');
     await expect(envs).not.toHaveCount(0);
     return await envs.allInnerTexts();
   }
@@ -46,13 +43,13 @@ export class Workspace {
   }
 
   async expectCurrentWorkspaceIs(name) {
-    await expect(this.page.locator('.ws-name')).toHaveText(name);
+    await expect(this.page.locator(".ws-name")).toHaveText(name);
   }
 
   async waitForNodesToLoad() {
     // This method should be used only on non empty workspaces
-    await this.page.locator('.react-flow__nodes').waitFor();
-    await this.page.locator('.react-flow__node').first().waitFor();
+    await this.page.locator(".react-flow__nodes").waitFor();
+    await this.page.locator(".react-flow__node").first().waitFor();
   }
 
   async addBox(boxName) {
@@ -63,28 +60,32 @@ export class Workspace {
       const numNodes = allBoxes.length;
       await this.page.mouse.wheel(0, numNodes * 500);
     }
-    
+
     // Some x,y offset, otherwise the box handle may fall outside the viewport.
-    await this.page.locator('.react-flow__pane').click({ position: { x: 20, y: 20 }});
-    await this.page.locator('.node-search').getByText(boxName).click();
-    await this.page.keyboard.press('Escape');
+    await this.page
+      .locator(".react-flow__pane")
+      .click({ position: { x: 20, y: 20 } });
+    await this.page.locator(".node-search").getByText(boxName).click();
+    await this.page.keyboard.press("Escape");
     // Workaround to wait for the deselection animation after choosing a box. Otherwise, the next box will not be added.
-    await new Promise(resolve => setTimeout(resolve, 200));
+    await new Promise((resolve) => setTimeout(resolve, 200));
   }
 
   async getCatalog() {
-    await this.page.locator('.react-flow__pane').click();
-    const catalog =  await this.page.locator('.node-search .matches .search-result').allInnerTexts();
+    await this.page.locator(".react-flow__pane").click();
+    const catalog = await this.page
+      .locator(".node-search .matches .search-result")
+      .allInnerTexts();
     // Dismiss the catalog menu
-    await this.page.keyboard.press('Escape');
-    await new Promise(resolve => setTimeout(resolve, 200));
-    return catalog
+    await this.page.keyboard.press("Escape");
+    await new Promise((resolve) => setTimeout(resolve, 200));
+    return catalog;
   }
- 
+
   async deleteBoxes(boxIds: string[]) {
     for (const boxId of boxIds) {
-        await this.getBoxHandle(boxId).first().click();
-        await this.page.keyboard.press('Backspace');
+      await this.getBoxHandle(boxId).first().click();
+      await this.page.keyboard.press("Backspace");
     }
   }
 
@@ -93,36 +94,44 @@ export class Workspace {
   }
 
   getBoxes() {
-    return this.page.locator('.react-flow__node').all();
+    return this.page.locator(".react-flow__node").all();
   }
 
   getBoxHandle(boxId: string) {
     return this.page.getByTestId(boxId);
   }
 
-  async moveBox(boxId: string, offset? : {offsetX: number, offsetY:number}, targetPosition?: {x: number, y: number}) {
+  async moveBox(
+    boxId: string,
+    offset?: { offsetX: number; offsetY: number },
+    targetPosition?: { x: number; y: number },
+  ) {
     // Move a box around, it is a best effort operation, the exact target position may not be reached
     const box = await this.getBox(boxId).boundingBox();
-    if (!box) { 
-      return
+    if (!box) {
+      return;
     }
     const boxCenterX = box.x + box.width / 2;
     const boxCenterY = box.y + box.height / 2;
-    await this.page.mouse.move(boxCenterX,boxCenterY);
+    await this.page.mouse.move(boxCenterX, boxCenterY);
     await this.page.mouse.down();
     if (targetPosition) {
       await this.page.mouse.move(targetPosition.x, targetPosition.y);
     } else if (offset) {
       // Without steps the movement is too fast and the box is not dragged. The more steps,
       // the better the movement is captured
-      await this.page.mouse.move(boxCenterX + offset.offsetX, boxCenterY + offset.offsetY, {steps: 5});
+      await this.page.mouse.move(
+        boxCenterX + offset.offsetX,
+        boxCenterY + offset.offsetY,
+        { steps: 5 },
+      );
     }
     await this.page.mouse.up();
   }
 
   async connectBoxes(sourceId: string, targetId: string) {
-    const sourceHandle = this.getBoxHandle(sourceId)
-    const targetHandle = this.getBoxHandle(targetId)
+    const sourceHandle = this.getBoxHandle(sourceId);
+    const targetHandle = this.getBoxHandle(targetId);
     await sourceHandle.hover();
     await this.page.mouse.down();
     await targetHandle.hover();
@@ -132,34 +141,35 @@ export class Workspace {
   async isErrorFree(executionWaitTime?): Promise<boolean> {
     // TODO: Workaround, to account for workspace execution. Once
     // we have a load indicator we can use that instead.
-    await new Promise(resolve => setTimeout(resolve, executionWaitTime? executionWaitTime : 500));
+    await new Promise((resolve) =>
+      setTimeout(resolve, executionWaitTime ? executionWaitTime : 500),
+    );
     const boxes = await this.getBoxes();
     for (const box of boxes) {
-      if (await box.locator('.error').isVisible()) {
+      if (await box.locator(".error").isVisible()) {
         return false;
       }
     }
     return true;
   }
 
-  async close() { 
+  async close() {
     await this.page.locator('a[href="/dir/"]').click();
   }
 }
 
-
 export class Splash {
   page: Page;
   root: Locator;
-  
+
   constructor(page) {
     this.page = page;
-    this.root = page.locator('#splash');
+    this.root = page.locator("#splash");
   }
 
   // Opens the LynxKite directory browser in the root.
   static async open(page: Page): Promise<Splash> {
-    await page.goto('/');
+    await page.goto("/");
     await page.evaluate(() => {
       window.sessionStorage.clear();
       window.localStorage.clear();
@@ -170,26 +180,28 @@ export class Splash {
   }
 
   workspace(name: string) {
-    return this.page.getByRole('link', { name: name });
+    return this.page.getByRole("link", { name: name });
   }
 
   getEntry(name: string) {
-    return this.page.locator('.entry').filter({ hasText: name }).first();
+    return this.page.locator(".entry").filter({ hasText: name }).first();
   }
 
   async createWorkspace(name?: string) {
-    await this.page.getByRole('button', { name: 'New workspace' }).click();
+    await this.page.getByRole("button", { name: "New workspace" }).click();
     await this.page.locator('input[name="workspaceName"]').click();
     let workspaceName: string;
     if (name) {
       workspaceName = name;
       await this.page.locator('input[name="workspaceName"]').fill(name);
     } else {
-      workspaceName = await this.page.locator('input[name="workspaceName"]').inputValue();
+      workspaceName = await this.page
+        .locator('input[name="workspaceName"]')
+        .inputValue();
     }
-    await this.page.locator('input[name="workspaceName"]').press('Enter');
+    await this.page.locator('input[name="workspaceName"]').press("Enter");
     const ws = new Workspace(this.page, workspaceName);
-    await ws.setEnv('LynxKite Graph Analytics');
+    await ws.setEnv("LynxKite Graph Analytics");
     return ws;
   }
 
@@ -199,25 +211,24 @@ export class Splash {
   }
 
   async createFolder(folderName?: string) {
-    await this.page.getByRole('button', { name: 'New folder' }).click();
+    await this.page.getByRole("button", { name: "New folder" }).click();
     await this.page.locator('input[name="folderName"]').click();
     if (folderName) {
       await this.page.locator('input[name="folderName"]').fill(folderName);
     }
-    await this.page.locator('input[name="folderName"]').press('Enter');
+    await this.page.locator('input[name="folderName"]').press("Enter");
   }
 
   async deleteEntry(entryName: string) {
-    await this.getEntry(entryName).locator('button').click();
+    await this.getEntry(entryName).locator("button").click();
     await this.page.reload();
   }
 
   currentFolder() {
-    return this.page.locator('.current-folder');
+    return this.page.locator(".current-folder");
   }
 
   async goHome() {
     await this.page.locator('a[href="/dir/"]').click();
   }
-
 }

lynxkite-app/web/tests/upload.spec.ts

@@ -1,41 +1,43 @@
+import { dirname, join } from "node:path";
+import { fileURLToPath } from "node:url";
 // Test uploading a file in an import box.
-import { test, expect } from '@playwright/test';
-import { Splash, Workspace } from './lynxkite';
-import { join, dirname  } from 'path';
-import { fileURLToPath } from 'url';
-
+import { expect, test } from "@playwright/test";
+import { Splash, Workspace } from "./lynxkite";
 
 let workspace: Workspace;
 
-
 test.beforeEach(async ({ browser }) => {
-  workspace = await Workspace.empty(await browser.newPage(), 'upload_spec_test');
+  workspace = await Workspace.empty(
+    await browser.newPage(),
+    "upload_spec_test",
+  );
 });
 
-test.afterEach(async ({ }) => {
+test.afterEach(async () => {
   await workspace.close();
   const splash = await new Splash(workspace.page);
-  splash.page.on('dialog', async dialog => { await dialog.accept(); });
-  await splash.deleteEntry('upload_spec_test');
+  splash.page.on("dialog", async (dialog) => {
+    await dialog.accept();
+  });
+  await splash.deleteEntry("upload_spec_test");
 });
 
+test("can upload and import a simple CSV", async () => {
+  const __filename = fileURLToPath(import.meta.url);
+  const __dirname = dirname(__filename);
+  const csvPath = join(__dirname, "data", "upload_test.csv");
 
-test('can upload and import a simple CSV', async () => {
-    const __filename = fileURLToPath(import.meta.url);
-    const __dirname = dirname(__filename);
-    const csvPath = join(__dirname, 'data', 'upload_test.csv');
+  await workspace.addBox("Import CSV");
+  const csvBox = workspace.getBox("Import CSV 1");
+  const filenameInput = csvBox.locator("input.input-bordered").nth(0);
+  await filenameInput.click();
+  await filenameInput.fill(csvPath);
+  await filenameInput.press("Enter");
 
-    await workspace.addBox('Import CSV');
-    const csvBox =  workspace.getBox('Import CSV 1');
-    const filenameInput = csvBox.locator('input.input-bordered').nth(0);
-    await filenameInput.click();
-    await filenameInput.fill(csvPath);
-    await filenameInput.press('Enter');
-    
-    await workspace.addBox('View tables');
-    const tableBox = workspace.getBox('View tables 1');
-    await workspace.connectBoxes('Import CSV 1', 'View tables 1');
+  await workspace.addBox("View tables");
+  const tableBox = workspace.getBox("View tables 1");
+  await workspace.connectBoxes("Import CSV 1", "View tables 1");
 
-    const tableRows = tableBox.locator('table tbody tr');
-    await expect(tableRows).toHaveCount(4);
+  const tableRows = tableBox.locator("table tbody tr");
+  await expect(tableRows).toHaveCount(4);
 });

lynxkite-app/web/tsconfig.app.json

@@ -6,16 +6,12 @@
     "lib": ["ES2020", "DOM", "DOM.Iterable"],
     "module": "ESNext",
     "skipLibCheck": true,
-
-    /* Bundler mode */
     "moduleResolution": "bundler",
     "allowImportingTsExtensions": true,
     "isolatedModules": true,
     "moduleDetection": "force",
     "noEmit": true,
     "jsx": "react-jsx",
-
-    /* Linting */
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,

lynxkite-app/web/tsconfig.node.json

@@ -5,15 +5,11 @@
     "lib": ["ES2023"],
     "module": "ESNext",
     "skipLibCheck": true,
-
-    /* Bundler mode */
     "moduleResolution": "bundler",
     "allowImportingTsExtensions": true,
     "isolatedModules": true,
     "moduleDetection": "force",
     "noEmit": true,
-
-    /* Linting */
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,

lynxkite-app/web/vite.config.ts

@@ -1,6 +1,6 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react-swc'
-import Icons from 'unplugin-icons/vite'
+import react from "@vitejs/plugin-react-swc";
+import Icons from "unplugin-icons/vite";
+import { defineConfig } from "vite";
 
 // https://vite.dev/config/
 export default defineConfig({
@@ -10,21 +10,18 @@ export default defineConfig({
   esbuild: {
     supported: {
       // For dynamic imports.
-      'top-level-await': true,
+      "top-level-await": true,
     },
   },
-  plugins: [
-    react(),
-    Icons({ compiler: 'jsx', jsx: 'react' }),
-  ],
+  plugins: [react(), Icons({ compiler: "jsx", jsx: "react" })],
   server: {
     proxy: {
-      '/api': 'http://127.0.0.1:8000',
-      '/ws': {
-        target: 'ws://127.0.0.1:8000',
+      "/api": "http://127.0.0.1:8000",
+      "/ws": {
+        target: "ws://127.0.0.1:8000",
         ws: true,
         changeOrigin: true,
       },
     },
   },
-})
+});

lynxkite-core/src/lynxkite/core/workspace.py

@@ -65,7 +65,7 @@ async def execute(ws: Workspace):
 
 def save(ws: Workspace, path: str):
     """Persist a workspace to a local file in JSON format."""
-    j = ws.model_dump_json(indent=2)
+    j = ws.model_dump_json(indent=2) + "\n"
     dirname, basename = os.path.split(path)
     os.makedirs(dirname, exist_ok=True)
     # Create temp file in the same directory to make sure it's on the same filesystem.

lynxkite-graph-analytics/pyproject.toml

@@ -5,6 +5,7 @@ description = "The graph analytics executor and boxes for LynxKite"
 readme = "README.md"
 requires-python = ">=3.11"
 dependencies = [
+    "fsspec>=2025.2.0",
     "grand-cypher>=0.12.0",
     "joblib>=1.4.2",
     "lynxkite-core",

lynxkite-graph-analytics/src/lynxkite_graph_analytics/lynxkite_ops.py

@@ -1,7 +1,8 @@
 """Graph analytics operations. To be split into separate files when we have more."""
 
 import os
-from lynxkite.core import ops, workspace
+import fsspec
+from lynxkite.core import ops
 from collections import deque
 import dataclasses
 import functools
@@ -13,7 +14,6 @@ import pandas as pd
 import polars as pl
 import traceback
 import typing
-import zipfile
 
 mem = joblib.Memory("../joblib-cache")
 ENV = "LynxKite Graph Analytics"
@@ -178,6 +178,7 @@ def import_parquet(*, filename: str):
     return pd.read_parquet(filename)
 
 
+@mem.cache
 @op("Import CSV")
 def import_csv(
     *, filename: str, columns: str = "<from file>", separator: str = "<auto>"
@@ -192,26 +193,20 @@ def import_csv(
     )
 
 
-@op("Import GraphML")
 @mem.cache
+@op("Import GraphML")
 def import_graphml(*, filename: str):
     """Imports a GraphML file."""
-    if filename.endswith(".zip"):
-        with zipfile.ZipFile(filename, "r") as z:
-            for fn in z.namelist():
-                if fn.endswith(".graphml"):
-                    with z.open(fn) as f:
-                        G = nx.read_graphml(f)
-                        break
-            else:
-                raise ValueError("No GraphML file found in the ZIP archive.")
-    else:
-        G = nx.read_graphml(filename)
-    return G
+    files = fsspec.open_files(filename, compression="infer")
+    for f in files:
+        if ".graphml" in f.path:
+            with f as f:
+                return nx.read_graphml(f)
+    raise ValueError(f"No .graphml file found at {filename}")
 
 
-@op("Graph from OSM")
 @mem.cache
+@op("Graph from OSM")
 def import_osm(*, location: str):
     import osmnx as ox
 
@@ -234,7 +229,7 @@ def compute_pagerank(graph: nx.Graph, *, damping=0.85, iterations=100):
 @op("Compute betweenness centrality")
 @nx_node_attribute_func("betweenness_centrality")
 def compute_betweenness_centrality(graph: nx.Graph, *, k=10):
-    return nx.betweenness_centrality(graph, k=k, backend="cugraph")
+    return nx.betweenness_centrality(graph, k=k)
 
 
 @op("Discard loop edges")

lynxkite-graph-analytics/uv.lock

@@ -66,6 +66,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/0e/f6/65ecc6878a89bb1c23a086ea335ad4bf21a588990c3f535a227b9eea9108/charset_normalizer-3.4.1-py3-none-any.whl", hash = "sha256:d98b1668f06378c6dbefec3b92299716b931cd4e6061f3c875a71ced1780ab85", size = 49767 },
 ]
 
+[[package]]
+name = "colorama"
+version = "0.4.6"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/d8/53/6f443c9a4a8358a93a6792e2acffb9d9d5cb0a5cfd8802644b7b1c9a02e4/colorama-0.4.6.tar.gz", hash = "sha256:08695f5cb7ed6e0531a20572697297273c47b8cae5a63ffc6d6ed5c201be6e44", size = 27697 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/d1/d6/3965ed04c63042e047cb6a3e6ed1a63a35087b6a609aa3a15ed8ac56c221/colorama-0.4.6-py2.py3-none-any.whl", hash = "sha256:4f1d9991f5acc0ca119f9d443620b77f9d6b33703e51011c16baf57afb285fc6", size = 25335 },
+]
+
 [[package]]
 name = "contourpy"
 version = "1.3.1"
@@ -229,6 +238,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/99/3b/406d17b1f63e04a82aa621936e6e1c53a8c05458abd66300ac85ea7f9ae9/fonttools-4.55.3-py3-none-any.whl", hash = "sha256:f412604ccbeee81b091b420272841e5ec5ef68967a9790e80bffd0e30b8e2977", size = 1111638 },
 ]
 
+[[package]]
+name = "fsspec"
+version = "2025.2.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/b5/79/68612ed99700e6413de42895aa725463e821a6b3be75c87fcce1b4af4c70/fsspec-2025.2.0.tar.gz", hash = "sha256:1c24b16eaa0a1798afa0337aa0db9b256718ab2a89c425371f5628d22c3b6afd", size = 292283 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/e2/94/758680531a00d06e471ef649e4ec2ed6bf185356a7f9fbfbb7368a40bd49/fsspec-2025.2.0-py3-none-any.whl", hash = "sha256:9de2ad9ce1f85e1931858535bc882543171d197001a0a5eb2ddc04f1781ab95b", size = 184484 },
+]
+
 [[package]]
 name = "geopandas"
 version = "1.0.1"
@@ -275,6 +293,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/76/c6/c88e154df9c4e1a2a66ccf0005a88dfb2650c1dffb6f5ce603dfbd452ce3/idna-3.10-py3-none-any.whl", hash = "sha256:946d195a0d259cbba61165e88e65941f16e9b36ea6ddb97f00452bae8b1287d3", size = 70442 },
 ]
 
+[[package]]
+name = "iniconfig"
+version = "2.0.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/d7/4b/cbd8e699e64a6f16ca3a8220661b5f83792b3017d0f79807cb8708d33913/iniconfig-2.0.0.tar.gz", hash = "sha256:2d91e135bf72d31a410b17c16da610a82cb55f6b0477d1a902134b24a455b8b3", size = 4646 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/ef/a6/62565a6e1cf69e10f5727360368e451d4b7f58beeac6173dc9db836a5b46/iniconfig-2.0.0-py3-none-any.whl", hash = "sha256:b6a85871a79d2e3b22d2d1b94ac2824226a63c6b741c88f7ae975f18b6778374", size = 5892 },
+]
+
 [[package]]
 name = "joblib"
 version = "1.4.2"
@@ -404,37 +431,48 @@ name = "lynxkite-core"
 version = "0.1.0"
 source = { virtual = "../lynxkite-core" }
 
+[package.metadata]
+requires-dist = [{ name = "pytest", marker = "extra == 'dev'" }]
+
 [[package]]
 name = "lynxkite-graph-analytics"
 version = "0.1.0"
 source = { virtual = "." }
 dependencies = [
+    { name = "fsspec" },
     { name = "grand-cypher" },
     { name = "joblib" },
     { name = "lynxkite-core" },
     { name = "matplotlib" },
-    { name = "networkx" },
+    { name = "networkx", extra = ["default"] },
     { name = "osmnx" },
     { name = "pandas" },
     { name = "polars", extra = ["gpu"] },
 ]
 
 [package.optional-dependencies]
+dev = [
+    { name = "pytest" },
+    { name = "pytest-asyncio" },
+]
 gpu = [
     { name = "nx-cugraph-cu12" },
 ]
 
 [package.metadata]
 requires-dist = [
+    { name = "fsspec", specifier = ">=2025.2.0" },
     { name = "grand-cypher", specifier = ">=0.12.0" },
     { name = "joblib", specifier = ">=1.4.2" },
     { name = "lynxkite-core", virtual = "../lynxkite-core" },
     { name = "matplotlib", specifier = ">=3.10.0" },
-    { name = "networkx", specifier = ">=3.4.2" },
+    { name = "networkx", extras = ["default"], specifier = ">=3.4.2" },
     { name = "nx-cugraph-cu12", marker = "extra == 'gpu'", specifier = ">=24.12.0" },
     { name = "osmnx", specifier = ">=2.0.1" },
     { name = "pandas", specifier = ">=2.2.3" },
     { name = "polars", extras = ["gpu"], specifier = ">=1.14.0" },
+    { name = "pytest", marker = "extra == 'dev'", specifier = ">=8.3.4" },
+    { name = "pytest-asyncio", marker = "extra == 'dev'", specifier = ">=0.25.3" },
 ]
 
 [[package]]
@@ -489,6 +527,14 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/b9/54/dd730b32ea14ea797530a4479b2ed46a6fb250f682a9cfb997e968bf0261/networkx-3.4.2-py3-none-any.whl", hash = "sha256:df5d4365b724cf81b8c6a7312509d0c22386097011ad1abe274afd5e9d3bbc5f", size = 1723263 },
 ]
 
+[package.optional-dependencies]
+default = [
+    { name = "matplotlib" },
+    { name = "numpy" },
+    { name = "pandas" },
+    { name = "scipy" },
+]
+
 [[package]]
 name = "numba"
 version = "0.60.0"
@@ -747,6 +793,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/cf/6c/41c21c6c8af92b9fea313aa47c75de49e2f9a467964ee33eb0135d47eb64/pillow-11.1.0-cp313-cp313t-win_arm64.whl", hash = "sha256:67cd427c68926108778a9005f2a04adbd5e67c442ed21d95389fe1d595458756", size = 2377651 },
 ]
 
+[[package]]
+name = "pluggy"
+version = "1.5.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/96/2d/02d4312c973c6050a18b314a5ad0b3210edb65a906f868e31c111dede4a6/pluggy-1.5.0.tar.gz", hash = "sha256:2cffa88e94fdc978c4c574f15f9e59b7f4201d439195c3715ca9e2486f1d0cf1", size = 67955 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/88/5f/e351af9a41f866ac3f1fac4ca0613908d9a41741cfcf2228f4ad853b697d/pluggy-1.5.0-py3-none-any.whl", hash = "sha256:44e1ad92c8ca002de6377e165f3e0f1be63266ab4d554740532335b9d75ea669", size = 20556 },
+]
+
 [[package]]
 name = "polars"
 version = "1.14.0"
@@ -918,6 +973,33 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/f8/33/3c8c6302717096b54aa14ccbb271045ba04629e21cbf348f2f2dc94f69b4/pyproj-3.7.0-cp313-cp313-win_amd64.whl", hash = "sha256:10a8dc6ec61af97c89ff032647d743f8dc023645773da42ef43f7ae1125b3509", size = 6218036 },
 ]
 
+[[package]]
+name = "pytest"
+version = "8.3.4"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "colorama", marker = "sys_platform == 'win32'" },
+    { name = "iniconfig" },
+    { name = "packaging" },
+    { name = "pluggy" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/05/35/30e0d83068951d90a01852cb1cef56e5d8a09d20c7f511634cc2f7e0372a/pytest-8.3.4.tar.gz", hash = "sha256:965370d062bce11e73868e0335abac31b4d3de0e82f4007408d242b4f8610761", size = 1445919 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/11/92/76a1c94d3afee238333bc0a42b82935dd8f9cf8ce9e336ff87ee14d9e1cf/pytest-8.3.4-py3-none-any.whl", hash = "sha256:50e16d954148559c9a74109af1eaf0c945ba2d8f30f0a3d3335edde19788b6f6", size = 343083 },
+]
+
+[[package]]
+name = "pytest-asyncio"
+version = "0.25.3"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "pytest" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/f2/a8/ecbc8ede70921dd2f544ab1cadd3ff3bf842af27f87bbdea774c7baa1d38/pytest_asyncio-0.25.3.tar.gz", hash = "sha256:fc1da2cf9f125ada7e710b4ddad05518d4cee187ae9412e9ac9271003497f07a", size = 54239 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/67/17/3493c5624e48fd97156ebaec380dcaafee9506d7e2c46218ceebbb57d7de/pytest_asyncio-0.25.3-py3-none-any.whl", hash = "sha256:9e89518e0f9bd08928f97a3482fdc4e244df17529460bc038291ccaf8f85c7c3", size = 19467 },
+]
+
 [[package]]
 name = "python-dateutil"
 version = "2.9.0.post0"
@@ -970,6 +1052,53 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/1d/f2/56faa578aefdab498f6eb73dde3316f99390769786e0cdbb6c7a6abbbf86/rmm_cu12-24.12.1-cp312-cp312-manylinux_2_24_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:a9460a386e34f1921c8d06204f320d705511de899ababb45302d314da036da5a", size = 1975053 },
 ]
 
+[[package]]
+name = "scipy"
+version = "1.15.2"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "numpy" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/b7/b9/31ba9cd990e626574baf93fbc1ac61cf9ed54faafd04c479117517661637/scipy-1.15.2.tar.gz", hash = "sha256:cd58a314d92838f7e6f755c8a2167ead4f27e1fd5c1251fd54289569ef3495ec", size = 59417316 }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/40/1f/bf0a5f338bda7c35c08b4ed0df797e7bafe8a78a97275e9f439aceb46193/scipy-1.15.2-cp311-cp311-macosx_10_13_x86_64.whl", hash = "sha256:92233b2df6938147be6fa8824b8136f29a18f016ecde986666be5f4d686a91a4", size = 38703651 },
+    { url = "https://files.pythonhosted.org/packages/de/54/db126aad3874601048c2c20ae3d8a433dbfd7ba8381551e6f62606d9bd8e/scipy-1.15.2-cp311-cp311-macosx_12_0_arm64.whl", hash = "sha256:62ca1ff3eb513e09ed17a5736929429189adf16d2d740f44e53270cc800ecff1", size = 30102038 },
+    { url = "https://files.pythonhosted.org/packages/61/d8/84da3fffefb6c7d5a16968fe5b9f24c98606b165bb801bb0b8bc3985200f/scipy-1.15.2-cp311-cp311-macosx_14_0_arm64.whl", hash = "sha256:4c6676490ad76d1c2894d77f976144b41bd1a4052107902238047fb6a473e971", size = 22375518 },
+    { url = "https://files.pythonhosted.org/packages/44/78/25535a6e63d3b9c4c90147371aedb5d04c72f3aee3a34451f2dc27c0c07f/scipy-1.15.2-cp311-cp311-macosx_14_0_x86_64.whl", hash = "sha256:a8bf5cb4a25046ac61d38f8d3c3426ec11ebc350246a4642f2f315fe95bda655", size = 25142523 },
+    { url = "https://files.pythonhosted.org/packages/e0/22/4b4a26fe1cd9ed0bc2b2cb87b17d57e32ab72c346949eaf9288001f8aa8e/scipy-1.15.2-cp311-cp311-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:6a8e34cf4c188b6dd004654f88586d78f95639e48a25dfae9c5e34a6dc34547e", size = 35491547 },
+    { url = "https://files.pythonhosted.org/packages/32/ea/564bacc26b676c06a00266a3f25fdfe91a9d9a2532ccea7ce6dd394541bc/scipy-1.15.2-cp311-cp311-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:28a0d2c2075946346e4408b211240764759e0fabaeb08d871639b5f3b1aca8a0", size = 37634077 },
+    { url = "https://files.pythonhosted.org/packages/43/c2/bfd4e60668897a303b0ffb7191e965a5da4056f0d98acfb6ba529678f0fb/scipy-1.15.2-cp311-cp311-musllinux_1_2_aarch64.whl", hash = "sha256:42dabaaa798e987c425ed76062794e93a243be8f0f20fff6e7a89f4d61cb3d40", size = 37231657 },
+    { url = "https://files.pythonhosted.org/packages/4a/75/5f13050bf4f84c931bcab4f4e83c212a36876c3c2244475db34e4b5fe1a6/scipy-1.15.2-cp311-cp311-musllinux_1_2_x86_64.whl", hash = "sha256:6f5e296ec63c5da6ba6fa0343ea73fd51b8b3e1a300b0a8cae3ed4b1122c7462", size = 40035857 },
+    { url = "https://files.pythonhosted.org/packages/b9/8b/7ec1832b09dbc88f3db411f8cdd47db04505c4b72c99b11c920a8f0479c3/scipy-1.15.2-cp311-cp311-win_amd64.whl", hash = "sha256:597a0c7008b21c035831c39927406c6181bcf8f60a73f36219b69d010aa04737", size = 41217654 },
+    { url = "https://files.pythonhosted.org/packages/4b/5d/3c78815cbab499610f26b5bae6aed33e227225a9fa5290008a733a64f6fc/scipy-1.15.2-cp312-cp312-macosx_10_13_x86_64.whl", hash = "sha256:c4697a10da8f8765bb7c83e24a470da5797e37041edfd77fd95ba3811a47c4fd", size = 38756184 },
+    { url = "https://files.pythonhosted.org/packages/37/20/3d04eb066b471b6e171827548b9ddb3c21c6bbea72a4d84fc5989933910b/scipy-1.15.2-cp312-cp312-macosx_12_0_arm64.whl", hash = "sha256:869269b767d5ee7ea6991ed7e22b3ca1f22de73ab9a49c44bad338b725603301", size = 30163558 },
+    { url = "https://files.pythonhosted.org/packages/a4/98/e5c964526c929ef1f795d4c343b2ff98634ad2051bd2bbadfef9e772e413/scipy-1.15.2-cp312-cp312-macosx_14_0_arm64.whl", hash = "sha256:bad78d580270a4d32470563ea86c6590b465cb98f83d760ff5b0990cb5518a93", size = 22437211 },
+    { url = "https://files.pythonhosted.org/packages/1d/cd/1dc7371e29195ecbf5222f9afeedb210e0a75057d8afbd942aa6cf8c8eca/scipy-1.15.2-cp312-cp312-macosx_14_0_x86_64.whl", hash = "sha256:b09ae80010f52efddb15551025f9016c910296cf70adbf03ce2a8704f3a5ad20", size = 25232260 },
+    { url = "https://files.pythonhosted.org/packages/f0/24/1a181a9e5050090e0b5138c5f496fee33293c342b788d02586bc410c6477/scipy-1.15.2-cp312-cp312-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:5a6fd6eac1ce74a9f77a7fc724080d507c5812d61e72bd5e4c489b042455865e", size = 35198095 },
+    { url = "https://files.pythonhosted.org/packages/c0/53/eaada1a414c026673eb983f8b4a55fe5eb172725d33d62c1b21f63ff6ca4/scipy-1.15.2-cp312-cp312-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:2b871df1fe1a3ba85d90e22742b93584f8d2b8e6124f8372ab15c71b73e428b8", size = 37297371 },
+    { url = "https://files.pythonhosted.org/packages/e9/06/0449b744892ed22b7e7b9a1994a866e64895363572677a316a9042af1fe5/scipy-1.15.2-cp312-cp312-musllinux_1_2_aarch64.whl", hash = "sha256:03205d57a28e18dfd39f0377d5002725bf1f19a46f444108c29bdb246b6c8a11", size = 36872390 },
+    { url = "https://files.pythonhosted.org/packages/6a/6f/a8ac3cfd9505ec695c1bc35edc034d13afbd2fc1882a7c6b473e280397bb/scipy-1.15.2-cp312-cp312-musllinux_1_2_x86_64.whl", hash = "sha256:601881dfb761311045b03114c5fe718a12634e5608c3b403737ae463c9885d53", size = 39700276 },
+    { url = "https://files.pythonhosted.org/packages/f5/6f/e6e5aff77ea2a48dd96808bb51d7450875af154ee7cbe72188afb0b37929/scipy-1.15.2-cp312-cp312-win_amd64.whl", hash = "sha256:e7c68b6a43259ba0aab737237876e5c2c549a031ddb7abc28c7b47f22e202ded", size = 40942317 },
+    { url = "https://files.pythonhosted.org/packages/53/40/09319f6e0f276ea2754196185f95cd191cb852288440ce035d5c3a931ea2/scipy-1.15.2-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:01edfac9f0798ad6b46d9c4c9ca0e0ad23dbf0b1eb70e96adb9fa7f525eff0bf", size = 38717587 },
+    { url = "https://files.pythonhosted.org/packages/fe/c3/2854f40ecd19585d65afaef601e5e1f8dbf6758b2f95b5ea93d38655a2c6/scipy-1.15.2-cp313-cp313-macosx_12_0_arm64.whl", hash = "sha256:08b57a9336b8e79b305a143c3655cc5bdbe6d5ece3378578888d2afbb51c4e37", size = 30100266 },
+    { url = "https://files.pythonhosted.org/packages/dd/b1/f9fe6e3c828cb5930b5fe74cb479de5f3d66d682fa8adb77249acaf545b8/scipy-1.15.2-cp313-cp313-macosx_14_0_arm64.whl", hash = "sha256:54c462098484e7466362a9f1672d20888f724911a74c22ae35b61f9c5919183d", size = 22373768 },
+    { url = "https://files.pythonhosted.org/packages/15/9d/a60db8c795700414c3f681908a2b911e031e024d93214f2d23c6dae174ab/scipy-1.15.2-cp313-cp313-macosx_14_0_x86_64.whl", hash = "sha256:cf72ff559a53a6a6d77bd8eefd12a17995ffa44ad86c77a5df96f533d4e6c6bb", size = 25154719 },
+    { url = "https://files.pythonhosted.org/packages/37/3b/9bda92a85cd93f19f9ed90ade84aa1e51657e29988317fabdd44544f1dd4/scipy-1.15.2-cp313-cp313-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:9de9d1416b3d9e7df9923ab23cd2fe714244af10b763975bea9e4f2e81cebd27", size = 35163195 },
+    { url = "https://files.pythonhosted.org/packages/03/5a/fc34bf1aa14dc7c0e701691fa8685f3faec80e57d816615e3625f28feb43/scipy-1.15.2-cp313-cp313-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:fb530e4794fc8ea76a4a21ccb67dea33e5e0e60f07fc38a49e821e1eae3b71a0", size = 37255404 },
+    { url = "https://files.pythonhosted.org/packages/4a/71/472eac45440cee134c8a180dbe4c01b3ec247e0338b7c759e6cd71f199a7/scipy-1.15.2-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:5ea7ed46d437fc52350b028b1d44e002646e28f3e8ddc714011aaf87330f2f32", size = 36860011 },
+    { url = "https://files.pythonhosted.org/packages/01/b3/21f890f4f42daf20e4d3aaa18182dddb9192771cd47445aaae2e318f6738/scipy-1.15.2-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:11e7ad32cf184b74380f43d3c0a706f49358b904fa7d5345f16ddf993609184d", size = 39657406 },
+    { url = "https://files.pythonhosted.org/packages/0d/76/77cf2ac1f2a9cc00c073d49e1e16244e389dd88e2490c91d84e1e3e4d126/scipy-1.15.2-cp313-cp313-win_amd64.whl", hash = "sha256:a5080a79dfb9b78b768cebf3c9dcbc7b665c5875793569f48bf0e2b1d7f68f6f", size = 40961243 },
+    { url = "https://files.pythonhosted.org/packages/4c/4b/a57f8ddcf48e129e6054fa9899a2a86d1fc6b07a0e15c7eebff7ca94533f/scipy-1.15.2-cp313-cp313t-macosx_10_13_x86_64.whl", hash = "sha256:447ce30cee6a9d5d1379087c9e474628dab3db4a67484be1b7dc3196bfb2fac9", size = 38870286 },
+    { url = "https://files.pythonhosted.org/packages/0c/43/c304d69a56c91ad5f188c0714f6a97b9c1fed93128c691148621274a3a68/scipy-1.15.2-cp313-cp313t-macosx_12_0_arm64.whl", hash = "sha256:c90ebe8aaa4397eaefa8455a8182b164a6cc1d59ad53f79943f266d99f68687f", size = 30141634 },
+    { url = "https://files.pythonhosted.org/packages/44/1a/6c21b45d2548eb73be9b9bff421aaaa7e85e22c1f9b3bc44b23485dfce0a/scipy-1.15.2-cp313-cp313t-macosx_14_0_arm64.whl", hash = "sha256:def751dd08243934c884a3221156d63e15234a3155cf25978b0a668409d45eb6", size = 22415179 },
+    { url = "https://files.pythonhosted.org/packages/74/4b/aefac4bba80ef815b64f55da06f62f92be5d03b467f2ce3668071799429a/scipy-1.15.2-cp313-cp313t-macosx_14_0_x86_64.whl", hash = "sha256:302093e7dfb120e55515936cb55618ee0b895f8bcaf18ff81eca086c17bd80af", size = 25126412 },
+    { url = "https://files.pythonhosted.org/packages/b1/53/1cbb148e6e8f1660aacd9f0a9dfa2b05e9ff1cb54b4386fe868477972ac2/scipy-1.15.2-cp313-cp313t-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:7cd5b77413e1855351cdde594eca99c1f4a588c2d63711388b6a1f1c01f62274", size = 34952867 },
+    { url = "https://files.pythonhosted.org/packages/2c/23/e0eb7f31a9c13cf2dca083828b97992dd22f8184c6ce4fec5deec0c81fcf/scipy-1.15.2-cp313-cp313t-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:6d0194c37037707b2afa7a2f2a924cf7bac3dc292d51b6a925e5fcb89bc5c776", size = 36890009 },
+    { url = "https://files.pythonhosted.org/packages/03/f3/e699e19cabe96bbac5189c04aaa970718f0105cff03d458dc5e2b6bd1e8c/scipy-1.15.2-cp313-cp313t-musllinux_1_2_aarch64.whl", hash = "sha256:bae43364d600fdc3ac327db99659dcb79e6e7ecd279a75fe1266669d9a652828", size = 36545159 },
+    { url = "https://files.pythonhosted.org/packages/af/f5/ab3838e56fe5cc22383d6fcf2336e48c8fe33e944b9037fbf6cbdf5a11f8/scipy-1.15.2-cp313-cp313t-musllinux_1_2_x86_64.whl", hash = "sha256:f031846580d9acccd0044efd1a90e6f4df3a6e12b4b6bd694a7bc03a89892b28", size = 39136566 },
+    { url = "https://files.pythonhosted.org/packages/0a/c8/b3f566db71461cabd4b2d5b39bcc24a7e1c119535c8361f81426be39bb47/scipy-1.15.2-cp313-cp313t-win_amd64.whl", hash = "sha256:fe8a9eb875d430d81755472c5ba75e84acc980e4a8f6204d402849234d3017db", size = 40477705 },
+]
+
 [[package]]
 name = "shapely"
 version = "2.0.7"