Add trimNonLatin function to trim non-Latin characters from chara.desc

src/lib/UI/Realm/RealmHubIcon.svelte

@@ -2,6 +2,7 @@
     import { BookIcon, ImageIcon, SmileIcon } from "lucide-svelte";
     import { alertNormal } from "src/ts/alert";
     import { hubURL, type hubType } from "src/ts/characterCards";
+  import { trimNonLatin } from "src/ts/storage/globalApi";
 
     export let onClick = () => {}
     export let chara:hubType
@@ -13,7 +14,7 @@
     <img class="w-20 min-w-20 h-20 sm:h-28 sm:w-28 rounded-md object-top object-cover" alt={chara.name} src={`${hubURL}/resource/` + chara.img}>
     <div class="flex flex-col flex-grow min-w-0">
         <span class="text-textcolor text-lg min-w-0 max-w-full text-ellipsis whitespace-nowrap overflow-hidden text-start">{chara.name}</span>
-        <span class="text-textcolor2 text-xs min-w-0 max-w-full text-ellipsis break-words max-h-8 whitespace-nowrap overflow-hidden text-start">{chara.desc}</span>
+        <span class="text-textcolor2 text-xs min-w-0 max-w-full text-ellipsis break-words max-h-8 whitespace-nowrap overflow-hidden text-start">{trimNonLatin(chara.desc)}</span>
         <div class="flex flex-wrap">
             {#each chara.tags as tag, i}
                 {#if i < 4}

src/ts/storage/globalApi.ts

@@ -1472,4 +1472,10 @@ export function textifyReadableStream(stream:ReadableStream<Uint8Array>){
 
 export function toggleFullscreen(){
     document.fullscreenElement ? document.exitFullscreen() : document.documentElement.requestFullscreen()
+}
+
+export function trimNonLatin(data:string){
+    return data .replace(/[^\x00-\x7F]/g, "")
+                .replace(/ +/g, ' ')
+                .trim()
 }