@bbki.ng/site 5.4.22 → 5.4.24

package/src/blog/components/reload_prompt/index.tsx

@@ -1,51 +0,0 @@
-import { useEffect } from "react";
-import { toast } from "sonner";
-
-// @ts-ignore
-import { useRegisterSW } from "virtual:pwa-register/react";
-
-export const ReloadPrompt = () => {
-  const {
-    needRefresh: [needRefresh, setNeedRefresh],
-    updateServiceWorker,
-  } = useRegisterSW({
-    onRegisterError(error: any) {
-      console.log("SW registration error", error);
-    },
-    onRegisteredSW(swScriptUrl: string, r: ServiceWorkerRegistration) {
-      console.log("SW registered: ", swScriptUrl, r);
-    },
-    onOfflineReady() {
-      console.log("App is offline-ready");
-    },
-  });
-
-  useEffect(() => {
-    if (needRefresh) {
-      toast("", {
-        description: "发现新版本，是否更新？",
-        duration: 10000,
-        position: "bottom-right",
-        actionButtonStyle: {
-          backgroundColor: "#fff",
-          color: "rgb(37,99,235)",
-        },
-        action: {
-          label: "是",
-          onClick: () => {
-            updateServiceWorker(false).then(() => {
-              // @ts-ignore
-              toast("", {
-                description: `已更新`,
-                position: "bottom-right",
-              });
-              setNeedRefresh(false);
-            });
-          },
-        },
-      });
-    }
-  }, [needRefresh]);
-
-  return null;
-};

package/src/blog/components/tags/index.tsx

@@ -1,52 +0,0 @@
-import React from "react";
-import classnames from "classnames";
-import { List, Tag, Link, TitledList } from "@bbki.ng/components";
-import { ROUTES } from "@/constants";
-
-type MyTag =
-  | {
-      path: string;
-      name: string;
-    }
-  | string;
-
-type Tags = {
-  tags: MyTag[];
-  className?: string;
-  inline?: boolean;
-};
-
-export const Tags = (props: Tags) => {
-  const { inline, className, tags } = props;
-
-  const renderTag = (tag: MyTag) => {
-    const TagComp = inline ? Tag : Link;
-    if (typeof tag === "string") {
-      return <TagComp to={`${ROUTES.TAGS}/${tag}`}>{tag}</TagComp>;
-    }
-
-    return <TagComp to={tag.path}>{tag.name}</TagComp>;
-  };
-
-  if (inline) {
-    return (
-      <>
-        <List
-          items={tags}
-          itemRenderer={renderTag}
-          horizontal={inline}
-          className={classnames(className, "inline-flex", "flex-wrap")}
-        />
-      </>
-    );
-  }
-  return (
-    <TitledList
-      title={"标签"}
-      items={tags}
-      itemRenderer={renderTag}
-      horizontal={inline}
-      className={className}
-    />
-  );
-};

package/src/blog/hooks/useLoadingIndicator.ts

@@ -1,12 +0,0 @@
-import { GlobalLoadingContext } from "@/context/global_loading_state_provider";
-import { useContext } from "react";
-
-export const useLoadingIndicator = () => {
-  const globalCtx = useContext(GlobalLoadingContext);
-
-  return {
-    setVisibility: globalCtx.setIsLoading,
-    isVisible: globalCtx.isLoading,
-    isFontLoading: globalCtx.isFontLoading,
-  };
-};

package/src/blog/hooks/useScrollToTop.ts

@@ -1,24 +0,0 @@
-import { useLocation } from "react-router-dom";
-import { useEffect } from "react";
-
-export const useScrollToTop = (excludePath = "") => {
-  const { pathname } = useLocation();
-
-  const resetScroll = () => {
-    if (excludePath && pathname.includes(excludePath)) {
-      return;
-    }
-    setTimeout(() => {
-      window.scrollTo(0, 0);
-    }, 0);
-  };
-
-  useEffect(() => {
-    window.addEventListener("popstate", resetScroll);
-    return () => {
-      window.removeEventListener("popstate", resetScroll);
-    };
-  }, []);
-
-  useEffect(resetScroll, [pathname]);
-};

