Merge pull request #107 from besscroft/dev

v0.10.0
besscroft · Jul 30, 2024 · 058d023 · 058d023
2 parents 1e91b4a + a3208fb
commit 058d023
Show file tree

Hide file tree

Showing 6 changed files with 3,818 additions and 2,919 deletions.
diff --git a/app/admin/settings/about/page.tsx b/app/admin/settings/about/page.tsx
@@ -47,7 +47,7 @@ export default function About() {
         <span>支持我们</span>
         <Link
           className="flex items-center w-full p-2 hover:bg-slate-100"
-          href="https://afdian.net/a/besscroft"
+          href="https://afdian.com/a/besscroft"
           target="_blank"
         >
           <Avatar src="https://pic1.afdiancdn.com/default/avatar/avatar-purple.png" />

diff --git a/app/admin/settings/preferences/page.tsx b/app/admin/settings/preferences/page.tsx
@@ -10,7 +10,7 @@ export default function Preferences() {
   const [title, setTitle] = useState('')
   const [loading, setLoading] = useState(false)
 
-  const { data } = useSWR('/api/v1/get-custom-title', fetcher)
+  const { data, isValidating, isLoading } = useSWR('/api/v1/get-custom-title', fetcher)
 
   async function updateTitle() {
     try {
@@ -41,6 +41,7 @@ export default function Preferences() {
       <CardBody className="space-y-2">
         <Input
           isRequired
+          isDisabled={isValidating || isLoading}
           variant="bordered"
           value={title}
           type="text"

diff --git a/components/BlurImage.tsx b/components/BlurImage.tsx
@@ -10,23 +10,19 @@ export default function BlurImage({ photo, dataList }: { photo: any, dataList: a
   )
 
   return (
-    <div className="my-2">
-      <Image
-        src={photo.src}
-        alt={photo.alt}
-        width={photo.width}
-        height={photo.height}
-        loading="lazy"
-        disableSkeleton
-        shadow="sm"
-        radius="none"
-        onClick={() => {
-          setMasonryView(true)
-          setMasonryViewData(photo)
-          setMasonryViewDataList(dataList)
-        }}
-        className="duration-700 ease-in-out group-hover:opacity-75 cursor-pointer transition-all will-change-transform hover:scale-[1.01]"
-      />
-    </div>
+    <Image
+      src={photo.src}
+      alt={photo.alt}
+      width={photo.width}
+      loading="lazy"
+      shadow="sm"
+      radius="none"
+      onClick={() => {
+        setMasonryView(true)
+        setMasonryViewData(photo)
+        setMasonryViewDataList(dataList)
+      }}
+      className="duration-700 ease-in-out group-hover:opacity-75 cursor-pointer transition-all will-change-transform hover:scale-[1.01]"
+    />
   )
 }
diff --git a/components/Masonry.tsx b/components/Masonry.tsx
@@ -2,7 +2,7 @@
 
 import React, { useEffect } from 'react'
 import { ImageHandleProps, ImageType } from '~/types'
-import PhotoAlbum from 'react-photo-album'
+import { MasonryPhotoAlbum, RenderImageContext, RenderImageProps } from 'react-photo-album'
 import { Button, Spinner } from '@nextui-org/react'
 import { useSWRPageTotalHook } from '~/hooks/useSWRPageTotalHook'
 import useSWRInfinite from 'swr/infinite'
@@ -13,6 +13,18 @@ import BlurImage from '~/components/BlurImage'
 import { useButtonStore } from '~/app/providers/button-store-Providers'
 import { FloatButton } from 'antd'
 
+import 'react-photo-album/masonry.css'
+
+function renderNextImage(
+  { alt = '', title, sizes }: RenderImageProps,
+  { photo }: RenderImageContext,
+  dataList: never[],
+) {
+  return (
+    <BlurImage photo={photo} dataList={dataList} />
+  );
+}
+
 export default function Masonry(props : Readonly<ImageHandleProps>) {
   const { data: pageTotal } = useSWRPageTotalHook(props)
   const { data, error, isLoading, isValidating, size, setSize } = useSWRInfinite((index) => {
@@ -60,29 +72,26 @@ export default function Masonry(props : Readonly<ImageHandleProps>) {
 
   return (
     <div className="w-full sm:w-4/5 mx-auto p-2">
-      <PhotoAlbum
+      <MasonryPhotoAlbum
         columns={(containerWidth) => {
           if (containerWidth < 768) return 2;
           if (containerWidth < 1024) return 3;
           return 4;
         }}
-        layout="masonry"
         photos={
           dataList?.map((item: ImageType) => ({
             src: item.preview_url || item.url,
             alt: item.detail,
             ...item
           })) || []
         }
-        renderPhoto={({ photo, wrapperStyle, renderDefaultPhoto }) => (
-          <BlurImage key={photo.id} photo={photo} dataList={dataList} />
-        )}
+        render={{image: (...args) => renderNextImage(...args, dataList)}}
       />
       <div className="flex items-center justify-center my-4">
         {
           isValidating ?
             <Spinner label="Loading..." color="primary" />
-            :
+            : dataList.length > 0 ?
           size < pageTotal &&
             <Button
               color="primary"
@@ -95,6 +104,7 @@ export default function Masonry(props : Readonly<ImageHandleProps>) {
             >
               加载更多
             </Button>
+            : '暂无图片'
         }
       </div>
       <FloatButton.BackTop />

diff --git a/package.json b/package.json
@@ -6,67 +6,67 @@
   "scripts": {
     "dev": "pnpm run prisma:generate && next dev",
     "build": "next build",
-    "build:vercel": "pnpm run prisma:deploy && next build",
-    "build:node": "pnpm run prisma:deploy && next build",
+    "build:vercel": "pnpm run prisma:deploy && npx prisma generate && next build",
+    "build:node": "pnpm run prisma:deploy && npx prisma generate && next build",
     "start": "next start",
     "lint": "next lint",
     "prisma:format": "npx prisma format",
     "prisma:generate": "npx prisma generate",
     "prisma:dev": "npx prisma migrate dev",
     "prisma:deploy": "npx prisma migrate deploy",
-    "postinstall": "npx prisma generate"
+    "prebuild": "npx prisma generate"
   },
   "dependencies": {
     "@ant-design/nextjs-registry": "^1.0.0",
-    "@auth/prisma-adapter": "^2.2.0",
-    "@aws-sdk/client-s3": "^3.592.0",
-    "@douyinfe/semi-ui": "^2.60.0",
-    "@nextui-org/react": "^2.4.1",
-    "@prisma/client": "^5.15.0",
-    "@radix-ui/react-dialog": "^1.0.5",
-    "@radix-ui/react-dropdown-menu": "^2.0.6",
+    "@auth/prisma-adapter": "^2.4.2",
+    "@aws-sdk/client-s3": "^3.620.1",
+    "@douyinfe/semi-ui": "^2.63.1",
+    "@nextui-org/react": "^2.4.6",
+    "@prisma/client": "^5.17.0",
+    "@radix-ui/react-dialog": "^1.1.1",
+    "@radix-ui/react-dropdown-menu": "^2.1.1",
     "@radix-ui/react-icons": "^1.3.0",
-    "@radix-ui/react-select": "^2.0.0",
-    "antd": "^5.18.1",
+    "@radix-ui/react-select": "^2.1.1",
+    "antd": "^5.19.4",
     "canvas-confetti": "^1.9.3",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
     "compressorjs": "^1.2.1",
     "crypto-js": "^4.2.0",
     "cuid": "^3.0.0",
-    "dayjs": "^1.11.11",
+    "dayjs": "^1.11.12",
     "exifreader": "^4.23.3",
-    "lucide-react": "^0.394.0",
-    "next": "^14.2.4",
+    "lucide-react": "0.417.0",
+    "next": "^14.2.5",
     "next-auth": "^5.0.0-beta.19",
-    "next-nprogress-bar": "^2.3.12",
+    "next-nprogress-bar": "^2.3.13",
     "next-themes": "^0.3.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "react-photo-album": "^2.4.0",
+    "react-photo-album": "^3.0.0",
     "server-only": "^0.0.1",
     "sharp": "^0.33.4",
     "sonner": "^1.5.0",
     "swr": "^2.2.5",
-    "tailwind-merge": "^2.3.0",
+    "tailwind-merge": "^2.4.0",
     "tailwind-scrollbar-hide": "^1.1.7",
     "tailwindcss-animate": "^1.0.7",
     "vaul": "^0.9.1",
     "zod": "^3.23.8",
-    "zustand": "^4.5.2"
+    "zustand": "^4.5.4"
   },
   "devDependencies": {
     "@types/canvas-confetti": "^1.6.4",
     "@types/crypto-js": "^4.2.2",
-    "@types/node": "^20.14.2",
+    "@types/node": "^20.14.13",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
     "autoprefixer": "^10.4.19",
     "eslint": "^8.57.0",
-    "eslint-config-next": "^14.2.4",
-    "postcss": "^8.4.38",
-    "prisma": "^5.15.0",
-    "tailwindcss": "^3.4.4",
-    "typescript": "^5.4.5"
+    "eslint-config-next": "^14.2.5",
+    "postcss": "^8.4.40",
+    "prisma": "^5.17.0",
+    "tailwindcss": "^3.4.7",
+    "typescript": "^5.5.4"
   }
 }