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/App.svelte

@@ -19,7 +19,7 @@
   import Scanner from "./views/Scanner.svelte";
   import Biometric from "./views/Biometric.svelte";
 
-  import { onMount } from "svelte";
+  import { onMount, tick } from "svelte";
   import { ask } from "@tauri-apps/plugin-dialog";
   import Nfc from "./views/Nfc.svelte";
 
@@ -178,30 +178,35 @@
 
   // Console
   let messages = writable([]);
-  function onMessage(value) {
+  let consoleTextEl;
+  async function onMessage(value) {
     messages.update((r) => [
+      ...r,
       {
         html:
           `<pre><strong class="text-accent dark:text-darkAccent">[${new Date().toLocaleTimeString()}]:</strong> ` +
           (typeof value === "string" ? value : JSON.stringify(value, null, 1)) +
           "</pre>",
       },
-      ...r,
     ]);
+    await tick();
+    if (consoleTextEl) consoleTextEl.scrollTop = consoleTextEl.scrollHeight;
   }
 
   // this function is renders HTML without sanitizing it so it's insecure
   // we only use it with our own input data
-  function insecureRenderHtml(html) {
+  async function insecureRenderHtml(html) {
     messages.update((r) => [
+      ...r,
       {
         html:
           `<pre><strong class="text-accent dark:text-darkAccent">[${new Date().toLocaleTimeString()}]:</strong> ` +
           html +
           "</pre>",
       },
-      ...r,
     ]);
+    await tick();
+    if (consoleTextEl) consoleTextEl.scrollTop = consoleTextEl.scrollHeight;
   }
 
   function clear() {
@@ -486,7 +491,7 @@
           <div class="i-codicon-clear-all" />
         </div>
       </div>
-      <div class="px-2 overflow-y-auto all:font-mono code-block all:text-xs">
+      <div bind:this={consoleTextEl} class="px-2 overflow-y-auto all:font-mono code-block all:text-xs select-text mr-2">
         {#each $messages as r}
           {@html r.html}
         {/each}