package/src/blog/hooks/useTransitionCls.ts

@@ -1,36 +0,0 @@
-import React, { useEffect } from "react";
-import classnames from "classnames";
-
-interface TransOption {
-  originCls?: string;
-  opacity?: boolean;
-  offset?: boolean;
-  blur?: boolean;
-}
-
-const defaultOpt = {
-  originCls: "",
-  opacity: true,
-  offset: true,
-  blur: true,
-};
-
-export const useTransitionCls = (options: TransOption = defaultOpt) => {
-  const [visible, setVisible] = React.useState(false);
-  const { originCls, opacity, offset, blur } = options;
-
-  const cls = classnames(originCls, "transition-all", "duration-500", {
-    "blur-xs": !visible && blur,
-    "blur-none": visible && blur,
-    "translate-y-0": visible && offset,
-    "translate-y-8": !visible && offset,
-    "opacity-10": !visible && opacity,
-    "opacity-100": visible && opacity,
-  });
-
-  useEffect(() => {
-    setVisible(true);
-  }, []);
-
-  return cls;
-};

package/src/blog/hooks/use_authed.ts

@@ -1,7 +0,0 @@
-import { useSupabaseSession } from "@/hooks/use_supa_session";
-
-export const useAuthed = (): boolean => {
-  const { access_token: token, isKing } = useSupabaseSession() || {};
-
-  return !(!token || !isKing);
-};

package/src/blog/hooks/use_authed_fetcher.ts

@@ -1,9 +0,0 @@
-import { useSupabaseSession } from '@/hooks/use_supa_session';
-import { apiFetcher, withToken } from '@/utils';
-import { useCallback, useMemo } from 'react';
-
-export const useAuthedFetcher = () => {
-  const { access_token: token } = useSupabaseSession() || {};
-  const fetcherWithToken = useMemo(() => withToken(apiFetcher), []);
-  return useCallback(fetcherWithToken(token), [token, fetcherWithToken]);
-};

package/src/blog/hooks/use_authed_string_post.ts

@@ -1,42 +0,0 @@
-import {useSWRConfig} from "swr";
-import {useAuthed} from "@/hooks/use_authed";
-import {useContext} from "react";
-import {GlobalLoadingContext} from "@/context/global_loading_state_provider";
-import {usePost} from "@/hooks/use_post";
-import {splitPost} from "@/utils";
-import {API} from "@/constants/routes";
-
-export const useAuthedStringPost = () => {
-    const { mutate } = useSWRConfig();
-
-    const isKing = useAuthed();
-
-    const { setIsLoading } = useContext(GlobalLoadingContext);
-
-    const post = usePost();
-
-    return (content: string) => {
-        if (!content) {
-            return;
-        }
-
-        if (!isKing) {
-            return;
-        }
-
-        const postObj = splitPost(content);
-        if (!postObj?.content || !postObj?.title) {
-            return;
-        }
-
-        setIsLoading(true);
-
-        post(postObj.title, postObj.content)
-            .then((r) => {
-                mutate(API.POSTS).then();
-            })
-            .finally(() => {
-                setIsLoading(false);
-            });
-    }
-}

package/src/blog/hooks/use_clipboard_content.ts

@@ -1,21 +0,0 @@
-import React from 'react';
-
-export const useClipboardContent = () => {
-  const [clipboardContent, setClipboardContent] = React.useState<string | null>(null);
-
-  React.useEffect(() => {
-    const handlePaste = (event: ClipboardEvent) => {
-      if (event.clipboardData) {
-        setClipboardContent(event.clipboardData.getData('text/plain'));
-      }
-    };
-
-    document.addEventListener('paste', handlePaste);
-
-    return () => {
-      document.removeEventListener('paste', handlePaste);
-    };
-  }, []);
-
-  return clipboardContent;
-};

