#66 fix: Update from Buffer.from to browser compatible

MetaCell · Dec 7, 2023 · bbe622f · bbe622f
1 parent 1ffca5d
commit bbe622f
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 13 deletions.
diff --git a/src/theme.ts b/src/theme.ts
@@ -2,6 +2,7 @@ import vars from './components/assets/styles/variables';
 import nodeGreen from './components/assets/svg/node/green.svg';
 import topSubArrow from './components/assets/svg/sub-top-arrow.svg';
 import bottomSubArrow from './components/assets/svg/sub-bottom-arrow.svg';
+import { base64Encode } from './utils';
 
 type ThemeVars = {
   [key: string]: any;
@@ -86,9 +87,9 @@ const applicationTheme = (params: ThemeVars) => {
             content: "";
             width: 0.5rem;
             height: 0.5rem;
-            background: url(data:image/svg+xml;base64,${btoa(
-              topSubArrow
-            )});           
+            background: url(data:image/svg+xml;base64,${base64Encode(
+            topSubArrow
+        )});           
             position: absolute;
             background-size: 150%;
             top: -0.5rem;
@@ -99,9 +100,9 @@ const applicationTheme = (params: ThemeVars) => {
             content: "";
             width: 0.5rem;
             height: 0.5rem;
-            background: url(data:image/svg+xml;base64,${btoa(
-              bottomSubArrow
-            )});           
+            background: url(data:image/svg+xml;base64,${base64Encode(
+            bottomSubArrow
+        )});           
             position: absolute;
             background-size: 150%;
             bottom: -0.45rem;
@@ -172,9 +173,9 @@ const applicationTheme = (params: ThemeVars) => {
             width: 1.25rem;
             height: 1.25rem;
             margin: 0 auto 0.25rem;
-            background: url(data:image/svg+xml;base64,${Buffer.from(
-              nodeGreen
-            ).toString('base64')});
+            background: url(data:image/svg+xml;base64,${base64Encode(
+            nodeGreen
+        )});
           }
 
           .primary-node .primary-node_header p {
@@ -493,7 +494,7 @@ export const subBarStyle = {
 };
 
 export default (customVariables: ThemeVars) =>
-  applicationTheme({
-    ...vars,
-    ...customVariables,
-  });
+    applicationTheme({
+      ...vars,
+      ...customVariables,
+    });
diff --git a/src/utils.ts b/src/utils.ts
@@ -46,3 +46,15 @@ export function updateCanvasMouseCursor(cursor = CursorTypes.TEXT) {
     // element.
   });
 }
+
+
+export function base64Encode(input: string) {
+  // Check if Buffer is available (Node.js environment)
+  if (typeof Buffer !== 'undefined') {
+    return Buffer.from(input).toString('base64');
+  }
+  // Browser environment
+  else {
+    return btoa(input);
+  }
+}