chore: Merge pull request #35 from vg-land/v2

fix: error while use pnpm

package.json

@@ -25,6 +25,7 @@
   "dependencies": {
     "@chakra-ui/icons": "^1.1.7",
     "@chakra-ui/react": "^1.8.5",
+    "@chakra-ui/theme-tools": "^1.3.6",
     "@choc-ui/paginator": "^3.4.0",
     "@emotion/react": "^11.8.1",
     "@emotion/styled": "^11.8.1",
@@ -53,6 +54,7 @@
     "ts-md5": "^1.2.11"
   },
   "devDependencies": {
+    "@types/node": "^17.0.21",
     "@types/react": "^17.0.39",
     "@types/react-dom": "^17.0.11",
     "@types/react-router-dom": "^5.1.8",

src/components/overlay/index.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import ToTop from './to-top';
 import Ss from './site-settings';
-import { Box } from '@chakra-ui/layout';
+import { Box } from '@chakra-ui/react';
 
 const Overlay = (props:any) => {
   return <Box className="overlay" zIndex="100">

src/components/overlay/to-top.tsx

@@ -1,4 +1,4 @@
-import { IconButton } from "@chakra-ui/button";
+import { IconButton } from "@chakra-ui/react";
 import React, { useEffect, useState } from "react";
 import { FiArrowUp } from "react-icons/fi";
 

src/pages/list/layout/nav.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { useLocation } from "react-router";
+import { useLocation } from "react-router-dom";
 import {
   Breadcrumb,
   BreadcrumbItem,

src/pages/list/preview/markdown.tsx

@@ -1,9 +1,8 @@
 import React, { useContext, useEffect } from "react";
 import { FileProps, IContext } from "../context";
 import axios from "axios";
-import { useColorModeValue } from "@chakra-ui/color-mode";
-import { Spinner } from "@chakra-ui/spinner";
-import { Box, Center } from "@chakra-ui/layout";
+import { Spinner, useColorModeValue } from "@chakra-ui/react";
+import { Box, Center } from "@chakra-ui/react";
 import { useTranslation } from "react-i18next";
 import useFileUrl from "../../../hooks/useFileUrl";
 import ReactMarkdown from "react-markdown";
@@ -58,7 +57,7 @@ const Markdown = ({ file, readme }: FileProps) => {
           setContent(res);
         } else {
           setContent(
-            "```" + file.name.split(".").pop() + "\n" + res + "\n" + "```"
+            "```" + file.name.split(".").pop() + "\n" + res + "\n" + "```",
           );
         }
       });
@@ -74,7 +73,9 @@ const Markdown = ({ file, readme }: FileProps) => {
       <Box w="full">
         {html && (
           <FormControl display="flex" alignItems="center" m="1">
-            <FormLabel htmlFor="render" mb="0">Render?</FormLabel>
+            <FormLabel htmlFor="render" mb="0">
+              Render?
+            </FormLabel>
             <Switch
               id="render"
               isChecked={render}

src/pages/list/preview/office.tsx

@@ -1,6 +1,6 @@
-import { Box, Stack } from "@chakra-ui/layout";
+import { Box, Stack } from "@chakra-ui/react";
+import { useLocation } from "react-router-dom";
 import React, { lazy, useContext, useEffect } from "react";
-import { useLocation } from "react-router";
 import { FileProps, IContext } from "../context";
 import useUnfold from "../../../hooks/useUnfold";
 import request from "../../../utils/public";
@@ -33,13 +33,13 @@ const Office = ({ file }: FileProps) => {
     {
       name: "office",
       url: `https://view.officeapps.live.com/op/view.aspx?src=${encodeURIComponent(
-        url
+        url,
       )}`,
     },
     {
       name: "google",
       url: `https://docs.google.com/gview?url=${encodeURIComponent(
-        url
+        url,
       )}&embedded=true`,
     },
   ];
@@ -107,7 +107,7 @@ const Office = ({ file }: FileProps) => {
                   src={preview.url}
                   frameBorder="0"
                 />
-              )
+              ),
           )}
         </Box>
       )}

src/pages/manage/login.tsx

@@ -9,7 +9,7 @@ import {
 } from "@chakra-ui/react";
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { useHistory } from "react-router";
+import { useHistory } from "react-router-dom";
 import admin, { changeToken } from "../../utils/admin";
 
 const Login = () => {

src/theme.ts

@@ -53,7 +53,7 @@ const overrides: ThemeOverride = {
 
 const theme = extendTheme(
   overrides,
-  withDefaultColorScheme({ colorScheme: "twitter" })
+  withDefaultColorScheme({ colorScheme: "twitter" }),
 );
 
 export default theme;

tsconfig.json

@@ -13,7 +13,11 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "react",
+    "baseUrl": "./",
+    "paths": {
+      "~/*": ["./src/*"]
+    }
   },
   "include": ["./src"]
 }

vite.config.ts

@@ -2,22 +2,31 @@ import { defineConfig } from "vite";
 import reactRefresh from "@vitejs/plugin-react-refresh";
 import pluginRewriteAll from "vite-plugin-rewrite-all";
 import { useDynamicPublicPath } from "vite-plugin-dynamic-publicpath";
+import path from "path";
 
 // https://vitejs.dev/config/
 export default defineConfig({
   base: "",
+  resolve: {
+    alias: {
+      "~": path.resolve(__dirname, "src"),
+    },
+  },
+
   plugins: [
     reactRefresh(),
     pluginRewriteAll(),
     useDynamicPublicPath(),
   ],
+
   build: {
     target: "es2015",
   },
+
   define: {
     "process.env": {},
   },
-  server:{
-    host: "0.0.0.0"
-  }
+  server: {
+    host: "0.0.0.0",
+  },
 });