package/src/blog/hooks/use_clipboard_to_post.ts

@@ -1,48 +0,0 @@
-import {useClipboardContent} from "@/hooks/use_clipboard_content";
-import {useSWRConfig} from "swr";
-import {useContext, useEffect} from "react";
-import {GlobalLoadingContext} from "@/context/global_loading_state_provider";
-import {usePost} from "@/hooks/use_post";
-import {API} from "@/constants/routes";
-import {useAuthed} from "@/hooks/use_authed";
-import {toast} from "sonner";
-
-export const useClipboardToPost = () => {
-    const clipboardContent = useClipboardContent();
-
-    const { mutate } = useSWRConfig();
-
-    const { setIsLoading } = useContext(GlobalLoadingContext);
-
-    const post = usePost();
-
-    const firstLine = clipboardContent ? clipboardContent.split("\n")[0] : "";
-    const title = firstLine ? firstLine.trim() : "";
-
-    const restContent = clipboardContent ? clipboardContent.slice(title.length).trim() : "";
-
-    const isKing = useAuthed();
-
-    useEffect(() => {
-        if (!isKing || !restContent || !title) {
-            return;
-        }
-
-        setIsLoading(true);
-
-        post(title, restContent)
-            .then((r) => {
-                mutate(API.POSTS).then(() => {
-                    toast("", {
-                        description: `已更新`,
-                        position: "bottom-right",
-                    });
-                });
-            })
-            .finally(() => {
-                setIsLoading(false);
-            });
-    }, [title, restContent]);
-
-    return null;
-}

package/src/blog/hooks/use_del_img.ts

@@ -1,22 +0,0 @@
-import { useAuthedFetcher } from "@/hooks/use_authed_fetcher";
-import { useCallback } from "react";
-import { API } from "@/constants/routes";
-
-export const useDelImg = () => {
-  const authedFetcher = useAuthedFetcher();
-
-  const req = useCallback(
-    async (url: string, { arg }: { arg: { id: number } }) => {
-      return authedFetcher(url, {
-        method: "POST",
-        body: JSON.stringify(arg),
-      });
-    },
-    [authedFetcher]
-  );
-
-  return useCallback(
-    (id: number) => req(API.REMOVE_IMG, { arg: { id } }),
-    [req]
-  );
-};

package/src/blog/hooks/use_delete_post.ts

@@ -1,22 +0,0 @@
-import { useAuthedFetcher } from "@/hooks/use_authed_fetcher";
-import { useCallback } from "react";
-import { API } from "@/constants/routes";
-
-export const useDelPost = () => {
-  const authedFetcher = useAuthedFetcher();
-
-  const req = useCallback(
-    async (url: string, { arg }: { arg: { title: string } }) => {
-      return authedFetcher(url, {
-        method: "POST",
-        body: JSON.stringify(arg),
-      });
-    },
-    [authedFetcher]
-  );
-
-  return useCallback(
-    (title: string) => req(API.REMOVE_POST, { arg: { title } }),
-    [req]
-  );
-};

package/src/blog/hooks/use_file_to_post.ts

@@ -1,38 +0,0 @@
-import { useTextPlainFile } from "@/hooks/use_text_plain_file";
-import { useContext, useEffect } from "react";
-import { usePost } from "@/hooks/use_post";
-import { GlobalLoadingContext } from "@/context/global_loading_state_provider";
-import { useAuthedFetcher } from "@/hooks/use_authed_fetcher";
-import { preload, useSWRConfig } from "swr";
-import { API } from "@/constants/routes";
-
-export type fileReader = (f: File) => void;
-export const useFile2Post = (): fileReader => {
-  const { content, title, reader } = useTextPlainFile();
-
-  const { mutate } = useSWRConfig();
-
-  const { setIsLoading } = useContext(GlobalLoadingContext);
-
-  const post = usePost();
-
-  useEffect(() => {
-    if (!content || !title) {
-      return;
-    }
-
-    setIsLoading(true);
-
-    post(title, content)
-      .then((r) => {
-        mutate(API.POSTS).then();
-      })
-      .finally(() => {
-        setIsLoading(false);
-      });
-  }, [title, content]);
-
-  return (f: File) => {
-    reader(f);
-  };
-};

