feat(fs): improved API (#751)

* feat(fs): improved API

* fmt

* fix unix builds

* again

* clippy

* clippy

* fix import in docs examples

* fmt, clippy

* Update linux.rs

* add API for watch

* fix with `watcher` feature flag

* use baseDir for all commands

* do not export close function

* fix build

* organize and address review comments

* fmt

* generated files

* rename FsFile to FileHandle, move APIs and docs

* extend example

* extend `Resource`

* actually extend it

---------

Co-authored-by: FabianLars <fabianlars@fabianlars.de>
Co-authored-by: Lucas Nogueira <lucas@tauri.studio>

examples/api/src/views/FileSystem.svelte

@@ -1,17 +1,14 @@
 <script>
-  import {
-    readBinaryFile,
-    writeTextFile,
-    readDir,
-    Dir,
-  } from "@tauri-apps/plugin-fs";
+  import * as fs from "@tauri-apps/plugin-fs";
   import { convertFileSrc } from "@tauri-apps/api/core";
 
   export let onMessage;
   export let insecureRenderHtml;
 
-  let pathToRead = "";
+  let path = "";
   let img;
+  let file;
+  let renameTo;
 
   function getDir() {
     const dirSelect = document.getElementById("dir");
@@ -30,56 +27,123 @@
     reader.readAsDataURL(blob);
   }
 
-  const DirOptions = Object.keys(Dir)
+  const DirOptions = Object.keys(fs.BaseDirectory)
     .filter((key) => isNaN(parseInt(key)))
-    .map((dir) => [dir, Dir[dir]]);
+    .map((dir) => [dir, fs.BaseDirectory[dir]]);
+
+  function open() {
+    fs.open(path, {
+      baseDir: getDir(),
+      read: true,
+      write: true,
+      create: true,
+    })
+      .then((f) => {
+        file = f;
+        onMessage(`Opened ${path}`);
+      })
+      .catch(onMessage);
+  }
+
+  function mkdir() {
+    fs.mkdir(path, { baseDir: getDir() })
+      .then(() => {
+        onMessage(`Created dir ${path}`);
+      })
+      .catch(onMessage);
+  }
+
+  function remove() {
+    fs.remove(path, { baseDir: getDir() })
+      .then(() => {
+        onMessage(`Removed ${path}`);
+      })
+      .catch(onMessage);
+  }
+
+  function rename() {
+    fs.rename(path, renameTo, {
+      oldPathBaseDir: getDir(),
+      newPathBaseDir: getDir(),
+    })
+      .then(() => {
+        onMessage(`Renamed ${path} to ${renameTo}`);
+      })
+      .catch(onMessage);
+  }
+
+  function truncate() {
+    file
+      .truncate(0)
+      .then(() => {
+        onMessage(`Truncated file`);
+      })
+      .catch(onMessage);
+  }
+
+  function stat() {
+    file
+      .stat()
+      .then((stat) => {
+        onMessage(`File stat ${JSON.stringify(stat)}`);
+      })
+      .catch(onMessage);
+  }
 
   function read() {
-    const isFile = pathToRead.match(/\S+\.\S+$/g);
     const opts = {
-      dir: getDir(),
+      baseDir: getDir(),
     };
-    const promise = isFile
-      ? readBinaryFile(pathToRead, opts)
-      : readDir(pathToRead, opts);
-    promise
-      .then(function (response) {
-        if (isFile) {
-          if (pathToRead.includes(".png") || pathToRead.includes(".jpg")) {
-            arrayBufferToBase64(new Uint8Array(response), function (base64) {
-              const src = "data:image/png;base64," + base64;
-              insecureRenderHtml('<img src="' + src + '"></img>');
-            });
-          } else {
-            const value = String.fromCharCode.apply(null, response);
-            insecureRenderHtml(
-              '<textarea id="file-response"></textarea><button id="file-save">Save</button>'
-            );
-            setTimeout(() => {
-              const fileInput = document.getElementById("file-response");
-              fileInput.value = value;
-              document
-                .getElementById("file-save")
-                .addEventListener("click", function () {
-                  writeTextFile(pathToRead, fileInput.value, {
-                    dir: getDir(),
-                  }).catch(onMessage);
+    fs.stat(path, opts)
+      .then((stat) => {
+        const isFile = stat.isFile;
+
+        const promise = isFile
+          ? fs.readFile(path, opts)
+          : fs.readDir(path, opts);
+        promise
+          .then(function (response) {
+            if (isFile) {
+              if (path.includes(".png") || path.includes(".jpg")) {
+                arrayBufferToBase64(
+                  new Uint8Array(response),
+                  function (base64) {
+                    const src = "data:image/png;base64," + base64;
+                    insecureRenderHtml('<img src="' + src + '"></img>');
+                  }
+                );
+              } else {
+                const value = String.fromCharCode.apply(null, response);
+                insecureRenderHtml(
+                  '<textarea id="file-response"></textarea><button id="file-save">Save</button>'
+                );
+                setTimeout(() => {
+                  const fileInput = document.getElementById("file-response");
+                  fileInput.value = value;
+                  document
+                    .getElementById("file-save")
+                    .addEventListener("click", function () {
+                      fs.writeTextFile(path, fileInput.value, {
+                        dir: getDir(),
+                      }).catch(onMessage);
+                    });
                 });
-            });
-          }
-        } else {
-          onMessage(response);
-        }
+              }
+            } else {
+              onMessage(response);
+            }
+          })
+          .catch(onMessage);
       })
       .catch(onMessage);
   }
 
   function setSrc() {
-    img.src = convertFileSrc(pathToRead);
+    img.src = convertFileSrc(path);
   }
 </script>
 
-<form class="flex flex-col" on:submit|preventDefault={read}>
+<div class="flex flex-col">
   <div class="flex gap-1">
     <select class="input" id="dir">
       <option value="">None</option>
@@ -89,17 +153,29 @@
     </select>
     <input
       class="input grow"
-      id="path-to-read"
       placeholder="Type the path to read..."
-      bind:value={pathToRead}
+      bind:value={path}
     />
   </div>
   <br />
   <div>
-    <button class="btn" id="read">Read</button>
+    <button class="btn" on:click={open}>Open</button>
+    <button class="btn" on:click={read}>Read</button>
+    <button class="btn" on:click={mkdir}>Mkdir</button>
+    <button class="btn" on:click={remove}>Remove</button>
+    <div class="flex flex-row">
+      <button class="btn" on:click={rename}>Rename</button>
+      <input class="input" bind:value={renameTo} placeholder="To" />
+    </div>
     <button class="btn" type="button" on:click={setSrc}>Use as img src</button>
   </div>
-</form>
+  {#if file}
+    <div>
+      <button class="btn" on:click={truncate}>Truncate</button>
+      <button class="btn" on:click={stat}>Stat</button>
+    </div>
+  {/if}
+</div>
 
 <br />