Fix jsee textarea value ssr and filter icon

xypnox · Feb 20, 2024 · f43a763 · f43a763
1 parent a0424de
commit f43a763
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 9 deletions.
diff --git a/src/components/icons.ts b/src/components/icons.ts
@@ -47,7 +47,9 @@ export const icons = {
 
   "error": "ph:warning-duotone",
 
-  "search": "ph:magnifying-glass-duotone",
+  "search": "ph:magnifying-glass",
+
+  "filter": "ph:funnel-duotone",
 }
 
 const CustomizeIcon = `<path d="M4 10h8v1.47c0 .3-.24.53-.53.53H4.53a.53.53 0 0 1-.53-.53V10Z" fill="currentColor"/><rect opacity=".5" x="7" y="10" width="2" height="4" rx=".53" fill="currentColor"/><path opacity=".75" d="M4 6.53c0-.3.24-.53.53-.53H6v2.47c0 .3-.24.53-.53.53h-.94A.53.53 0 0 1 4 8.47V6.53Z" fill="currentColor"/><path opacity=".5" d="M4 2.53c0-.3.24-.53.53-.53h.94c.3 0 .53.24.53.53V5H4.53A.53.53 0 0 1 4 4.47V2.53Z" fill="currentColor"/><path opacity=".75" d="M7 2.53c0-.3.24-.53.53-.53h.94c.3 0 .53.24.53.53V6H7V2.53Z" fill="currentColor"/><path d="M7 7h2v1.47c0 .3-.24.53-.53.53h-.94A.53.53 0 0 1 7 8.47V7Z" fill="currentColor"/><path opacity=".75" d="M10 6h1.47c.3 0 .53.24.53.53v1.94c0 .3-.24.53-.53.53h-.94a.53.53 0 0 1-.53-.53V6Z" fill="currentColor"/><path opacity=".5" d="M10 2.53c0-.3.24-.53.53-.53h.94c.3 0 .53.24.53.53v1.94c0 .3-.24.53-.53.53H10V2.53Z" fill="currentColor"/>`

diff --git a/src/components/jsee/index.tsx b/src/components/jsee/index.tsx
@@ -1,4 +1,4 @@
-import { For, Match, Show, Switch, createEffect, createMemo, createSignal } from "solid-js";
+import { For, Match, Show, Switch, createMemo, createSignal } from "solid-js";
 import { extractCss, styled } from "solid-styled-components";
 import { theme } from "../../theme";
 import { Button, ButtonGroup, GroupSeparator, IconInput, Input, Text, baseElementStyles } from "../elements/atoms";
@@ -425,10 +425,6 @@ const ErrorMessage = styled(Text)`
 `
 
 export const JSee = () => {
-  createEffect(() => {
-    console.log("Filter", filter());
-  })
-
   const updateQuery = (e: InputEvent & {
     target: HTMLInputElement | null
   }) => {
@@ -440,14 +436,14 @@ export const JSee = () => {
       <style innerHTML={extractCss()} id="_goober" />
       <Wrapper>
         <Textarea
-          value={jsonString()}
           onInput={(e) => {
+            console.log("Input", e.currentTarget.value);
             parseJson(e.currentTarget.value);
           }}
-        />
+        >{jsonString()}</Textarea>
         <Toolbar>
           <IconInput classList={{ active: filter().query !== "" }}>
-            <iconify-icon icon={icons.search} />
+            <iconify-icon icon={icons.filter} />
             <Input placeholder="Filter" onInput={debounce(updateQuery, 500)} />
           </IconInput>
           <ButtonGroup>