package/src/blog/hooks/use_img_loading.ts

@@ -1,16 +0,0 @@
-import { useEffect, useState } from "react";
-
-export const useImgLoading = (src: string) => {
-  const [loading, setLoading] = useState(true);
-  useEffect(() => {
-    let img = new Image();
-    img.src = src;
-    img.onload = () => {
-      setLoading(false);
-    };
-    return () => {
-      img.src = "";
-    };
-  }, []);
-  return loading;
-};

package/src/blog/hooks/use_post.ts

@@ -1,26 +0,0 @@
-import { useCallback } from "react";
-import { API } from "@/constants/routes";
-import { useAuthedFetcher } from "@/hooks/use_authed_fetcher";
-
-export const usePost = () => {
-  const authedFetcher = useAuthedFetcher();
-
-  const req = useCallback(
-    async (
-      url: string,
-      { arg }: { arg: { title: string; content: string } }
-    ) => {
-      return authedFetcher(url, {
-        method: "POST",
-        body: JSON.stringify(arg),
-      });
-    },
-    [authedFetcher]
-  );
-
-  return useCallback(
-    (title: string, content: string) =>
-      req(API.POST, { arg: { title, content } }),
-    [req]
-  );
-};

package/src/blog/hooks/use_projects.ts

@@ -1,67 +0,0 @@
-import useSWR, { useSWRConfig } from "swr";
-import { API } from "@/constants/routes";
-import { useCallback, useContext, useEffect } from "react";
-import { Photo } from "@/types/photo";
-import { GlobalLoadingContext } from "@/context/global_loading_state_provider";
-
-export const useProjects = (name: string = "", suspense?: boolean) => {
-  const URL = `${API.PROJECTS}${name ? "/" : ""}${name}`;
-
-  const { data, error } = useSWR(URL, {
-    revalidateOnFocus: false,
-    suspense,
-  });
-
-  let isLoading = !data && !error;
-
-  const { setIsLoading } = useContext(GlobalLoadingContext);
-
-  useEffect(() => {
-    setIsLoading(isLoading);
-  }, [isLoading]);
-
-  const { mutate, cache } = useSWRConfig();
-
-  const getCachedProjects = (n: string) => {
-    if (!n) {
-      return;
-    }
-    return cache
-      .get("projects")
-      ?.data.find((p: { name: string }) => p.name === n);
-  };
-
-  const refresh = useCallback(() => {
-    return mutate(URL);
-  }, [URL]);
-
-  const addLocalPhotoImmediately = useCallback(
-    (photo: Photo) => {
-      if (!name) {
-        return;
-      }
-
-      if (!data || error) {
-        return;
-      }
-
-      return mutate(
-        URL,
-        {
-          ...data,
-          images: [photo, ...data.images],
-        },
-        false
-      );
-    },
-    [data, error]
-  );
-
-  return {
-    refresh,
-    addLocalPhotoImmediately,
-    projects: data || getCachedProjects(name),
-    isError: error,
-    isLoading: !data && !error,
-  };
-};

package/src/blog/hooks/use_route_name.ts

@@ -1,7 +0,0 @@
-import { ROUTE_NAME } from "@/constants";
-import { usePathName } from "@/hooks/use_pathname";
-
-export const useRouteName = () => {
-  const pathname = usePathName();
-  return ROUTE_NAME[pathname.replace(/\/$/, "")] || ROUTE_NAME.unknown;
-};

package/src/blog/hooks/use_shared_string_to_post.ts

