feat: rm onefile page

package.json

@@ -46,8 +46,9 @@
     "react-i18next": "^14.1.2",
     "react-icons": "^4.3.1",
     "react-infinite-scroll-hook": "^4.0.3",
-    "react-markdown": "^8.0.3",
+    "react-markdown": "^9.0.1",
     "react-syntax-highlighter": "^15.5.0",
+    "remark-gfm": "^4.0.0",
     "sortablejs": "^1.15.0",
     "swr": "^1.3.0",
     "tailwind-merge": "^1.2.1"

src/components/buttons/RankButton.tsx

@@ -19,7 +19,6 @@ const RankButton = ({ t, type = '' }: RankButtonProps) => {
     { key: '/periodical', value: t('header.periodical') },
     { key: '/report/tiobe', value: t('header.rank') },
     { key: '/article', value: t('header.article') },
-    { key: '/onefile', value: 'OneFile' },
   ];
 
   const onChange = async (opt: option) => {

src/components/layout/Header.tsx

@@ -76,9 +76,6 @@ const Header = () => {
           <li className={liClassName('/article')}>
             <HeaderBtn pathname='/article'>{t('header.article')}</HeaderBtn>
           </li>
-          <li className={liClassName('/onefile')}>
-            <HeaderBtn pathname='/onefile'>OneFile</HeaderBtn>
-          </li>
           {/* 移动端显示的登录按钮和头像 */}
           <li className='block md:hidden'>
             {!isLogin ? <LoginButton t={t} /> : <AvatarWithDropdown t={t} />}

src/components/mdRender/MDRender.tsx

@@ -1,6 +1,7 @@
 import ReactMarkdown from 'react-markdown';
 import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
 import { atomDark, vs } from 'react-syntax-highlighter/dist/cjs/styles/prism';
+import remarkGfm from 'remark-gfm';
 
 import clsxm from '@/lib/clsxm';
 import { useLoginContext } from '@/hooks/useLoginContext';
@@ -32,7 +33,7 @@ export const CodeRender = ({ code, lanuage }: CodeProps) => {
     }
   } else {
     return (
-      <span className='rounded-sm bg-gray-100 px-1.5 py-0.5 text-sm  font-medium dark:bg-gray-600'>
+      <span className='rounded-sm bg-gray-100 px-1.5 py-0.5 text-sm font-medium dark:bg-gray-600'>
         {code}
       </span>
     );
@@ -47,8 +48,9 @@ export const MDRender = ({
 }: MDRenderProps) => {
   const { theme } = useLoginContext();
 
-  const getCode = (theme: string) => {
+  const getComponents = (theme: string) => {
     return {
+      // 代码块渲染
       code({ node: _node, inline, className, children, ...props }: any) {
         const match = /language-(\w+)/.exec(className || '') || 'shell';
         if (!inline && match) {
@@ -79,7 +81,7 @@ export const MDRender = ({
         } else {
           return (
             <span
-              className='rounded-sm bg-gray-100 px-1.5 py-0.5 text-sm  font-medium dark:bg-gray-600'
+              className='rounded-sm bg-gray-100 px-1.5 py-0.5 text-sm font-medium dark:bg-gray-600'
               {...props}
             >
               {children}
@@ -92,7 +94,10 @@ export const MDRender = ({
 
   return (
     <div className={clsxm('', className)} {...rest}>
-      <ReactMarkdown components={getCode(theme)}>
+      <ReactMarkdown
+        remarkPlugins={[remarkGfm]}
+        components={getComponents(theme)}
+      >
         {mdString || children}
       </ReactMarkdown>
     </div>