cq

commit 6fe0136e3e1da266b60a95a5ffda05bc6ec1d80a
parent 861cc9c86cfeab19e844cd24f3884a5d97c9f291
Author: finwo <finwo@pm.me>
Date:   Sat, 13 Sep 2025 18:38:56 +0200

Showing known accounts on select page

Diffstat:
M
packages/app/src/component/screen-account-select.tsx
 | 
37
+++++++++++++++++++++++++++++--------
M
packages/app/src/global.css
 | 
11
+++++++++++

2 files changed, 40 insertions(+), 8 deletions(-)
diff --git a/packages/app/src/component/screen-account-select.tsx b/packages/app/src/component/screen-account-select.tsx
@@ -1,31 +1,52 @@
+import { Vnode } from 'mithril';
 import { AccountCreateScreen } from './screen-account-create.tsx';
 
-import { getDirectoryHandle } from '../util/opfs';
+import { getDirectoryHandle, getFileHandle } from '../util/opfs';
+
+type _Vnode = Vnode<{}, typeof AccountSelectScreen>;
 
 export const AccountSelectScreen = {
   routePath: '/account/select',
 
-  accounts: [],
+  accounts: [] as Array<{accountId: string}>,
 
-  async oninit(vnode) {
+  async oninit(vnode: _Vnode) {
     vnode.state.accounts = [];
 
     const accountsHandle = await getDirectoryHandle('/accounts');
-    for await (const [name, handle] of accountsHandle.entries()) {
-      vnode.state.accounts.push(name);
+    for await (const [accountId, handle] of accountsHandle.entries()) {
+      const accountConfigHandle = await getFileHandle(`/accounts/${accountId}/config.json`)
+      const accountConfig       = JSON.parse(Buffer.from(await (await accountConfigHandle.getFile()).bytes()));
+      vnode.state.accounts.push({
+        ...accountConfig,
+        accountId,
+      });
     }
 
+    console.log(vnode.state.accounts);
+
     if (!vnode.state.accounts.length) {
       document.location.href = `#!${AccountCreateScreen.routePath}`;
       return;
     }
 
+    m.redraw();
   },
 
-  view() {
+  view(vnode: _Vnode) {
     return (
-      <div>
-        ACCOUNT SELECT
+      <div class="main">
+        <div id="accountSelectList">
+          <center style="padding:1em;">Select account</center>
+          {vnode.state.accounts.map(account => (
+            <div style="padding:1em">
+              {account.name}
+            </div>
+          ))}
+        </div>
+        <center>
+          <a href={`#!${AccountCreateScreen.routePath}`}>Create new account</a>
+        </center>
       </div>
     );
   },
diff --git a/packages/app/src/global.css b/packages/app/src/global.css
@@ -59,3 +59,14 @@ button {
     margin: 1rem;
   }
 }
+
+#accountSelectList > * {
+  padding: 1em;
+  &:not(:first-child) {
+    border-top: 1px solid #FFF8;
+    cursor: pointer;
+  }
+  &:hover:not(:first-child) {
+    background: #FFF2;
+  }
+}