init webview: add webview ui and list machine as api example

pkgs/clan-vm-manager/web/app/src/nested.tsx

@@ -0,0 +1,29 @@
+import { For, Match, Switch, type Component } from "solid-js";
+import { useCountContext } from "./Config";
+
+export const Nested: Component = () => {
+  const [{ machines, loading }, { getMachines }] = useCountContext();
+  return (
+    <div>
+      <button onClick={() => getMachines()} class="btn btn-primary">
+        Get machines
+      </button>
+      <hr />
+      <Switch>
+        <Match when={loading()}>Loading...</Match>
+        <Match when={!loading() && machines().length === 0}>
+          No machines found
+        </Match>
+        <Match when={!loading() && machines().length}>
+          <For each={machines()}>
+            {(machine, i) => (
+              <li>
+                {i() + 1}: {machine}
+              </li>
+            )}
+          </For>
+        </Match>
+      </Switch>
+    </div>
+  );
+};