🚢 Web containers

src/lib/utils/Runner/ContainerBuilder.ts

@@ -6,23 +6,44 @@ class ContainerBuilder {
 	fileSystem!: NodeFileSystemManager;
 	container!: WebContainer;
 	isReady: boolean = false;
+	termianlData = ``
 
 	constructor() {
 		(async() => {
 			this.container = await WebContainer.boot();
 			this.fileSystem = new NodeFileSystemManager(this.container);
 
-			this.isReady = true;
-		})();
+			this.isReady = true
+		})()
+	}
+
+	async runCommand(command: string) {
+		if(!this.isReady) throw new Error("Sorry, Terminal is not ready yet")
+
+		const keywords = command.split(" ")
+
+		const cmd = keywords.shift()
+
+		if(!cmd) throw new Error("Cannot extract command prefix from the string")
+
+		const spawnProcess = await this.container.spawn(cmd, keywords)
+
+		let termData = this.termianlData
+
+		await spawnProcess.output.pipeTo(new WritableStream({
+			write(data) {
+				termData += `\n${data}`
+			}
+		}))
+
+		return spawnProcess.exit
 	}
 }
 
 let containerBuilderInstance: ContainerBuilder;
 
 export function getContainer() {
-	if (containerBuilderInstance) return containerBuilderInstance;
-
-	containerBuilderInstance = new ContainerBuilder();
+	if(!containerBuilderInstance) containerBuilderInstance = new ContainerBuilder()
 
-	return containerBuilderInstance;
+	return containerBuilderInstance
 }

src/lib/utils/Runner/NodeFileSystem.ts

@@ -10,15 +10,46 @@ export class NodeFileSystemManager {
 		this.container = container;
 	}
 
-	setFile(name: string, content: string, toDirectory?: string) {
-		// dumb code
-		void name;
-		void content;
-		void toDirectory;
-		throw new Error("Method to be implemented!");
+	addFiles(to: string, content: string) {
+		const arr = to.split("/")
+
+		if(arr.length === 1) {
+			this.files[to] = content
+			return
+		}
+
+		// assume last item is file name
+		const [first, last] = [arr.shift(), arr.pop()]
+
+		if(!first || !last) throw new Error("Unknown Error: Unable to locate first and last items of an array")
+
+		this.files[first] = {}
+
+		if(arr.length === 0) {
+			this.files[last] = content
+			return
+		}
+
+		// recurrsion baby
+		const getFiles = (dir: string[], filesObj: Record<string, any>) => {
+			if(dir.length === 1) {
+				filesObj[dir[0]] = content
+
+				return
+			}
+
+			const first = dir.shift() as string
+
+			filesObj[first] = {}
+
+			getFiles(dir, filesObj[first])
+		}
+
+		getFiles(arr, this.files)
 	}
 
 	compileFiles() {
-		this.container.mount(this.files);
+		// I need to find a more efficient way to do this
+		// this.container.mount(this.files);
 	}
 }

vite.config.ts

@@ -5,5 +5,12 @@ export default defineConfig({
 	plugins: [sveltekit()],
 	test: {
 		include: ["src/**/*.{test,spec}.{js,ts}"]
-	}
+	},
+	// REQUIRED FOR WEB CONTAINERS! DO NOT REMOVE
+	server: {
+		headers: {
+		  'Cross-Origin-Embedder-Policy': 'require-corp',
+		  'Cross-Origin-Opener-Policy': 'same-origin',
+		},
+	},
 });