hippofish/packages/client/src/account.ts

321 lines
7.2 KiB
TypeScript
Raw Normal View History

2024-03-30 17:30:50 +01:00
import type { entities } from "firefish-js";
import { defineAsyncComponent } from "vue";
import { i18n } from "./i18n";
2023-01-13 05:40:33 +01:00
import { apiUrl } from "@/config";
2024-03-07 03:06:45 +01:00
import { me } from "@/me";
2024-03-16 16:49:12 +01:00
import { alert, api, popup, popupMenu, waiting } from "@/os";
2024-04-11 23:55:54 +02:00
import icon from "@/scripts/icon";
2023-11-16 21:18:19 +01:00
import { del, get, set } from "@/scripts/idb-proxy";
import { reloadChannel, unisonReload } from "@/scripts/unison-reload";
// TODO: 他のタブと永続化されたstateを同期
export type Account = entities.MeDetailed;
export async function signOut() {
waiting();
2023-01-13 05:40:33 +01:00
localStorage.removeItem("account");
2024-03-07 03:06:45 +01:00
await removeAccount(me.id);
const accounts = await getAccounts();
2023-09-02 01:27:33 +02:00
// #region Remove service worker registration
2021-08-21 04:51:46 +02:00
try {
if (navigator.serviceWorker.controller) {
const registration = await navigator.serviceWorker.ready;
const push = await registration.pushManager.getSubscription();
if (push) {
await fetch(`${apiUrl}/sw/unregister`, {
2023-01-13 05:40:33 +01:00
method: "POST",
body: JSON.stringify({
2024-03-07 03:06:45 +01:00
i: me.token,
endpoint: push.endpoint,
}),
});
}
}
if (accounts.length === 0) {
2023-01-13 05:40:33 +01:00
await navigator.serviceWorker.getRegistrations().then((registrations) => {
return Promise.all(
registrations.map((registration) => registration.unregister()),
);
});
}
} catch (err) {}
2023-09-02 01:27:33 +02:00
// #endregion
2023-01-13 05:40:33 +01:00
document.cookie = "igi=; path=/";
if (accounts.length > 0) signIn(accounts[0].token);
2023-01-13 05:40:33 +01:00
else unisonReload("/");
}
2023-01-13 05:40:33 +01:00
export async function getAccounts(): Promise<
{ id: Account["id"]; token: Account["token"] }[]
> {
return (await get("accounts")) || [];
}
2023-01-13 05:40:33 +01:00
export async function addAccount(id: Account["id"], token: Account["token"]) {
const accounts = await getAccounts();
2023-01-13 05:40:33 +01:00
if (!accounts.some((x) => x.id === id)) {
await set("accounts", accounts.concat([{ id, token }]));
}
}
2023-01-13 05:40:33 +01:00
export async function removeAccount(id: Account["id"]) {
const accounts = await getAccounts();
2023-01-13 05:40:33 +01:00
accounts.splice(
accounts.findIndex((x) => x.id === id),
1,
);
2023-01-13 05:40:33 +01:00
if (accounts.length > 0) await set("accounts", accounts);
else await del("accounts");
}
2022-04-11 15:50:53 +02:00
function fetchAccount(token: string): Promise<Account> {
return new Promise((done, fail) => {
// Fetch user
fetch(`${apiUrl}/i`, {
2023-01-13 05:40:33 +01:00
method: "POST",
body: JSON.stringify({
i: token,
}),
})
2023-01-13 05:40:33 +01:00
.then((res) => res.json())
.then((res) => {
if (res.error) {
if (res.error.id === "a8c724b3-6e9c-4b46-b1a8-bc3ed6258370") {
showSuspendedDialog();
signOut();
2023-01-13 05:40:33 +01:00
} else {
alert({
type: "error",
title: i18n.ts.failedToFetchAccountInformation,
text: JSON.stringify(res.error),
});
}
} else {
2023-01-13 05:40:33 +01:00
res.token = token;
done(res);
}
2023-01-13 05:40:33 +01:00
})
.catch(fail);
});
}
function showSuspendedDialog() {
alert({
type: "error",
title: i18n.ts.yourAccountSuspendedTitle,
text: i18n.ts.yourAccountSuspendedDescription,
});
}
export function updateAccount(accountData) {
for (const [key, value] of Object.entries(accountData)) {
2024-03-07 03:06:45 +01:00
me[key] = value;
}
2024-03-07 03:06:45 +01:00
localStorage.setItem("account", JSON.stringify(me));
}
2024-03-07 03:06:45 +01:00
export async function refreshAccount() {
const accountData = await fetchAccount(me.token);
return updateAccount(accountData);
}
export async function signIn(token: Account["token"], redirect?: string) {
waiting();
2023-01-13 05:40:33 +01:00
if (_DEV_) console.log("logging as token ", token);
2024-03-07 03:06:45 +01:00
const newAccount = await fetchAccount(token);
localStorage.setItem("account", JSON.stringify(newAccount));
2024-05-06 07:14:44 +02:00
if (newAccount.lang) {
localStorage.setItem("lang", newAccount.lang);
}
2022-03-19 11:08:55 +01:00
document.cookie = `token=${token}; path=/; max-age=31536000`; // bull dashboardの認証とかで使う
2024-03-07 03:06:45 +01:00
await addAccount(newAccount.id, token);
if (redirect) {
// 他のタブは再読み込みするだけ
reloadChannel.postMessage(null);
// このページはredirectで指定された先に移動
location.href = redirect;
return;
}
unisonReload();
}
2023-01-13 05:40:33 +01:00
export async function openAccountMenu(
opts: {
includeCurrentAccount?: boolean;
withExtraOperation: boolean;
active?: entities.UserDetailed["id"];
onChoose?: (account: entities.UserDetailed) => void;
2023-01-13 05:40:33 +01:00
},
ev: MouseEvent,
isMobile?: boolean,
2023-01-13 05:40:33 +01:00
) {
2021-10-10 08:19:16 +02:00
function showSigninDialog() {
2023-01-13 05:40:33 +01:00
popup(
defineAsyncComponent(() => import("@/components/MkSigninDialog.vue")),
{},
{
done: (res) => {
addAccount(res.id, res.i);
switchAccountWithToken(res.i);
2023-01-13 05:40:33 +01:00
},
2021-10-10 08:19:16 +02:00
},
2023-01-13 05:40:33 +01:00
"closed",
);
2021-10-10 08:19:16 +02:00
}
function createAccount() {
2023-01-13 05:40:33 +01:00
popup(
defineAsyncComponent(() => import("@/components/MkSignupDialog.vue")),
{},
{
done: (res) => {
addAccount(res.id, res.i);
switchAccountWithToken(res.i);
},
2021-10-10 08:19:16 +02:00
},
2023-01-13 05:40:33 +01:00
"closed",
);
2021-10-10 08:19:16 +02:00
}
async function switchAccount(account: entities.UserDetailed) {
2021-10-10 08:19:16 +02:00
const storedAccounts = await getAccounts();
2023-01-13 05:40:33 +01:00
const token = storedAccounts.find((x) => x.id === account.id).token;
2021-10-10 08:19:16 +02:00
switchAccountWithToken(token);
}
function switchAccountWithToken(token: string) {
signIn(token);
2021-10-10 08:19:16 +02:00
}
2023-01-13 05:40:33 +01:00
const storedAccounts = await getAccounts().then((accounts) =>
2024-03-07 03:06:45 +01:00
accounts.filter((x) => x.id !== me.id),
2023-01-13 05:40:33 +01:00
);
const accountsPromise = api("users/show", {
userIds: storedAccounts.map((x) => x.id),
});
2021-10-10 08:19:16 +02:00
function createItem(account: entities.UserDetailed) {
return {
2023-01-13 05:40:33 +01:00
type: "user",
user: account,
active: opts.active != null ? opts.active === account.id : false,
action: () => {
if (opts.onChoose) {
opts.onChoose(account);
} else {
switchAccount(account);
}
},
};
}
2023-01-13 05:40:33 +01:00
const accountItemPromises = storedAccounts.map(
(a) =>
new Promise((res) => {
accountsPromise.then((accounts) => {
const account = accounts.find((x) => x.id === a.id);
if (account == null) return res(null);
res(createItem(account));
});
}),
);
2021-10-10 08:19:16 +02:00
if (opts.withExtraOperation) {
2023-01-13 05:40:33 +01:00
popupMenu(
[
...[
...(isMobile ?? false
? [
{
type: "parent",
2024-04-03 06:14:36 +02:00
icon: `${icon("ph-plus")}`,
text: i18n.ts.addAccount,
children: [
{
text: i18n.ts.existingAccount,
action: () => {
showSigninDialog();
},
},
{
text: i18n.ts.createAccount,
action: () => {
createAccount();
},
},
],
},
]
: [
{
type: "link",
text: i18n.ts.profile,
2024-03-07 03:06:45 +01:00
to: `/@${me.username}`,
avatar: me,
},
null,
]),
2024-03-07 03:06:45 +01:00
...(opts.includeCurrentAccount ? [createItem(me)] : []),
2023-01-13 05:40:33 +01:00
...accountItemPromises,
...(isMobile ?? false
? [
null,
{
type: "link",
text: i18n.ts.profile,
2024-03-07 03:06:45 +01:00
to: `/@${me.username}`,
avatar: me,
2023-01-13 05:40:33 +01:00
},
]
: [
{
type: "parent",
2024-04-03 06:14:36 +02:00
icon: `${icon("ph-plus")}`,
text: i18n.ts.addAccount,
children: [
{
text: i18n.ts.existingAccount,
action: () => {
showSigninDialog();
},
},
{
text: i18n.ts.createAccount,
action: () => {
createAccount();
},
},
],
2023-01-13 05:40:33 +01:00
},
]),
2023-01-13 05:40:33 +01:00
],
],
ev.currentTarget ?? ev.target,
{
align: "left",
},
);
} else {
2023-01-13 05:40:33 +01:00
popupMenu(
[
2024-03-07 03:06:45 +01:00
...(opts.includeCurrentAccount ? [createItem(me)] : []),
2023-01-13 05:40:33 +01:00
...accountItemPromises,
],
ev.currentTarget ?? ev.target,
{
align: "left",
},
);
}
2021-10-10 08:19:16 +02:00
}