Json server

.github/workflows/deploy.yml

@@ -18,16 +18,24 @@ jobs:
         run: |
           npm i pnpm -g
           pnpm i
-          pnpm run build
+          pnpm run build:index
+          cp ./dist/html/index.html ./dist/html/404.html
 
-      - name: SSH Server Deploy
-        uses: kostya-ten/ssh-server-deploy@v4
+      - name: deploy to github pages
+        uses: peaceiris/actions-gh-pages@v3
         with:
-          host: ${{ secrets.SSH_HOST }}
-          port: 22
-          username: ${{ secrets.SSH_USER }}
-          password: ${{ secrets.SSH_PASSWORD }}
-          scp_source: ./dist/*
-          scp_target: /var/www/yszm/
-          after_script: |
-            whoami
+          github_token: ${{ secrets.GIT_HUB_TOKEN }}
+          publish_dir: ./dist/html
+          publish_branch: gh-pages
+
+      # - name: SSH Server Deploy
+      #   uses: kostya-ten/ssh-server-deploy@v4
+      #   with:
+      #     host: ${{ secrets.SSH_HOST }}
+      #     port: 22
+      #     username: ${{ secrets.SSH_USER }}
+      #     password: ${{ secrets.SSH_PASSWORD }}
+      #     scp_source: ./dist/*
+      #     scp_target: /var/www/yszm/
+      #     after_script: |
+      #       whoami

README.md

@@ -1,3 +1,12 @@
-# web
+# 🌸 Free anime without ads
 
-[![Server Deploy](https://github.com/upvorg/web2/actions/workflows/deploy.yml/badge.svg)](https://github.com/upvorg/web2/actions/workflows/deploy.yml)
+- https://onime.netlify.app
+- https://upvorg.github.io
+
+## Status
+
+[![SSH Server Deploy](https://github.com/upvorg/upvorg.github.io/actions/workflows/deploy.yml/badge.svg?branch=json-server)](https://github.com/upvorg/upvorg.github.io/actions/workflows/deploy.yml)
+
+open -n /Applications/Google\ Chrome.app/ --args --disable-web-security --user-data-dir=/Users/a11/MyChromeDevUserData/
+
+https://experienceleague.adobe.com/docs/target/using/experiences/vec/troubleshoot-composer/mixed-content.html?lang=en

package.json

@@ -13,48 +13,48 @@
     "build": "pnpm run build:index & pnpm run build:admin"
   },
   "dependencies": {
-    "@types/node": "^18.7.16",
-    "@types/react": "^18.0.18",
-    "@types/react-dom": "^18.0.6",
+    "@types/node": "^20.10.6",
+    "@types/react": "^18.2.46",
+    "@types/react-dom": "^18.2.18",
     "bulma": "^0.9.4",
     "bulma-list": "^1.2.0",
     "bulma-switch": "^2.0.4",
     "bulma-tooltip": "^3.0.2",
-    "classnames": "^2.3.1",
-    "query-string": "^7.1.1",
+    "classnames": "^2.5.1",
+    "query-string": "^8.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-hot-toast": "^2.3.0",
-    "typescript": "^4.8.3",
-    "wouter": "^2.8.0-alpha.2"
+    "react-hot-toast": "^2.4.1",
+    "typescript": "^5.3.3",
+    "wouter": "^2.12.1"
   },
   "devDependencies": {
-    "@svgr/webpack": "^6.3.1",
-    "autoprefixer": "^10.4.8",
-    "browserslist": "^4.21.3",
+    "@svgr/webpack": "^8.1.0",
+    "autoprefixer": "^10.4.16",
+    "browserslist": "^4.22.2",
     "clean-webpack-plugin": "^4.0.0",
     "copy-webpack-plugin": "^11.0.0",
     "cross-env": "^7.0.3",
-    "css-loader": "^6.7.1",
-    "css-minimizer-webpack-plugin": "^4.0.0",
-    "esbuild-loader": "^2.20.0",
+    "css-loader": "^6.8.1",
+    "css-minimizer-webpack-plugin": "^5.0.1",
+    "esbuild-loader": "^3.2.0",
     "file-loader": "^6.2.0",
-    "html-webpack-plugin": "^5.5.0",
-    "mini-css-extract-plugin": "^2.6.1",
-    "postcss": "^8.4.16",
+    "html-webpack-plugin": "^5.6.0",
+    "mini-css-extract-plugin": "^2.7.6",
+    "postcss": "^8.4.33",
     "postcss-flexbugs-fixes": "^5.0.2",
-    "postcss-loader": "^7.0.1",
-    "postcss-preset-env": "^7.8.1",
+    "postcss-loader": "^7.3.4",
+    "postcss-preset-env": "^9.3.0",
     "resolve-url-loader": "^5.0.0",
-    "sass": "^1.54.9",
-    "sass-loader": "^13.0.2",
-    "style-loader": "^3.3.1",
-    "terser-webpack-plugin": "^5.3.6",
-    "webpack": "^5.74.0",
-    "webpack-bundle-analyzer": "^4.6.1",
-    "webpack-cli": "^4.10.0",
-    "webpack-dev-server": "^4.11.0",
-    "webpack-merge": "^5.8.0"
+    "sass": "^1.69.7",
+    "sass-loader": "^13.3.3",
+    "style-loader": "^3.3.3",
+    "terser-webpack-plugin": "^5.3.10",
+    "webpack": "^5.89.0",
+    "webpack-bundle-analyzer": "^4.10.1",
+    "webpack-cli": "^5.1.4",
+    "webpack-dev-server": "^4.15.1",
+    "webpack-merge": "^5.10.0"
   },
   "repository": {
     "type": "git",

packages/admin/package.json

@@ -11,6 +11,6 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@web/shared": "workspace:^1.0.0"
+    "@web/shared": "workspace:^"
   }
 }

packages/index/package.json

@@ -11,13 +11,13 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@web/shared": "workspace:^1.0.0",
-    "copy-text-to-clipboard": "^3.0.1",
-    "react-content-loader": "^6.2.0",
+    "@web/shared": "workspace:^",
+    "copy-text-to-clipboard": "^3.2.0",
+    "react-content-loader": "^6.2.1",
     "react-helmet": "^6.1.0",
-    "use-query-params": "^1.2.3"
+    "use-query-params": "^2.2.1"
   },
   "devDependencies": {
-    "@types/react-helmet": "^6.1.5"
+    "@types/react-helmet": "^6.1.11"
   }
 }

packages/index/src/components/DarkModeSwitch.tsx

@@ -0,0 +1,30 @@
+// import { Switch } from '@headlessui/react'
+// import { useDarkModeInternal } from '../hooks/useDarkMode'
+// import classNames from 'classnames'
+
+// export const DarkModeSwitch = () => {
+//   const { value: isDark, toggle } = useDarkModeInternal()
+//   return (
+//     <Switch
+//       checked={isDark || false}
+//       onClick={(e) => toggle(e)}
+//       className={classNames(
+//         `${isDark ? 'bg-accent' : 'bg-gray-200'}`,
+//         ` relative inline-flex h-6 w-11 items-center rounded-full text-base dark:text-always-gray-200 text-always-gray-700 align-middle`
+//       )}
+//     >
+//       <span className="sr-only">Switch Dark Mode</span>
+//       <span
+//         className={`${
+//           isDark ? 'translate-x-6' : 'translate-x-1'
+//         } inline-block h-4 w-4 transform rounded-full bg-white transition`}
+//       />
+
+//       {isDark ? (
+//         <i className="icon-[mingcute--moon-line] translate-x-2 scale-75" />
+//       ) : (
+//         <i className="icon-[mingcute--sun-line] scale-75 -translate-x-3" />
+//       )}
+//     </Switch>
+//   )
+// }

packages/index/src/components/comment/index.scss

@@ -5,7 +5,7 @@
     display: block !important;
     margin-right: 6px;
     line-height: 34px;
-    color: var(--text1);
+    // color: var(--text1);
     pointer-events: none;
     font-weight: 500;
     font-size: 20px;
@@ -140,3 +140,8 @@
     color: var(--text1);
   }
 }
+
+.dark .video-comment .video-comment-edit__input {
+  background-color: rgba(255, 255, 255, 0.15);
+  border: none;
+}

packages/index/src/components/comment/index.tsx

@@ -20,9 +20,14 @@ const Comment = ({ id, onFocus, onBlur }: CommentProps) => {
   const user = useUserStore()
 
   useEffect(() => {
-    axios.get(`/post/${id}/comments`).then((c) => {
-      setComments(c?.data || [])
-    })
+    axios
+      .get(`/post/${id}/comments`)
+      .then((c) => {
+        setComments(c?.data || [])
+      })
+      .catch(() => {
+        setComments([])
+      })
   }, [])
 
   const doComment = () => {

packages/index/src/components/header/index.scss

@@ -14,6 +14,34 @@
   padding: 0;
 }
 
+.dark .navbar-burger {
+  color: unset;
+}
+
+html.dark body .navbar,
+html.dark .navbar-menu {
+  background-color: #000 !important;
+}
+
+.dark a:hover,
+.dark .navbar-item,
+.navbar-link {
+  color: #fff;
+}
+
+.dark {
+  a.navbar-item:focus,
+  a.navbar-item:focus-within,
+  a.navbar-item:hover,
+  a.navbar-item.is-active,
+  .navbar-link:focus,
+  .navbar-link:focus-within,
+  .navbar-link:hover,
+  .navbar-link.is-active {
+    background-color: rgba(95, 95, 95, 0.1);
+  }
+}
+
 @media (max-width: 991px) {
   .navbar-item.avatar {
     padding: auto;

packages/index/src/components/header/index.tsx

@@ -6,12 +6,14 @@ import { useEffect, useRef, useState } from 'react'
 import { Link, useRoute } from 'wouter'
 import { ReactComponent as FaUpload } from '../../assets/icon/fa-arrow-up-from-bracket.svg'
 import './index.scss'
+import { useDarkModeInternal } from '../../hooks/useDarkMode'
 
 export default function Header() {
   const searchValue = useRef('')
   const [isSearchPage] = useRoute('/search')
   const [searchPlaceholder, setSearchPlaceholder] = useState('Search')
   const user = useUserStore()
+  const { value, toggle } = useDarkModeInternal()
 
   useEffect(() => {
     if (!__DEV__) {
@@ -44,13 +46,7 @@ export default function Header() {
             <h1 className="logo">UPV</h1>
           </a>
         </Link>
-        <a
-          role="button"
-          className="navbar-burger"
-          aria-label="menu"
-          aria-expanded="false"
-          data-target="upv-nav"
-        >
+        <a role="button" className="navbar-burger" aria-label="menu" aria-expanded="false" data-target="upv-nav">
           <span aria-hidden="true"></span>
           <span aria-hidden="true"></span>
           <span aria-hidden="true"></span>
@@ -60,19 +56,23 @@ export default function Header() {
       <div id="upv-nav" className="navbar-menu">
         <div className="navbar-start">
           <Link href="/">
-            <a className="navbar-item">首页</a>
+            <a className="navbar-item">Home</a>
           </Link>
           <a className="navbar-item" href="/anime/index" target="_blank">
-            新番时间表
+            Schedule
           </a>
-          <a className="navbar-item" href="//app.upv.life" target="_blank">
-            APP 下载
-          </a>
-          <a className="navbar-item" href="https://jq.qq.com/?_wv=1027&k=VUKNMvGC" target="_blank">
-            加入我们
+          <a
+            className="navbar-item"
+            href="https://cdn.jsdelivr.net/gh/upvorg/cdn@master/apk/app-arm64-v8a-release.apk"
+            target="_blank"
+          >
+            App
           </a>
+          {/* <a className="navbar-item" href="https://jq.qq.com/?_wv=1027&k=VUKNMvGC" target="_blank">
+            Join-Us
+          </a> */}
           <a className="navbar-item" href="/about" target="_blank">
