From 2a44f3a670ac321b311d08adfb27a85900978ed2 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Sun, 22 Jan 2023 00:37:46 +0800
Subject: [PATCH] Hidden way to update the account info

Usually when avatar or name changes
---
 src/components/avatar.jsx |  3 ++-
 src/pages/settings.jsx    | 24 +++++++++++++++++++++---
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/src/components/avatar.jsx b/src/components/avatar.jsx
index f8e1ca29..1ceb7fe4 100644
--- a/src/components/avatar.jsx
+++ b/src/components/avatar.jsx
@@ -9,7 +9,7 @@ const SIZES = {
   xxxl: 64,
 };
 
-function Avatar({ url, size, alt = '' }) {
+function Avatar({ url, size, alt = '', ...props }) {
   size = SIZES[size] || size || SIZES.m;
   return (
     <span
@@ -19,6 +19,7 @@ function Avatar({ url, size, alt = '' }) {
         height: size,
       }}
       title={alt}
+      {...props}
     >
       {!!url && (
         <img src={url} width={size} height={size} alt={alt} loading="lazy" />
diff --git a/src/pages/settings.jsx b/src/pages/settings.jsx
index b9aa6987..524256ce 100644
--- a/src/pages/settings.jsx
+++ b/src/pages/settings.jsx
@@ -1,6 +1,6 @@
 import './settings.css';
 
-import { useRef, useState } from 'preact/hooks';
+import { useReducer, useRef, useState } from 'preact/hooks';
 import { useSnapshot } from 'valtio';
 
 import Avatar from '../components/avatar';
@@ -27,6 +27,8 @@ function Settings({ onClose }) {
   const moreThanOneAccount = accounts.length > 1;
   const [currentDefault, setCurrentDefault] = useState(0);
 
+  const [_, reload] = useReducer((x) => x + 1, 0);
+
   return (
     <div id="settings-container" class="sheet" tabIndex="-1">
       <main>
@@ -40,14 +42,30 @@ function Settings({ onClose }) {
               const isCurrent = account.info.id === currentAccount;
               const isDefault = i === (currentDefault || 0);
               return (
-                <li>
+                <li key={i + account.id}>
                   <div>
                     {moreThanOneAccount && (
                       <span class={`current ${isCurrent ? 'is-current' : ''}`}>
                         <Icon icon="check-circle" alt="Current" />
                       </span>
                     )}
-                    <Avatar url={account.info.avatarStatic} size="xxl" />
+                    <Avatar
+                      url={account.info.avatarStatic}
+                      size="xxl"
+                      onDblClick={async () => {
+                        if (isCurrent) {
+                          try {
+                            const info = await masto.v1.accounts.fetch(
+                              account.info.id,
+                            );
+                            console.log('fetched account info', info);
+                            account.info = info;
+                            store.local.setJSON('accounts', accounts);
+                            reload();
+                          } catch (e) {}
+                        }
+                      }}
+                    />
                     <NameText
                       account={account.info}
                       showAcct