use FileStub and DirectoryStub instead of File/Directory

Author: Rich-Harris

src/lib/client/viewer/Editor.svelte

@@ -6,7 +6,7 @@
 	import htmlWorker from 'monaco-editor/esm/vs/language/html/html.worker?worker';
 	import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker';
 
-	/** @type {import('$lib/types').File | null} */
+	/** @type {import('$lib/types').FileStub | null} */
 	export let file;
 
 	const dispatch = createEventDispatcher();

src/lib/client/viewer/FileTree/File.svelte

@@ -1,7 +1,7 @@
 <script>
 	import { getContext } from 'svelte';
 
-	/** @type {import('$lib/types').File} */
+	/** @type {import('$lib/types').FileStub} */
 	export let file;
 
 	const { select, selected } = getContext('filetree');

src/lib/client/viewer/FileTree/Folder.svelte

@@ -13,14 +13,14 @@
 	/** @type {number} */
 	export let depth;
 
-	/** @type {Array<import('$lib/types').File | import('$lib/types').Directory>} */
+	/** @type {Array<import('$lib/types').Stub>} */
 	export let files;
 
 	$: children = files.filter((file) => file.name.startsWith(prefix));
 	$: child_directories = children.filter(
 		(child) => child.depth === depth + 1 && child.type === 'directory'
 	);
-	$: child_files = /** @type {import('$lib/types').File[]} */ (
+	$: child_files = /** @type {import('$lib/types').FileStub[]} */ (
 		children.filter((child) => child.depth === depth + 1 && child.type === 'file')
 	);
 

src/lib/server/content.js

@@ -143,7 +143,7 @@ function extract_frontmatter(markdown, dir) {
  * @param {string} cwd - the directory to walk
  */
 export function walk(cwd) {
-	/** @type {Record<string, import('$lib/types').File | import('$lib/types').Directory>} */
+	/** @type {Record<string, import('$lib/types').FileStub | import('$lib/types').DirectoryStub>} */
 	const result = {};
 
 	if (!fs.existsSync(cwd)) return result;

src/lib/types/index.d.ts

@@ -1,4 +1,4 @@
-export interface File {
+export interface FileStub {
 	type: 'file';
 	name: string;
 	basename: string;
@@ -7,16 +7,18 @@ export interface File {
 	depth: number;
 }
 
-export interface Directory {
+export interface DirectoryStub {
 	type: 'directory';
 	name: string;
 	basename: string;
 	depth: number;
 }
 
+export type Stub = FileStub | DirectoryStub;
+
 export interface Adapter {
 	base: string;
-	update(files: Array<File | Directory>): Promise<void>;
+	update(files: Array<Stub>): Promise<void>;
 	destroy(): Promise<void>;
 }
 
@@ -34,8 +36,8 @@ export interface Section {
 	prev: string | null;
 	next: string | null;
 	html: string;
-	a: Record<string, File | Directory>;
-	b: Record<string, File | Directory>;
+	a: Record<string, Stub>;
+	b: Record<string, Stub>;
 }
 
 export type SectionIndex = Array<{

src/routes/backend/[id].js

@@ -33,7 +33,7 @@ export async function put({ request, params, url }) {
 
 	const dir = `.apps/${id}`;
 
-	/** @type {Array<import('$lib/types').File | import('$lib/types').Directory>} */
+	/** @type {Array<import('$lib/types').FileStub | import('$lib/types').DirectoryStub>} */
 	const files = await request.json();
 
 	const app = apps.get(id);

src/routes/tutorial/[slug]/index.svelte

@@ -31,21 +31,21 @@
 	/** @type {import('svelte/store').Writable<import('$lib/types').Section>}*/
 	const current = writable(section);
 
-	/** @type {import('svelte/store').Writable<Array<import('$lib/types').File | import('$lib/types').Directory>>} */
+	/** @type {import('svelte/store').Writable<import('$lib/types').Stub[]>} */
 	const files = writable([]);
 
 	/** @type {import('svelte/store').Writable<import('monaco-editor').editor.ITextModel[]>} */
 	const models = writable([]);
 
-	/** @type {import('svelte/store').Writable<import('$lib/types').File | null>} */
+	/** @type {import('svelte/store').Writable<import('$lib/types').Stub | null>} */
 	const selected = writable(null);
 
 	const started = writable(false);
 
 	const base = writable('');
 
 	setContext('filetree', {
-		/** @param {import('$lib/types').File} file */
+		/** @param {import('$lib/types').FileStub} file */
 		select: (file) => {
 			selected.set(file);
 		},
@@ -62,7 +62,7 @@
 
 		base,
 
-		/** @param {Array<import('$lib/types').File | import('$lib/types').Directory>} data */
+		/** @param {import('$lib/types').Stub[]} data */
 		async update(data) {
 			await ready;
 			await adapter.update(data);
@@ -116,6 +116,8 @@
 	afterNavigate(async () => {
 		const data = Object.values(section.a);
 
+		console.log(section.a);
+
 		files.set(data);
 
 		for (const model of $models) model.dispose();
@@ -141,7 +143,7 @@
 		});
 
 		selected.set(
-			/** @type {import('$lib/types').File} */ (
+			/** @type {import('$lib/types').FileStub} */ (
 				data.find((file) => file.name === section.chapter.focus)
 			)
 		);