feat: add note search to profile page

src/components/Profile/index.tsx

@@ -21,6 +21,7 @@ import { Link, Zap } from 'lucide-react'
 import { useCallback, useEffect, useMemo, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import NotFound from '../NotFound'
+import SearchInput from '../SearchInput'
 import FollowedBy from './FollowedBy'
 import Followings from './Followings'
 import ProfileFeed from './ProfileFeed'
@@ -32,6 +33,8 @@ export default function Profile({ id }: { id?: string }) {
   const { profile, isFetching } = useFetchProfile(id)
   const { pubkey: accountPubkey } = useNostr()
   const { mutePubkeySet } = useMuteList()
+  const [searchInput, setSearchInput] = useState('')
+  const [debouncedInput, setDebouncedInput] = useState(searchInput)
   const { followings } = useFetchFollowings(profile?.pubkey)
   const isFollowingYou = useMemo(() => {
     return (
@@ -51,6 +54,16 @@ export default function Profile({ id }: { id?: string }) {
     }
   }, [])
 
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedInput(searchInput.trim())
+    }, 1000)
+
+    return () => {
+      clearTimeout(handler)
+    }
+  }, [searchInput])
+
   useEffect(() => {
     if (!profile?.pubkey) return
 
@@ -185,8 +198,15 @@ export default function Profile({ id }: { id?: string }) {
             </div>
           </div>
         </div>
+        <div className="px-4 pt-2 pb-0.5">
+          <SearchInput
+            value={searchInput}
+            onChange={(e) => setSearchInput(e.target.value)}
+            placeholder={t('Search')}
+          />
+        </div>
       </div>
-      <ProfileFeed pubkey={pubkey} topSpace={topContainerHeight + 100} />
+      <ProfileFeed pubkey={pubkey} topSpace={topContainerHeight + 100} search={debouncedInput} />
     </>
   )
 }