Try deploying to github pages

Author: saulshanabrook

.github/workflows/publish.yml

@@ -5,35 +5,52 @@ on:
     branches:
       - main
     tags:
-      - '*'
+      - "*"
 
 jobs:
   build-and-publish:
     runs-on: ubuntu-latest
     permissions:
       contents: write
+      pages: write
+      id-token: write
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
     steps:
-    - uses: actions/checkout@v4
-    - uses: actions/setup-node@v4
-      with:
-        node-version: '22.x'
-        cache: 'yarn'
-        registry-url: 'https://npm.pkg.github.com'
-        scope: '@saulshanabrook'
-    - run: yarn install
-    - run: yarn build
-    - run: yarn pack -f package.tgz
-    - uses: softprops/action-gh-release@v2
-      if: startsWith(github.ref, 'refs/tags/')
-      with:
-        files: package.tgz
+      - uses: actions/checkout@v4
+        with:
+          submodules: true
+      - uses: actions/setup-node@v4
+        with:
+          node-version: "22.x"
+          cache: "yarn"
+          registry-url: "https://npm.pkg.github.com"
+          scope: "@saulshanabrook"
+      - run: yarn install
+      - run: yarn build
+      - run: yarn pack -f package.tgz
+      - uses: softprops/action-gh-release@v2
+        if: startsWith(github.ref, 'refs/tags/')
+        with:
+          files: package.tgz
+      - name: Setup Pages
+        uses: actions/configure-pages@v4
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          # Upload dist folder
+          path: "./dist"
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
   lint:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
-    - uses: actions/setup-node@v4
-      with:
-        node-version: '22.x'
-        cache: 'yarn'
-    - run: yarn install
-    - run: yarn lint
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: "22.x"
+          cache: "yarn"
+      - run: yarn install
+      - run: yarn lint

src/Monaco.tsx

@@ -4,9 +4,8 @@ import { startTransition, use, useEffect, useMemo, useState } from "react";
 import MonacoEditor from "react-monaco-editor";
 
 const modules = {
-  ...import.meta.glob("/examples/egraph-serialize/tests/*.json"),
-  ...import.meta.glob("/examples/extraction-gym/data/*/*.json"),
-  ...import.meta.glob("/examples/extraction-gym/test-data/*/*.json"),
+  ...import.meta.glob("/examples/egraph-serialize/tests/*.json", { query: "?raw" }),
+  ...import.meta.glob("/examples/extraction-gym/data/*/*.json", { query: "?raw" }),
 };
 
 function Monaco({ code, setCode }: { code: string; setCode: (code: string) => void }) {
@@ -25,7 +24,8 @@ function Monaco({ code, setCode }: { code: string; setCode: (code: string) => vo
   useEffect(() => {
     if (loadedPreset) {
       startTransition(() => {
-        setCode(JSON.stringify(loadedPreset, null, 2));
+        const codeStr = (loadedPreset as { default: string }).default;
+        setCode(JSON.stringify(JSON.parse(codeStr), null, 2));
         setLoadPreset(false);
       });
     }

vite.config.ts

@@ -1,17 +1,25 @@
-import { resolve } from 'path'
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
+import { resolve } from "path";
+import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
 
 // https://vitejs.dev/config/
 export default defineConfig({
+  base: "/egraph-visualizer/",
   plugins: [react()],
   build: {
     lib: {
-      entry: [resolve(__dirname, 'src/anywidget.tsx')],
-      formats: ['es', ],
+      entry: [resolve(__dirname, "src/anywidget.tsx")],
+      formats: ["es"],
+    },
+    rollupOptions: {
+      input: {
+        main: resolve(__dirname, "index.html"),
+        anywidget: resolve(__dirname, "src/anywidget.tsx"),
+      },
     },
   },
+
   define: {
-    'process.env': {},
-  }
-})
+    "process.env": {},
+  },
+});