@@ -1,23 +0,0 @@
-import { useEffect } from 'react';
-import { useAuthedStringPost } from '@/hooks/use_authed_string_post';
-
-export const useSharedStringToPost = () => {
-  const post = useAuthedStringPost();
-
-  useEffect(() => {
-    const handleSharedString = (event: MessageEvent) => {
-      if (event.data && typeof event.data === 'string') {
-        const content = event.data;
-        if (content) {
-          post(content);
-        }
-      }
-    };
-
-    window.addEventListener('message', handleSharedString);
-
-    return () => {
-      window.removeEventListener('message', handleSharedString);
-    };
-  }, [post]);
-};

package/src/blog/hooks/use_supa_session.ts

@@ -1,32 +0,0 @@
-import { createClient, Session } from '@supabase/supabase-js';
-import { SUPABASE } from '@/constants';
-import { useEffect, useMemo, useState } from 'react';
-import { BBKingSession } from '@/types/supabase';
-
-export const useSupabaseSession = (): BBKingSession | null => {
-  const supabase = useMemo(() => createClient(SUPABASE.URL, SUPABASE.ANNO), []);
-
-  const extendSess = (sess: Session | null) => {
-    if (!sess) {
-      return sess;
-    }
-    return {
-      ...sess,
-      isKing: sess.user?.id === SUPABASE.BB_KING_ID,
-      isQueen: sess.user?.id === SUPABASE.BB_QUEEN_ID,
-    };
-  };
-
-  const [session, setSession] = useState(extendSess(supabase.auth.session()));
-
-  useEffect(() => {
-    const { data: subscription } = supabase.auth.onAuthStateChange((event, session) => {
-      if (event === 'SIGNED_IN') {
-        setSession(extendSess(session));
-      }
-    });
-    return () => subscription?.unsubscribe();
-  }, [supabase]);
-
-  return session;
-};

package/src/blog/hooks/use_text_plain_file.ts

@@ -1,36 +0,0 @@
-import { useEffect, useState } from "react";
-
-export type Result = {
-  content: string;
-  title: string;
-  reader: (f: File) => void;
-};
-
-export const useTextPlainFile = (): Result => {
-  const [content, setContent] = useState("");
-  const [file, setFile] = useState<File | null>(null);
-
-  const reader = new FileReader();
-
-  useEffect(() => {
-    if (file != null) {
-      reader.readAsText(file, "utf-8");
-    }
-
-    reader.onload = function () {
-      setContent(reader.result as string);
-    };
-
-    return () => {
-      reader.onload = null;
-    };
-  }, [file]);
-
-  return {
-    content,
-    title: file?.name ?? "",
-    reader: (f: File) => {
-      setFile(f);
-    },
-  };
-};

package/src/blog/hooks/use_uploader.ts

@@ -1,34 +0,0 @@
-import { useCallback } from "react";
-import { useSupabaseSession } from "@/hooks/use_supa_session";
-import { apiFetcher, getImageFileSize, withToken } from "@/utils";
-import { Photo } from "@/types/photo";
-import { API } from "@/constants/routes";
-import { UploadResult } from "@/types/oss";
-
-export const useUploader = () => {
-  const { access_token: token } = useSupabaseSession() || {};
-  const authedApiFetcher = withToken(apiFetcher)(token);
-
-  return useCallback(
-    async (pid: string, projectName: string, file: File): Promise<Photo> => {
-      const { width, height } = await getImageFileSize(file);
-
-      const url = `${API.UPLOAD_IMG}?pid=${pid}&fileName=${file.name}&projectName=${projectName}&width=${width}&height=${height}`;
-
-      const result = (await authedApiFetcher(url, {
-        method: "POST",
-        headers: {
-          "Content-Type": "application/octet-stream",
-        },
-        body: file,
-      })) as UploadResult;
-
-      return {
-        width,
-        height,
-        src: result.url,
-      };
-    },
-    [token]
-  );
-};