From 59a8f61d085079511ac52505947468f4b341b1dc Mon Sep 17 00:00:00 2001
From: Arthals <36695271+zhuozhiyongde@users.noreply.github.com>
Date: Tue, 5 Mar 2024 19:10:20 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20Add=20support=20for=20unknown=20languag?=
 =?UTF-8?q?es=20&=20style:=20Update=20code=20line=20for=E2=80=A6=20(#306)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: Add support for unknown languages & style: Update code line formatting

* fix: lang tag z-index

* fix: case in-sensive

* revert: Multiple highlighters
---
 .../ui/code-highlighter/shiki/Shiki.module.css           | 2 +-
 src/components/ui/code-highlighter/shiki/Shiki.tsx       | 9 ++++-----
 src/components/ui/code-highlighter/shiki/utils.tsx       | 2 +-
 3 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/components/ui/code-highlighter/shiki/Shiki.module.css b/src/components/ui/code-highlighter/shiki/Shiki.module.css
index 04d4833182..97d37ebe95 100644
--- a/src/components/ui/code-highlighter/shiki/Shiki.module.css
+++ b/src/components/ui/code-highlighter/shiki/Shiki.module.css
@@ -17,7 +17,7 @@
     }
 
     .line {
-      @apply block min-h-[1em] px-4;
+      @apply block min-h-[1em];
     }
 
     .highlighted,
diff --git a/src/components/ui/code-highlighter/shiki/Shiki.tsx b/src/components/ui/code-highlighter/shiki/Shiki.tsx
index 59fde19429..fecf4e79bc 100644
--- a/src/components/ui/code-highlighter/shiki/Shiki.tsx
+++ b/src/components/ui/code-highlighter/shiki/Shiki.tsx
@@ -64,9 +64,8 @@ export const ShikiHighLighter: FC<Props> = (props) => {
           () => import('shiki/langs/vue.mjs'),
           () => import('shiki/langs/html.mjs'),
           () => import('shiki/langs/asm.mjs'),
-          () => import('shiki/langs/bash.mjs'),
+          () => import('shiki/langs/shell.mjs'),
           () => import('shiki/langs/ps.mjs'),
-          () => import('shiki/langs/ps1.mjs'),
         ],
         loadWasm: getWasm,
       })
@@ -103,7 +102,7 @@ export const ShikiHighLighter: FC<Props> = (props) => {
     return codeHighlighter(highlighter, {
       attrs: attrs || '',
       code: value,
-      lang: language || '',
+      lang: language ? language.toLowerCase() : '',
     })
   }, [attrs, language, value, highlighter])
 
@@ -132,7 +131,7 @@ export const ShikiHighLighter: FC<Props> = (props) => {
       {!filename && !!language && (
         <div
           aria-hidden
-          className="pointer-events-none absolute bottom-3 right-3 text-sm opacity-60"
+          className="pointer-events-none absolute bottom-3 right-3 z-10 text-sm opacity-60"
         >
           {language.toUpperCase()}
         </div>
@@ -152,7 +151,7 @@ export const ShikiHighLighter: FC<Props> = (props) => {
           <div
             ref={setCodeBlockRef}
             className={clsxm(
-              'relative max-h-[50vh] w-full overflow-auto scrollbar-none',
+              'relative max-h-[50vh] w-full overflow-auto px-4 scrollbar-none',
               !isCollapsed ? '!max-h-[100%]' : isOverflow ? maskClassName : '',
             )}
             dangerouslySetInnerHTML={
diff --git a/src/components/ui/code-highlighter/shiki/utils.tsx b/src/components/ui/code-highlighter/shiki/utils.tsx
index 2d5f068cdd..905d8bf200 100644
--- a/src/components/ui/code-highlighter/shiki/utils.tsx
+++ b/src/components/ui/code-highlighter/shiki/utils.tsx
@@ -84,5 +84,5 @@ export const isSupportedShikiLang = (lang: string) => {
     'plaintext',
     'txt',
     'plain',
-  ].includes(lang)
+  ].includes(lang.toLowerCase())
 }