From 1c174a3b1cb5bca00d0de177a7717093fc1dbd22 Mon Sep 17 00:00:00 2001
From: Simon Cambier <simon.cambier@protonmail.com>
Date: Thu, 22 Feb 2024 11:55:41 +0100
Subject: [PATCH] Fixed hljs langs mapping

---
 src/components/EditForm.svelte |  3 ++-
 src/lib/utils.ts               |  7 +++++++
 src/routes/+page.svelte        | 10 +++++++---
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/components/EditForm.svelte b/src/components/EditForm.svelte
index 55eabe4..5a9a909 100644
--- a/src/components/EditForm.svelte
+++ b/src/components/EditForm.svelte
@@ -6,6 +6,7 @@
   import ComboBox from './ComboBox.svelte'
   import Icon from '@iconify/svelte'
   import { goto } from '$app/navigation'
+  import hljs from 'highlight.js'
 
   type Language = {
     text: string
@@ -31,7 +32,7 @@
   })
 
   selectedLang.subscribe((lang) => {
-    textWrap = lang === 'plt' || lang === 'md'
+    textWrap = lang === 'plaintext' || lang === 'markdown'
   })
 
   $: {
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index 3c0f539..bf8ed41 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -1,3 +1,5 @@
+import hljs from 'highlight.js'
+
 export const slugify = (str: string) =>
   str
     .trim()
@@ -37,3 +39,8 @@ export const byId = (id: string) => document.getElementById(id)
 export function isInIframe(): boolean {
   return window !== window.parent
 }
+
+export function getHljsLangFromShort(short: string): string {
+  const langs = hljs.listLanguages().map((lang) => ({ lang, short: shorten(lang) }))
+  return langs.find((l) => l.short === short)?.lang ?? 'plaintext'
+}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 7f365bc..fa46ae3 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -8,7 +8,7 @@
   import rehypeStringify from 'rehype-stringify'
   import hljs from 'highlight.js'
   import 'highlight.js/styles/nord.min.css'
-  import { getLangFromUrl, isInIframe } from '$lib/utils'
+  import { getHljsLangFromShort, getLangFromUrl, isInIframe } from '$lib/utils'
   import TopBar from '../components/TopBar.svelte'
   import Icon from '@iconify/svelte'
   import CodeView from '../components/CodeView.svelte'
@@ -26,12 +26,16 @@
       let lang = getLangFromUrl()
       // Remove github flavored markdown, redundant with markdown
       lang = lang === 'gflm' ? 'md' : lang
+
+      // Get the correct language name for hljs
+      lang = getHljsLangFromShort(lang)
+
       // decompress the data
       const { decompress } = await import('$lib/brotli')
       decompressed = await decompress(hash)
 
       // Markdown
-      if (lang === 'md') {
+      if (lang === 'markdown') {
         const html = await unified()
           .use(remarkParse)
           .use(remarkGfm)
@@ -43,7 +47,7 @@
         htmlContent = html.toString()
       }
       // Plain text
-      else if (lang === 'plt' || !lang) {
+      else if (lang === 'plaintext' || !lang) {
         isPlainText = true
       }
       // Code