Delete files when deleting a project

src/app/components/generator/ProjectCreation.tsx

@@ -6,7 +6,7 @@ import { useSpyglass } from '../../contexts/Spyglass.jsx'
 import type { VersionId } from '../../services/index.js'
 import { DEFAULT_VERSION } from '../../services/index.js'
 import { PROJECTS_URI } from '../../services/Spyglass.js'
-import { hexId, readZip } from '../../Utils.js'
+import { hexId, message, readZip } from '../../Utils.js'
 import { Btn, BtnMenu, FileUpload, Octicon, TextInput } from '../index.js'
 import { Modal } from '../Modal.js'
 
@@ -45,8 +45,9 @@ export function ProjectCreation() {
 					return client.fs.writeFile(rootUri + path, entry[1])
 				}))
 				hideModal()
-			}).catch(() => {
+			}).catch((e) => {
 				// TODO: handle errors
+				console.warn(`Error importing data pack: ${message(e)}`)
 				hideModal()
 			})
 		} else {

src/app/contexts/Project.tsx

@@ -2,7 +2,7 @@ import type { ComponentChildren } from 'preact'
 import { createContext } from 'preact'
 import { useCallback, useContext, useEffect, useMemo, useState } from 'preact/hooks'
 import type { VersionId } from '../services/index.js'
-import { ROOT_URI } from '../services/Spyglass.js'
+import { ROOT_URI, SpyglassClient } from '../services/Spyglass.js'
 import { Store } from '../Store.js'
 
 export type ProjectMeta = {
@@ -93,8 +93,19 @@ export function ProjectProvider({ children }: { children: ComponentChildren }) {
 		changeProjects([...projects, project])
 	}, [projects])
 
-	const deleteProject = useCallback((name: string) => {
+	const deleteProject = useCallback(async (name: string) => {
 		if (name === DRAFT_PROJECT.name) return
+		const project = projects.find(p => p.name === name)
+		if (project) {
+			const projectRoot = getProjectRoot(project)
+			const entries = await SpyglassClient.FS.readdir(projectRoot)
+			await Promise.all(entries.flatMap(async e => {
+				if (e.name.startsWith(projectRoot)) {
+					return [await SpyglassClient.FS.unlink(e.name)]
+				}
+				return []
+			}))
+		}
 		changeProjects(projects.filter(p => p.name !== name))
 		setOpenProject(undefined)
 	}, [projects])

src/app/services/Spyglass.ts

@@ -48,16 +48,15 @@ interface ClientDocument {
 }
 
 export class SpyglassClient {
-	public readonly fs = new MixedFileSystem(new IndexedDbFileSystem(), [
-		// { prefix: DEPENDENCY_URI, fs: new MemoryFileSystem() },
-	])
+	public static readonly FS = new MixedFileSystem(new IndexedDbFileSystem(), [])
+	public readonly fs = SpyglassClient.FS
 	public readonly externals: core.Externals = {
 		...BrowserExternals,
 		archive: {
 			...BrowserExternals.archive,
 			decompressBall,
 		},
-		fs: this.fs,
+		fs: SpyglassClient.FS,
 	}
 
 	public readonly documents = new Map<string, ClientDocument>()