@bbki.ng/site 1.3.0 → 1.4.1

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # @bbki.ng/site
 
+## 1.4.1
+
+## 1.4.0
+
 ## 1.3.0
 
 ## 1.2.23

package/dev-dist/sw.js

@@ -98,7 +98,7 @@ define(["./workbox-baccbcc1"], function (workbox) {
     [
       {
         url: "index.html",
-        revision: "0.bokbbik67o8",
+        revision: "0.a0iqm7b3nfg",
       },
     ],
     {}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbki.ng/site",
-  "version": "1.3.0",
+  "version": "1.4.1",
   "description": "code behind bbki.ng",
   "main": "index.js",
   "scripts": {
@@ -16,8 +16,8 @@
     "url": "git+https://github.com/bbbottle/bbki.ng.git"
   },
   "dependencies": {
-    "@bbki.ng/components": "workspace:2.3.0",
-    "@supabase/supabase-js": "^1.30.6",
+    "@bbki.ng/components": "workspace:2.4.0",
+    "@supabase/supabase-js": "^1.35.4",
     "classnames": "2.3.1",
     "react": "^18.0.0",
     "react-cusdis": "^2.1.3",
@@ -28,7 +28,7 @@
     "swr": "^2.2.5"
   },
   "devDependencies": {
-    "@bbki.ng/stylebase": "workspace:0.2.0",
+    "@bbki.ng/stylebase": "workspace:0.3.0",
     "@mdx-js/mdx": "2.0.0-next.9",
     "@mdx-js/react": "^1.6.22",
     "@mdx-js/rollup": "3.0.0",

package/src/app.tsx

@@ -21,6 +21,7 @@ import {
   GlobalLoadingStateProvider,
 } from "@/global_loading_state_provider";
 import { UploadPage } from "@/pages/upload";
+import { AppCtxMenu } from "@/components/app_ctx_menu";
 
 const Layout = () => {
   const { isLoading } = useContext(GlobalLoadingContext);
@@ -28,7 +29,13 @@ const Layout = () => {
     <>
       <Page
         nav={
-          <Nav paths={usePaths()} className="blur-cover" loading={isLoading} />
+          <AppCtxMenu>
+            <Nav
+              paths={usePaths()}
+              className="blur-cover select-none"
+              loading={isLoading}
+            />
+          </AppCtxMenu>
         }
         main={<Outlet />}
       />

package/src/components/app_ctx_menu/LoginMenuItem.tsx

@@ -10,11 +10,10 @@ import React from "react";
 import { useNavigate } from "react-router-dom";
 
 export const LoginMenuItem = () => {
-  const isKing = useAuthed();
   const sess = useSupabaseSession();
   const nav = useNavigate();
 
-  if (isKing) {
+  if (sess?.user != null) {
     return <ContextMenuLabel inset>{sess?.user?.email ?? ""}</ContextMenuLabel>;
   }
 

package/src/components/article_ctx_menu/index.tsx

@@ -0,0 +1,52 @@
+import React, { ReactElement, useCallback } from "react";
+import { useAuthed } from "@/hooks/use_authed";
+import {
+  ContextMenu,
+  ContextMenuContent,
+  ContextMenuTrigger,
+  ContextMenuItem,
+} from "@bbki.ng/components";
+import { useNavigate, useParams } from "react-router-dom";
+import { useDelPost } from "@/hooks/use_delete_post";
+import { toast } from "sonner";
+import { confirm } from "@/utils";
+
+export const ArticleCtxMenu = (props: { children: ReactElement }) => {
+  const auth = useAuthed();
+  const del = useDelPost();
+  const routeParams = useParams();
+  const nav = useNavigate();
+  const title = routeParams.title;
+
+  if (!auth) {
+    return props.children;
+  }
+
+  if (title == null || title === "") {
+    return props.children;
+  }
+
+  const doDel = useCallback(() => {
+    del(title)
+      .then(() => {
+        toast.success("删除成功");
+        nav("/blog");
+      })
+      .catch(console.log);
+  }, [title]);
+
+  return (
+    <ContextMenu>
+      <ContextMenuTrigger>{props.children}</ContextMenuTrigger>
+      <ContextMenuContent className="w-128">
+        <ContextMenuItem
+          onClick={() => {
+            confirm("确认删除？", doDel);
+          }}
+        >
+          remove
+        </ContextMenuItem>
+      </ContextMenuContent>
+    </ContextMenu>
+  );
+};

package/src/constants/routes.ts

@@ -21,6 +21,7 @@ export const API = {
   PROJECTS: "projects",
   UPLOAD_IMG: "upload",
   POST: "post",
+  REMOVE_POST: "remove_post",
   MOVIES: "movies",
   IMAGES: "images",
   BOOKS: "books",

package/src/hooks/use_delete_post.ts

@@ -0,0 +1,22 @@
+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/main.tsx

@@ -15,9 +15,7 @@ const root = createRoot(container);
 root.render(
   <React.StrictMode>
     <Router>
-      <AppCtxMenu>
-        <App />
-      </AppCtxMenu>
+      <App />
       <Toaster />
       <Logger />
       <ReloadPrompt />

package/src/pages/extensions/txt/article.tsx

@@ -9,6 +9,7 @@ import { ArticlePage } from "@/components/article";
 import { GlobalLoadingContext } from "@/global_loading_state_provider";
 import { useFile2Post } from "@/hooks/use_file_to_post";
 import { useAuthed } from "@/hooks/use_authed";
+import { ArticleCtxMenu } from "@/components/article_ctx_menu";
 
 type TArticleMap = {
   [key: string]: ReactElement;
@@ -55,7 +56,9 @@ export default () => {
   return (
     <DropZone onDrop={reader} disabled={!isKing}>
       <ArticlePage title={title}>
-        <div dangerouslySetInnerHTML={{ __html: posts.content }} />
+        <ArticleCtxMenu>
+          <div dangerouslySetInnerHTML={{ __html: posts.content }} />
+        </ArticleCtxMenu>
       </ArticlePage>
     </DropZone>
   );

package/src/pages/login/index.tsx

@@ -1,13 +1,14 @@
-import React, { useState } from "react";
+import React, { useContext, useState } from "react";
 import { Button, ButtonType } from "@bbki.ng/components";
 import { OauthProvider } from "@/types/supabase";
 import { supabase } from "@/constants";
 import { ArticlePage } from "@/components/article";
 import { useSupabaseSession } from "@/hooks/use_supa_session";
 import { Navigate } from "react-router-dom";
+import { GlobalLoadingContext } from "@/global_loading_state_provider";
 
 export const Login = () => {
-  const [loading, setLoading] = useState(false);
+  const { isLoading, setIsLoading } = useContext(GlobalLoadingContext);
 
   const session = useSupabaseSession();
   if (session) {
@@ -16,18 +17,32 @@ export const Login = () => {
 
   return (
     <ArticlePage title="第三方账号登录">
-      <Button
-        type={loading ? ButtonType.DISABLED : ButtonType.PRIMARY}
-        className="ml-8"
-        onClick={async () => {
-          setLoading(true);
-          return supabase.auth.signIn({
-            provider: OauthProvider.GITHUB,
-          });
-        }}
-      >
-        GitHub
-      </Button>
+      <>
+        <Button
+          type={isLoading ? ButtonType.DISABLED : ButtonType.PRIMARY}
+          className="ml-8"
+          onClick={async () => {
+            setIsLoading(true);
+            return supabase.auth.signIn({
+              provider: OauthProvider.GITHUB,
+            });
+          }}
+        >
+          GitHub
+        </Button>
+        <Button
+          type={isLoading ? ButtonType.DISABLED : ButtonType.PRIMARY}
+          className="ml-8"
+          onClick={async () => {
+            setIsLoading(true);
+            return supabase.auth.signIn({
+              provider: OauthProvider.Twitter,
+            });
+          }}
+        >
+          Twitter
+        </Button>
+      </>
     </ArticlePage>
   );
 };

package/src/types/supabase.ts

@@ -6,4 +6,5 @@ export interface BBKingSession extends Session {
 
 export enum OauthProvider {
   GITHUB = "github",
+  Twitter = "twitter",
 }

package/src/utils/index.ts

@@ -3,6 +3,7 @@ import { ossProcessType } from "@/types/oss";
 import { API_ENDPOINT, OSS_ADDRESS } from "@/constants/routes";
 import { DEFAULT_DELAY } from "@/constants";
 import useSWR from "swr";
+import { toast } from "sonner";
 
 type Fetcher = (resource: string, init?: any) => Promise<any>;
 
@@ -153,3 +154,19 @@ export const getRandomInt = (min: number, max: number) => {
 export const copyToClipboard = async (value: string) => {
   await navigator.clipboard.writeText(value);
 };
+
+export const confirm = (message: string, exec: () => void) => {
+  toast("", {
+    description: message,
+    actionButtonStyle: {
+      backgroundColor: "#fff",
+      color: "rgb(37,99,235)",
+    },
+    action: {
+      label: "是",
+      onClick: () => {
+        exec();
+      },
+    },
+  });
+};