feat: can search node

packages/app/src/Palette/NodeList.tsx

@@ -1,3 +1,4 @@
+import { Dispatch, SetStateAction } from 'react'
 import { Box, styled } from '@fower/react'
 import { Command } from '@penx/cmdk'
 import { useNodes, usePaletteDrawer } from '@penx/hooks'
@@ -9,20 +10,17 @@ const CommandItem = styled(Command.Item)
 
 interface Props {
   q: string
+  setSearch: Dispatch<SetStateAction<string>>
   close: () => void
 }
 
-export function NodeList({ q, close }: Props) {
+export function NodeList({ q, setSearch, close }: Props) {
   const { nodeList } = useNodes()
   const paletteDrawer = usePaletteDrawer()
 
-  const filteredItems = nodeList
-    .find({
-      sortBy: 'openedAt',
-      orderByDESC: true,
-      limit: 20,
-    })
+  const filteredItems = nodeList.nodes
     .filter((i) => i.title.toLowerCase().includes(q.toLowerCase()))
+    .slice(0, 20)
 
   if (!filteredItems.length) {
     return (
@@ -50,14 +48,16 @@ export function NodeList({ q, close }: Props) {
             roundedLG
             value={node.id}
             onSelect={() => {
-              close()
               paletteDrawer?.close()
               nodeService.selectNode()
+              close()
+              setSearch('')
             }}
             onClick={() => {
               nodeService.selectNode()
               paletteDrawer?.close()
               close()
+              setSearch('')
             }}
           >
             {node.title || 'Untitled'}

packages/app/src/Palette/index.tsx

@@ -123,11 +123,9 @@ export function CommandPanel({ isMobile = false }: CommandPanelProps) {
         borderBottom
         borderGray100
         outlineNone
-        placeholder="Search page by name"
+        placeholder="Search node by name"
         value={search}
         onValueChange={(v) => {
-          console.log('v:', v)
-
           setSearch(v)
         }}
         onBlur={() => {
@@ -150,7 +148,9 @@ export function CommandPanel({ isMobile = false }: CommandPanelProps) {
           overscrollBehavior: 'contain',
         }}
       >
-        {!isCommand && <NodeList q={search} close={close} />}
+        {!isCommand && (
+          <NodeList q={search} setSearch={setSearch} close={close} />
+        )}
 
         {isCommand && (
           <CommandList q={search} close={close} setSearch={setSearch} />