feat-887 : persisted the value of dev language

src/lib/utils/persisted.ts

@@ -1,4 +1,5 @@
 import { writable } from 'svelte/store';
+import { browser } from '$app/environment';
 
 type Adapter = {
     get: (key: string) => unknown;
@@ -63,3 +64,38 @@ export const persisted = <Value>(
         set
     };
 };
+
+export const LASTSTATEDEVLANGUAGE_KEY = 'devLanguage';
+type LastStateDev= {
+    client:string;
+    others:string;
+}
+
+export const getParsedState = (): LastStateDev => {
+    let data:LastStateDev = {client : "", others: ""};
+    let storedValue =  browser ? localStorage.getItem(LASTSTATEDEVLANGUAGE_KEY)?? 
+     JSON.stringify(data): JSON.stringify(data);
+
+    data = JSON.parse(storedValue === null? JSON.stringify(data): storedValue);
+    return data;
+}
+
+export const setLastStateDevLanguage = (value:string) => {
+    if(!value) return ;
+    let data = getParsedState();
+
+    if(value?.includes("client-")){
+        data.client = value;
+    }
+    else {
+        data.others = value;
+    }
+    if(browser){
+        localStorage.setItem(LASTSTATEDEVLANGUAGE_KEY, JSON.stringify(data));
+    }
+}
+
+export const getLastStateDevLanguage = (): LastStateDev => {
+    const state = getParsedState();
+    return state;
+}

src/markdoc/tags/MultiCode.svelte

@@ -14,6 +14,7 @@
     import type { Language } from '$lib/utils/code';
     import { copy } from '$lib/utils/copy';
     import { Select, Tooltip } from '$lib/components';
+    import { setLastStateDevLanguage, getLastStateDevLanguage } from '$lib/utils/persisted';
 
     setContext<CodeContext>('multi-code', {
         selected: writable(null),
@@ -24,9 +25,24 @@
     const { snippets, selected, content } = getContext<CodeContext>('multi-code');
 
     snippets.subscribe((n) => {
-        if ($selected === null && n.size > 0) {
+        const state = getLastStateDevLanguage();
+
+        if (n.size > 0 && (Array.from(n).includes(state.client) 
+            || Array.from(n).includes(state.others))) {
+            if(state.client && Array.from(n).includes(state.client)){
+                $selected = state.client;
+            }
+            else if(state.others && Array.from(n).includes(state.others)){
+                 $selected = state.others;
+            }
+            else {
+                $selected = Array.from(n)[0];
+            }  
+        }
+        else{
             $selected = Array.from(n)[0];
         }
+
     });
 
     enum CopyStatus {
@@ -42,6 +58,12 @@
             copyText = CopyStatus.Copy;
         }, 1000);
     }
+
+    function checkLastState({ curr, next }) {
+        if(curr?.value && curr?.value !== next?.value){
+            setLastStateDevLanguage(next?.value);
+        }
+    }
 </script>
 
 <section class="theme-dark web-code-snippet" aria-label="code-snippet panel">
@@ -60,6 +82,7 @@
                             value: language,
                             label: platformMap[language]
                         }))}
+                        onSelectedChange={checkLastState}
                     />
                 </li>