chore: update `i18nStore` (#141)

web/src/labs/html2image/getFontsStyleElement.ts

-import convertResourceToDataURL from "./convertResourceToDataURL";
-
-const getFontsStyleElement = async (element: HTMLElement) => {
-  const styleSheets = element.ownerDocument.styleSheets;
-  const fontFamilyStyles: CSSStyleDeclaration[] = [];
-
-  for (const sheet of styleSheets) {
-    for (const rule of sheet.cssRules) {
-      if (rule.constructor.name === "CSSFontFaceRule") {
-        fontFamilyStyles.push((rule as CSSFontFaceRule).style);
-      }
-    }
-  }
-
-  const styleElement = document.createElement("style");
-
-  for (const f of fontFamilyStyles) {
-    const fontFamily = f.getPropertyValue("font-family");
-    const fontWeight = f.getPropertyValue("font-weight");
-    const src = f.getPropertyValue("src");
-    const resourceUrls = src.split(",").map((s) => {
-      return s.replace(/url\("?(.+?)"?\)/, "$1");
-    });
-    const base64Urls: string[] = [];
-
-    for (const url of resourceUrls) {
-      try {
-        const base64Url = await convertResourceToDataURL(url);
-        base64Urls.push(`url("${base64Url}")`);
-      } catch (error) {
-        // do nth
-      }
-    }
-
-    styleElement.innerHTML += `
-      @font-face {
-        font-family: "${fontFamily}";
-        src: ${base64Urls.join(",")};
-        font-weight: ${fontWeight};
-      }`;
-  }
-
-  return styleElement;
-};
-
-export default getFontsStyleElement;

web/src/labs/i18n/createI18nStore.tsx

+type I18nState = Readonly<{
+  locale: string;
+}>;
+
+type Listener = (ns: I18nState, ps?: I18nState) => void;
+
+const createI18nStore = (preloadedState: I18nState) => {
+  const listeners: Listener[] = [];
+  let currentState = preloadedState;
+
+  const getState = () => {
+    return currentState;
+  };
+
+  const setState = (state: Partial<I18nState>) => {
+    const nextState = {
+    ...currentState,
+    ...state,
+    };
+    const prevState = currentState;
+    currentState = nextState;
+
+    for (const cb of listeners) {
+    cb(currentState, prevState);
+    }
+  };
+
+  const subscribe = (listener: Listener) => {
+    let isSubscribed = true;
+    listeners.push(listener);
+
+    const unsubscribe = () => {
+    if (!isSubscribed) {
+        return;
+    }
+
+    const index = listeners.indexOf(listener);
+    listeners.splice(index, 1);
+    isSubscribed = false;
+    };
+
+    return unsubscribe;
+  };
+
+  return {
+    getState,
+    setState,
+    subscribe,
+  };
+};
+
+export default createI18nStore;

web/src/labs/i18n/i18nStore.ts

-type I18nState = Readonly<{
-  locale: string;
-}>;
-
-type Listener = (ns: I18nState, ps?: I18nState) => void;
-
-const createI18nStore = (preloadedState: I18nState) => {
-  const listeners: Listener[] = [];
-  let currentState = preloadedState;
-
-  const getState = () => {
-    return currentState;
-  };
-
-  const setState = (state: Partial<I18nState>) => {
-    const nextState = {
-      ...currentState,
-      ...state,
-    };
-    const prevState = currentState;
-    currentState = nextState;
-
-    for (const cb of listeners) {
-      cb(currentState, prevState);
-    }
-  };
-
-  const subscribe = (listener: Listener) => {
-    let isSubscribed = true;
-    listeners.push(listener);
-
-    const unsubscribe = () => {
-      if (!isSubscribed) {
-        return;
-      }
-
-      const index = listeners.indexOf(listener);
-      listeners.splice(index, 1);
-      isSubscribed = false;
-    };
-
-    return unsubscribe;
-  };
-
-  return {
-    getState,
-    setState,
-    subscribe,
-  };
-};
+import createI18nStore from "./createI18nStore";
 
 const defaultI18nState = {
   locale: "en",

web/src/labs/i18n/useI18n.ts

@@ -25,7 +25,8 @@ const useI18n = () => {
 
   const translate = (key: string) => {
     try {
-      return resources[locale][key] as string;
+      const value = resources[locale][key] as string;
+      return value;
     } catch (error) {
       return key;
     }