From 097f97edc18ea3ea0a7ba342d5668640992ebb5b Mon Sep 17 00:00:00 2001 From: Kieran Date: Mon, 25 Dec 2023 18:56:26 +0000 Subject: [PATCH] Use logo as default avatar --- VoidCat/spa/src/api/src/api.ts | 316 +++++++++--------- VoidCat/spa/src/app/index.html | 28 +- VoidCat/spa/src/app/src/App.tsx | 7 +- .../src/Components/Shared/InlineProfile.tsx | 6 +- VoidCat/spa/src/app/src/Const.ts | 2 - VoidCat/spa/src/app/src/Hooks/UseApi.tsx | 5 +- VoidCat/spa/src/app/src/Pages/FilePreview.tsx | 4 +- VoidCat/spa/src/app/src/Pages/Profile.tsx | 6 +- VoidCat/spa/src/app/vite.config.ts | 57 ++-- 9 files changed, 217 insertions(+), 214 deletions(-) diff --git a/VoidCat/spa/src/api/src/api.ts b/VoidCat/spa/src/api/src/api.ts index 3691bf2..41f7c86 100644 --- a/VoidCat/spa/src/api/src/api.ts +++ b/VoidCat/spa/src/api/src/api.ts @@ -1,192 +1,192 @@ import { - AdminProfile, - AdminUserListResult, - ApiError, - ApiKey, - LoginSession, - PagedRequest, - PagedResponse, - PaymentOrder, - Profile, - SetPaymentConfigRequest, - SiteInfoResponse, - VoidFileResponse, + AdminProfile, + AdminUserListResult, + ApiError, + ApiKey, + LoginSession, + PagedRequest, + PagedResponse, + PaymentOrder, + Profile, + SetPaymentConfigRequest, + SiteInfoResponse, + VoidFileResponse, } from "./index"; import { - ProgressHandler, - ProxyChallengeHandler, - StateChangeHandler, - VoidUploader, + ProgressHandler, + ProxyChallengeHandler, + StateChangeHandler, + VoidUploader, } from "./upload"; -import {StreamUploader} from "./stream-uploader"; -import {XHRUploader} from "./xhr-uploader"; +import { StreamUploader } from "./stream-uploader"; +import { XHRUploader } from "./xhr-uploader"; export type AuthHandler = (url: string, method: string) => Promise; export class VoidApi { - readonly #uri: string; - readonly #auth?: AuthHandler; + readonly #uri: string; + readonly #auth?: AuthHandler; - constructor(uri?: string, auth?: AuthHandler) { - this.#uri = uri ?? ""; - this.#auth = auth; + constructor(uri?: string, auth?: AuthHandler) { + this.#uri = uri ?? ""; + this.#auth = auth; + } + + async #req(method: string, url: string, body?: object): Promise { + const absoluteUrl = `${this.#uri}${url}`; + const headers: HeadersInit = { + Accept: "application/json", + }; + if (this.#auth) { + headers["Authorization"] = await this.#auth(absoluteUrl, method); + } + if (body) { + headers["Content-Type"] = "application/json"; } - async #req(method: string, url: string, body?: object): Promise { - const absoluteUrl = `${this.#uri}${url}`; - const headers: HeadersInit = { - Accept: "application/json", - }; - if (this.#auth) { - headers["Authorization"] = await this.#auth(absoluteUrl, method); - } - if (body) { - headers["Content-Type"] = "application/json"; - } - - const res = await fetch(absoluteUrl, { - method, - headers, - mode: "cors", - body: body ? JSON.stringify(body) : undefined, - }); - const text = await res.text(); - if (res.ok) { - return text ? (JSON.parse(text) as T) : ({} as T); - } else { - throw new ApiError(res.status, text); - } + const res = await fetch(absoluteUrl, { + method, + headers, + mode: "cors", + body: body ? JSON.stringify(body) : undefined, + }); + const text = await res.text(); + if (res.ok) { + return text ? (JSON.parse(text) as T) : ({} as T); + } else { + throw new ApiError(res.status, text); } + } - /** - * Get uploader for uploading files - */ - getUploader( - file: File | Blob, - stateChange?: StateChangeHandler, - progress?: ProgressHandler, - proxyChallenge?: ProxyChallengeHandler, - chunkSize?: number, - ): VoidUploader { - if (StreamUploader.canUse()) { - return new StreamUploader( - this.#uri, - file, - stateChange, - progress, - proxyChallenge, - this.#auth, - chunkSize, - ); - } else { - return new XHRUploader( - this.#uri, - file, - stateChange, - progress, - proxyChallenge, - this.#auth, - chunkSize, - ); - } + /** + * Get uploader for uploading files + */ + getUploader( + file: File | Blob, + stateChange?: StateChangeHandler, + progress?: ProgressHandler, + proxyChallenge?: ProxyChallengeHandler, + chunkSize?: number, + ): VoidUploader { + if (StreamUploader.canUse()) { + return new StreamUploader( + this.#uri, + file, + stateChange, + progress, + proxyChallenge, + this.#auth, + chunkSize, + ); + } else { + return new XHRUploader( + this.#uri, + file, + stateChange, + progress, + proxyChallenge, + this.#auth, + chunkSize, + ); } + } - /** - * General site information - */ - info() { - return this.#req("GET", "/info"); - } + /** + * General site information + */ + info() { + return this.#req("GET", "/info"); + } - fileInfo(id: string) { - return this.#req("GET", `/upload/${id}`); - } + fileInfo(id: string) { + return this.#req("GET", `/upload/${id}`); + } - setPaymentConfig(id: string, cfg: SetPaymentConfigRequest) { - return this.#req("POST", `/upload/${id}/payment`, cfg); - } + setPaymentConfig(id: string, cfg: SetPaymentConfigRequest) { + return this.#req("POST", `/upload/${id}/payment`, cfg); + } - createOrder(id: string) { - return this.#req("GET", `/upload/${id}/payment`); - } + createOrder(id: string) { + return this.#req("GET", `/upload/${id}/payment`); + } - getOrder(file: string, order: string) { - return this.#req("GET", `/upload/${file}/payment/${order}`); - } + getOrder(file: string, order: string) { + return this.#req("GET", `/upload/${file}/payment/${order}`); + } - login(username: string, password: string, captcha?: string) { - return this.#req("POST", `/auth/login`, { - username, - password, - captcha, - }); - } + login(username: string, password: string, captcha?: string) { + return this.#req("POST", `/auth/login`, { + username, + password, + captcha, + }); + } - register(username: string, password: string, captcha?: string) { - return this.#req("POST", `/auth/register`, { - username, - password, - captcha, - }); - } + register(username: string, password: string, captcha?: string) { + return this.#req("POST", `/auth/register`, { + username, + password, + captcha, + }); + } - getUser(id: string) { - return this.#req("GET", `/user/${id}`); - } + getUser(id: string) { + return this.#req("GET", `/user/${id}`); + } - updateUser(u: Profile) { - return this.#req("POST", `/user/${u.id}`, u); - } + updateUser(u: Profile) { + return this.#req("POST", `/user/${u.id}`, u); + } - listUserFiles(uid: string, pageReq: PagedRequest) { - return this.#req>( - "POST", - `/user/${uid}/files`, - pageReq, - ); - } + listUserFiles(uid: string, pageReq: PagedRequest) { + return this.#req>( + "POST", + `/user/${uid}/files`, + pageReq, + ); + } - submitVerifyCode(uid: string, code: string) { - return this.#req("POST", `/user/${uid}/verify`, {code}); - } + submitVerifyCode(uid: string, code: string) { + return this.#req("POST", `/user/${uid}/verify`, { code }); + } - sendNewCode(uid: string) { - return this.#req("GET", `/user/${uid}/verify`); - } + sendNewCode(uid: string) { + return this.#req("GET", `/user/${uid}/verify`); + } - updateFileMetadata(id: string, meta: any) { - return this.#req("POST", `/upload/${id}/meta`, meta); - } + updateFileMetadata(id: string, meta: any) { + return this.#req("POST", `/upload/${id}/meta`, meta); + } - listApiKeys() { - return this.#req>("GET", `/auth/api-key`); - } + listApiKeys() { + return this.#req>("GET", `/auth/api-key`); + } - createApiKey(req: any) { - return this.#req("POST", `/auth/api-key`, req); - } + createApiKey(req: any) { + return this.#req("POST", `/auth/api-key`, req); + } - adminListFiles(pageReq: PagedRequest) { - return this.#req>( - "POST", - "/admin/file", - pageReq, - ); - } + adminListFiles(pageReq: PagedRequest) { + return this.#req>( + "POST", + "/admin/file", + pageReq, + ); + } - adminDeleteFile(id: string) { - return this.#req("DELETE", `/admin/file/${id}`); - } + adminDeleteFile(id: string) { + return this.#req("DELETE", `/admin/file/${id}`); + } - adminUserList(pageReq: PagedRequest) { - return this.#req>( - "POST", - `/admin/users`, - pageReq, - ); - } + adminUserList(pageReq: PagedRequest) { + return this.#req>( + "POST", + `/admin/users`, + pageReq, + ); + } - adminUpdateUser(u: AdminProfile) { - return this.#req("POST", `/admin/update-user`, u); - } + adminUpdateUser(u: AdminProfile) { + return this.#req("POST", `/admin/update-user`, u); + } } diff --git a/VoidCat/spa/src/app/index.html b/VoidCat/spa/src/app/index.html index b4f6a68..f1cb58f 100644 --- a/VoidCat/spa/src/app/index.html +++ b/VoidCat/spa/src/app/index.html @@ -1,18 +1,18 @@ - - - - - - - - + + + + + + + + void.cat - - - -
- - + + + +
+ + diff --git a/VoidCat/spa/src/app/src/App.tsx b/VoidCat/spa/src/app/src/App.tsx index 9ae8a56..c52ec7f 100644 --- a/VoidCat/spa/src/app/src/App.tsx +++ b/VoidCat/spa/src/app/src/App.tsx @@ -34,7 +34,12 @@ const router = createBrowserRouter([ path: "/u/:id", loader: async ({ params }: LoaderFunctionArgs) => { const state = store.getState(); - const api = new VoidApi(import.meta.env.VITE_API_HOST, state.login.jwt ? () => Promise.resolve(`Bearer ${state.login.jwt}`) : undefined); + const api = new VoidApi( + import.meta.env.VITE_API_HOST, + state.login.jwt + ? () => Promise.resolve(`Bearer ${state.login.jwt}`) + : undefined, + ); if (params.id) { try { return await api.getUser(params.id); diff --git a/VoidCat/spa/src/app/src/Components/Shared/InlineProfile.tsx b/VoidCat/spa/src/app/src/Components/Shared/InlineProfile.tsx index 9c55166..4d81c95 100644 --- a/VoidCat/spa/src/app/src/Components/Shared/InlineProfile.tsx +++ b/VoidCat/spa/src/app/src/Components/Shared/InlineProfile.tsx @@ -3,8 +3,6 @@ import { CSSProperties } from "react"; import { Link } from "react-router-dom"; import { Profile } from "@void-cat/api"; -import { DefaultAvatar } from "@/Const"; - const DefaultSize = 64; interface InlineProfileProps { @@ -24,8 +22,8 @@ export function InlineProfile({ profile, options }: InlineProfileProps) { ...options, }; - let avatarUrl = profile.avatar ?? DefaultAvatar; - if (!avatarUrl.startsWith("http")) { + let avatarUrl = profile.avatar ?? "/logo_256.jpg"; + if (profile.avatar && !avatarUrl.startsWith("http")) { avatarUrl = `/d/${avatarUrl}`; } let avatarStyles = { diff --git a/VoidCat/spa/src/app/src/Const.ts b/VoidCat/spa/src/app/src/Const.ts index 29854f9..7940336 100644 --- a/VoidCat/spa/src/app/src/Const.ts +++ b/VoidCat/spa/src/app/src/Const.ts @@ -1,5 +1,3 @@ -export const DefaultAvatar = "https://i.imgur.com/8A5Fu65.jpeg"; - /** * @constant {number} - Size of 1 kiB */ diff --git a/VoidCat/spa/src/app/src/Hooks/UseApi.tsx b/VoidCat/spa/src/app/src/Hooks/UseApi.tsx index 36cd3b7..72331d8 100644 --- a/VoidCat/spa/src/app/src/Hooks/UseApi.tsx +++ b/VoidCat/spa/src/app/src/Hooks/UseApi.tsx @@ -5,5 +5,8 @@ import { RootState } from "@/Store"; export default function useApi() { const auth = useSelector((s: RootState) => s.login.jwt); - return new VoidApi(import.meta.env.VITE_API_HOST, auth ? () => Promise.resolve(`Bearer ${auth}`) : undefined); + return new VoidApi( + import.meta.env.VITE_API_HOST, + auth ? () => Promise.resolve(`Bearer ${auth}`) : undefined, + ); } diff --git a/VoidCat/spa/src/app/src/Pages/FilePreview.tsx b/VoidCat/spa/src/app/src/Pages/FilePreview.tsx index 4d2642d..125e1d6 100644 --- a/VoidCat/spa/src/app/src/Pages/FilePreview.tsx +++ b/VoidCat/spa/src/app/src/Pages/FilePreview.tsx @@ -248,7 +248,9 @@ export function FilePreview() { useEffect(() => { if (info) { - const fileLink = info.metadata?.url ?? `${import.meta.env.VITE_API_HOST ?? ""}/d/${info.id}`; + const fileLink = + info.metadata?.url ?? + `${import.meta.env.VITE_API_HOST ?? ""}/d/${info.id}`; setFileSize(info.metadata?.size ?? 0); const order = window.localStorage.getItem(`payment-${info.id}`); diff --git a/VoidCat/spa/src/app/src/Pages/Profile.tsx b/VoidCat/spa/src/app/src/Pages/Profile.tsx index 6e2a71e..b8650ee 100644 --- a/VoidCat/spa/src/app/src/Pages/Profile.tsx +++ b/VoidCat/spa/src/app/src/Pages/Profile.tsx @@ -7,7 +7,6 @@ import { Profile } from "@void-cat/api"; import useApi from "@/Hooks/UseApi"; import { RootState } from "@/Store"; -import { DefaultAvatar } from "@/Const"; import { logout, setProfile as setGlobalProfile } from "@/LoginState"; import { FileList } from "@/Components/Shared/FileList"; @@ -173,9 +172,8 @@ export function ProfilePage() { } if (profile) { - let avatarUrl = profile.avatar ?? DefaultAvatar; - if (!avatarUrl.startsWith("http")) { - // assume void-cat hosted avatar + let avatarUrl = profile.avatar ?? "/logo_256.jpg"; + if (profile.avatar && !avatarUrl.startsWith("http")) { avatarUrl = `/d/${avatarUrl}`; } let avatarStyles = { diff --git a/VoidCat/spa/src/app/vite.config.ts b/VoidCat/spa/src/app/vite.config.ts index d2eb1cd..cce37d9 100644 --- a/VoidCat/spa/src/app/vite.config.ts +++ b/VoidCat/spa/src/app/vite.config.ts @@ -1,34 +1,33 @@ import react from "@vitejs/plugin-react"; -import {visualizer} from "rollup-plugin-visualizer"; -import {defineConfig} from "vite"; -import {vitePluginVersionMark} from "vite-plugin-version-mark"; +import { visualizer } from "rollup-plugin-visualizer"; +import { defineConfig } from "vite"; +import { vitePluginVersionMark } from "vite-plugin-version-mark"; export default defineConfig({ - plugins: [ - react(), - visualizer({ - open: true, - gzipSize: true, - filename: "build/stats.html", - }), - vitePluginVersionMark({ - name: "void_cat", - ifGitSHA: true, - command: "git describe --always --tags", - ifMeta: false, - }), - ], - assetsInclude: [], - build: { - outDir: "build" + plugins: [ + react(), + visualizer({ + open: true, + gzipSize: true, + filename: "build/stats.html", + }), + vitePluginVersionMark({ + name: "void_cat", + ifGitSHA: true, + command: "git describe --always --tags", + ifMeta: false, + }), + ], + assetsInclude: [], + build: { + outDir: "build", + }, + base: "/", + clearScreen: false, + resolve: { + alias: { + "@": "/src", }, - base: "/", - clearScreen: false, - resolve: { - alias: { - "@": "/src", - }, - }, - define: {} + }, + define: {}, }); -