diff --git a/src/shared/accounts/active.tsx b/src/shared/accounts/active.tsx index 21c9a6e5..1e579d9a 100644 --- a/src/shared/accounts/active.tsx +++ b/src/shared/accounts/active.tsx @@ -5,11 +5,11 @@ export default function ActiveAccount({ user }: { user: any }) { const userData = JSON.parse(user.metadata); return ( - ); diff --git a/src/shared/accounts/inactive.tsx b/src/shared/accounts/inactive.tsx index 5b0afc87..c571649f 100644 --- a/src/shared/accounts/inactive.tsx +++ b/src/shared/accounts/inactive.tsx @@ -5,11 +5,11 @@ export default function InactiveAccount({ user }: { user: any }) { const userData = JSON.parse(user.metadata); return ( -
+
user's avatar
); diff --git a/src/shared/icons/bell.tsx b/src/shared/icons/bell.tsx new file mode 100644 index 00000000..5786a764 --- /dev/null +++ b/src/shared/icons/bell.tsx @@ -0,0 +1,13 @@ +import { SVGProps } from 'react'; + +export default function BellIcon(props: JSX.IntrinsicAttributes & SVGProps) { + return ( + + + + ); +} diff --git a/src/shared/multiAccounts.tsx b/src/shared/multiAccounts.tsx index c2a63717..91bc14b9 100644 --- a/src/shared/multiAccounts.tsx +++ b/src/shared/multiAccounts.tsx @@ -1,39 +1,57 @@ import ActiveAccount from '@lume/shared/accounts/active'; import InactiveAccount from '@lume/shared/accounts/inactive'; +import BellIcon from '@lume/shared/icons/bell'; import PlusIcon from '@lume/shared/icons/plus'; import { APP_VERSION } from '@lume/stores/constants'; -import { getAccounts } from '@lume/utils/storage'; +import { getAccounts, getActiveAccount } from '@lume/utils/storage'; import useSWR from 'swr'; -const fetcher = () => getAccounts(); +const allFetcher = () => getAccounts(); +const fetcher = () => getActiveAccount(); export default function MultiAccounts() { - const { data, error }: any = useSWR('allAccounts', fetcher); + const { data: accounts }: any = useSWR('allAccounts', allFetcher); + const { data: activeAccount }: any = useSWR('activeAccount', fetcher); return (
-
- <> - {error &&
failed to load
} - {!data ? ( -
- ) : ( - data.map((account: { is_active: number; pubkey: string }) => { - if (account.is_active === 1) { - return ; - } else { - return ; - } - }) - )} - - - - +
+
+ <> + {!activeAccount ? ( +
+ ) : ( + + )} + +
+ +
+
+
+
+ <> + {!accounts ? ( +
+ ) : ( + accounts.map((account: { is_active: number; pubkey: string }) => ( + + )) + )} + + +
Lume diff --git a/src/utils/storage.tsx b/src/utils/storage.tsx index e61ba274..4ab6e656 100644 --- a/src/utils/storage.tsx +++ b/src/utils/storage.tsx @@ -23,7 +23,7 @@ export async function getActiveAccount() { // get all accounts export async function getAccounts() { const db = await connect(); - return await db.select(`SELECT * FROM accounts ORDER BY created_at DESC;`); + return await db.select(`SELECT * FROM accounts WHERE is_active = 0 ORDER BY created_at DESC;`); } // create account