From cf51e1ffbb1dad5bce9ce0725e3f887894634f9a Mon Sep 17 00:00:00 2001
From: Yan Chen <48968912+chenyan-dfinity@users.noreply.github.com>
Date: Sun, 15 Sep 2024 13:30:05 -0700
Subject: [PATCH] fix

---
 src/App.tsx                            |  5 +----
 src/components/DeployModal.tsx         |  6 +++---
 src/components/Editor.tsx              |  2 +-
 src/components/FrontendDeployModal.tsx |  2 +-
 src/webcontainer.ts                    | 21 +++++++++++++++++++++
 5 files changed, 27 insertions(+), 9 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index c48df6d4..15ac60f7 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -231,10 +231,7 @@ export function App() {
     if (info.name) {
       const { env_files } = generateEnv({ [info.name]: info });
       Object.entries(env_files).forEach(([path, content]) => {
-        container.container!.fs.writeFile(
-          `user/${path}`,
-          content.file.contents,
-        );
+        container.writeFile(`user/${path}`, content.file.contents);
       });
     }
   };
diff --git a/src/components/DeployModal.tsx b/src/components/DeployModal.tsx
index 7a892914..b7ef8d8e 100644
--- a/src/components/DeployModal.tsx
+++ b/src/components/DeployModal.tsx
@@ -365,11 +365,11 @@ export function DeployModal({
             type: "saveFile",
             payload: { path: `${name}.d.ts`, contents: ts },
           });
-          await container.container!.fs.mkdir(`user/${bindingDir}`, {
+          await container.mkdir(`user/${bindingDir}`, {
             recursive: true,
           });
-          await container.container!.fs.writeFile(`user/${name}.js`, js);
-          await container.container!.fs.writeFile(`user/${name}.d.ts`, ts);
+          await container.writeFile(`user/${name}.js`, js);
+          await container.writeFile(`user/${name}.d.ts`, ts);
           logger.log(`Generated frontend bindings at ${name}.js`);
         }
         onDeploy(info);
diff --git a/src/components/Editor.tsx b/src/components/Editor.tsx
index 3d815e8a..50db63ad 100644
--- a/src/components/Editor.tsx
+++ b/src/components/Editor.tsx
@@ -153,7 +153,7 @@ export function Editor({
     });
     if (fileExtension !== "mo") {
       // TODO: will trap if path doesn't exist
-      await container.container!.fs.writeFile(`user/${fileName}`, newValue);
+      await container.writeFile(`user/${fileName}`, newValue);
     } else {
       await worker.Moc({ type: "save", file: fileName, content: newValue });
       await checkFileAddMarkers();
diff --git a/src/components/FrontendDeployModal.tsx b/src/components/FrontendDeployModal.tsx
index a87943fc..9061afd1 100644
--- a/src/components/FrontendDeployModal.tsx
+++ b/src/components/FrontendDeployModal.tsx
@@ -130,7 +130,7 @@ export function FrontendDeployModal({
         const principal = identity.getPrincipal();
         const args = IDL.encode([IDL.Principal], [principal]);
         await backend.callForward(info!, "authorize", args);
-        await container.container!.fs.writeFile(
+        await container.writeFile(
           "utils/identity.json",
           JSON.stringify(identity.toJSON()),
         );
diff --git a/src/webcontainer.ts b/src/webcontainer.ts
index b2656019..54a5797a 100644
--- a/src/webcontainer.ts
+++ b/src/webcontainer.ts
@@ -57,6 +57,27 @@ export class Container {
     };
     await this.container!.mount(files);
   }
+  async writeFile(
+    path: string,
+    contents: string | Uint8Array,
+    options?:
+      | string
+      | {
+          encoding?: string;
+        },
+  ) {
+    await this.init();
+    await this.container!.fs.writeFile(path, contents, options);
+  }
+  async mkdir(
+    path: string,
+    options?: {
+      recursive?: boolean;
+    },
+  ) {
+    await this.init();
+    await this.container!.fs.mkdir(path, options);
+  }
   private async spawn(cmd: string, args: string[], options?: SpawnOptions) {
     const new_options = {
       ...options,