-            关于我们
+            About
           </a>
         </div>
 
@@ -104,7 +104,7 @@ export default function Header() {
                   <button className="delete is-small" type="reset"></button>
                 </div>
               </div>
-              <span className="nav-search-btn icon">
+              <button className="nav-search-btn icon">
                 <svg
                   aria-hidden="true"
                   focusable="false"
@@ -120,22 +120,38 @@ export default function Header() {
                     d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"
                   ></path>
                 </svg>
-              </span>
+              </button>
             </form>
           </div>
         )}
 
         <div className="navbar-end">
+          <div className="navbar-item theme" onClick={toggle}>
+            <button className="button is-light" aria-haspopup="true" aria-controls="dropdown-menu4">
+              {value ? (
+                <svg viewBox="0 0 1024 1024">
+                  <path
+                    d="M185.335 178.178l-2.742-2.384c-13.39-11.534-14.895-31.74-3.36-45.13a32 32 0 0 1 4.324-4.158C249.354 74.17 337.575 48 448.22 48 704.358 48 912 255.74 912 512l-0.062 7.673C907.842 772.394 701.797 976 448.22 976c-110.645 0-198.866-26.169-264.663-78.506a32 32 0 0 1-4.325-4.159c-11.419-13.256-10.058-33.192 2.962-44.78l0.399-0.35 2.742-2.383c89.13-78.201 134.016-188.043 134.66-329.525L320 512c0.253-143.557-44.635-254.831-134.665-333.822z"
+                    fill="#FFC445"
+                  ></path>
+                </svg>
+              ) : (
+                <svg viewBox="0 0 1028 1024">
+                  <path d="M514.133333 509.866667m-256 0a256 256 0 1 0 512 0 256 256 0 1 0-512 0Z" fill="#FFC445"></path>
+                  <path
+                    d="M514.133333 170.666667c-19.2 0-32-14.933333-32-32V29.866667c0-17.066667 12.8-29.866667 29.866667-29.866667h2.133333c17.066667 0 32 14.933333 32 32v108.8c0 14.933333-14.933333 29.866667-32 29.866667zM514.133333 1024c-19.2 0-32-14.933333-32-32v-108.8c0-17.066667 14.933333-32 32-32h2.133334c17.066667 0 32 14.933333 32 32v108.8c-2.133333 17.066667-17.066667 32-34.133334 32zM853.333333 509.866667c0-19.2 14.933333-32 32-32h108.8c17.066667 0 32 14.933333 32 32v2.133333c0 17.066667-14.933333 32-32 32h-108.8c-17.066667-2.133333-32-17.066667-32-34.133333zM0 509.866667c0-19.2 14.933333-32 32-32h108.8c17.066667 0 32 14.933333 32 32v2.133333c0 17.066667-14.933333 32-32 32H32c-17.066667-2.133333-32-17.066667-32-34.133333zM742.4 247.466667c-12.8-12.8-12.8-32-2.133333-44.8l76.8-76.8c12.8-12.8 32-12.8 44.8 0V128c12.8 12.8 12.8 32 0 44.8l-76.8 76.8c-10.666667 10.666667-32 10.666667-42.666667-2.133333zM138.666667 851.2c-12.8-12.8-12.8-34.133333-2.133334-44.8l76.8-76.8c12.8-12.8 32-12.8 44.8 0l2.133334 2.133333c12.8 12.8 12.8 32 0 44.8L183.466667 853.333333c-12.8 10.666667-32 10.666667-44.8-2.133333zM740.266667 727.466667c12.8-12.8 34.133333-12.8 44.8-2.133334l76.8 76.8c12.8 12.8 12.8 32 0 44.8l-2.133334 2.133334c-12.8 12.8-32 12.8-44.8 0l-76.8-76.8c-10.666667-12.8-10.666667-32 2.133334-44.8zM136.533333 123.733333c12.8-12.8 34.133333-12.8 44.8-2.133333l76.8 76.8c12.8 12.8 12.8 32 0 44.8l-2.133333 2.133333c-12.8 12.8-32 12.8-44.8 0L136.533333 168.533333c-10.666667-12.8-10.666667-32 0-44.8z"
+                    fill="#FFC445"
+                  ></path>
+                </svg>
+              )}
+            </button>
+          </div>
           <div className="navbar-item upload">
             <a href={ADMIN_HOST} target="_blank">
-              <button
-                className="button is-primary"
-                aria-haspopup="true"
-                aria-controls="dropdown-menu4"
-              >
+              <button className="button is-primary" aria-haspopup="true" aria-controls="dropdown-menu4">
                 <FaUpload />
                 &nbsp;&nbsp;
-                <strong>投稿</strong>
+                <strong>Upload</strong>
               </button>
             </a>
           </div>
@@ -147,11 +163,7 @@ export default function Header() {
                 </figure>
               </div>
               <div className="navbar-dropdown is-right">
-                <a
-                  className="navbar-item"
-                  href={ADMIN_HOST + `/user/profile?name=${user.Name}`}
-                  target="_blank"
-                >
+                <a className="navbar-item" href={ADMIN_HOST + `/user/profile?name=${user.Name}`} target="_blank">
                   我的资料
                 </a>
                 <hr className="navbar-divider" />