update chakra ui

layouts/nav/vertical-nav.tsx

@@ -12,7 +12,6 @@ import {
     Text
   } from "@chakra-ui/react"
   import siteConfig from "configs/site-config"
-  import { useViewportScroll } from "framer-motion"
   import NextLink from "next/link"
   import React, { useEffect, useState } from "react"
   import { FaBell, FaGithub, FaSearch } from "react-icons/fa"

package.json

@@ -11,12 +11,12 @@
     "analyze": "ANALYZE=true next build"
   },
   "dependencies": {
-    "@chakra-ui/icons": "^1.0.4",
+    "@chakra-ui/icons": "^1.0.13",
-    "@chakra-ui/props-docs": "1.0.13",
+    "@chakra-ui/props-docs": "1.0.29",
-    "@chakra-ui/react": "1.2.1",
+    "@chakra-ui/react": "1.6.4",
-    "@chakra-ui/skip-nav": "^1.1.0",
+    "@chakra-ui/skip-nav": "^1.1.9",
-    "@chakra-ui/theme-tools": "1.0.3",
+    "@chakra-ui/theme-tools": "1.1.7",
-    "@chakra-ui/utils": "1.1.0",
+    "@chakra-ui/utils": "1.8.0",
     "@docsearch/react": "^1.0.0-alpha.27",
     "@emotion/react": "^11.1.4",
     "@emotion/styled": "^11.0.0",
@@ -26,14 +26,14 @@
     "date-fns": "^2.16.1",
     "docsearch.js": "^2.6.3",
     "eventemitter3": "^4.0.4",
-    "formik": "^2.2.6",
+    "formik": "^2.2.5",
-    "framer-motion": "^3.1.1",
+    "framer-motion": "^4.0.0",
     "highlight.js": "^9.16.2",
     "json-bigint": "^1.0.0",
     "lodash": "^4.17.15",
     "markdown-to-jsx": "^7.1.1",
     "moment": "^2.27.0",
-    "next": "^10.0.4",
+    "next": "^10.0.5",
     "next-seo": "^4.17.0",
     "query-string": "^6.3.0",
     "react": "^17.0.1",

pages/tags/[name].tsx

@@ -23,6 +23,7 @@ import Head from "next/head"
 import { getUserName } from "utils/user"
 import Link from "next/link"
 import { getSvgIcon } from "components/svg-icon"
+import { SearchFilter } from "src/types/search"
 
 const UserPage = () => {
     const router = useRouter()
@@ -38,7 +39,7 @@ const UserPage = () => {
         }
     }, [tag])
 
-    const [filter, setFilter] = useState('Recent')
+    const [filter, setFilter] = useState(SearchFilter.Latest)
     const initPosts = (p) => {
         return requestApi.get(`/tag/posts/${tag.id}?filter=${filter}&page=${p}&per_page=5`)
     }
@@ -103,13 +104,13 @@ const UserPage = () => {
                                     </Box>
                                     <Box>
                                         {followed !== null && <Follow followed={followed} targetID={tag.id} />}
-                                        {isModerator() && <Button ml="2" onClick={() => router.push(`${ReserveUrls.Admin}/tag/${tag.name}`)}>Edit</Button>}
+                                        {session && isModerator() && <Button ml="2" onClick={() => router.push(`${ReserveUrls.Admin}/tag/${tag.name}`)}>Edit</Button>}
                                     </Box>
                                 </Flex>
 
                             </Card>
                             <Card p="2">
-                                <StoryFilters showBest={false} onChange={onFilterChange} />
+                                <StoryFilters showBest={false} onChange={onFilterChange} value={SearchFilter.Latest}/>
                             </Card>
                             <Card width="100%" height="fit-content" p="0" px="3">
                                 {tag.id &&  

src/components/story/story-filter.tsx

@@ -4,16 +4,15 @@ import { Button, HStack } from "@chakra-ui/react"
 
 interface Props {
   showBest?: boolean
+  value?: string
   onChange: any
 }
 
 export const StoryFilters = (props:Props) => {
-  const {showBest=true,onChange} = props
+  const {showBest=true,onChange,value="Best"} = props
-  let initFilter = 'Best'
+  let initFilter = value
   let filters = ['Recent','Week','Month','Year','Latest']
-  if (!showBest) {
+  if (showBest) {
-      initFilter = 'Recent'
-  } else {
       filters.unshift('Best')
   }