feat: support search column

src/components/modal/AddColumn.tsx

@@ -4,6 +4,7 @@ import Bell from 'heroicons/24/outline/bell.svg';
 import GlobeAlt from 'heroicons/24/outline/globe-alt.svg';
 import Heart from 'heroicons/24/outline/heart.svg';
 import Home from 'heroicons/24/outline/home.svg';
+import MagnifyingGlass from 'heroicons/24/outline/magnifying-glass.svg';
 import User from 'heroicons/24/outline/user.svg';
 
 import BasicModal from '@/components/modal/BasicModal';
@@ -13,8 +14,10 @@ import {
   createNotificationColumn,
   createPostsColumn,
   createReactionsColumn,
+  createSearchColumn,
 } from '@/core/column';
 import useConfig from '@/core/useConfig';
+import { useRequestCommand } from '@/hooks/useCommandBus';
 import usePubkey from '@/nostr/usePubkey';
 import ensureNonNull from '@/utils/ensureNonNull';
 
@@ -25,38 +28,49 @@ type AddColumnProps = {
 const AddColumn: Component<AddColumnProps> = (props) => {
   const pubkey = usePubkey();
   const { saveColumn } = useConfig();
+  const request = useRequestCommand();
+
+  const finish = () => {
+    props.onClose();
+    request({ command: 'moveToLastColumn' }).catch((err) => console.error(err));
+  };
 
   const addFollowingColumn = () => {
     ensureNonNull([pubkey()] as const)(([pubkeyNonNull]) => {
       saveColumn(createFollowingColumn({ pubkey: pubkeyNonNull }));
     });
-    props.onClose();
+    finish();
   };
 
   const addNotificationColumn = () => {
     ensureNonNull([pubkey()] as const)(([pubkeyNonNull]) => {
       saveColumn(createNotificationColumn({ pubkey: pubkeyNonNull }));
     });
-    props.onClose();
+    finish();
   };
 
   const addJapanRelaysColumn = () => {
     saveColumn(createJapanRelaysColumn());
-    props.onClose();
+    finish();
+  };
+
+  const addSearchColumn = () => {
+    saveColumn(createSearchColumn({ query: '' }));
+    finish();
   };
 
   const addMyPostsColumn = () => {
     ensureNonNull([pubkey()] as const)(([pubkeyNonNull]) => {
       saveColumn(createPostsColumn({ pubkey: pubkeyNonNull }));
     });
-    props.onClose();
+    finish();
   };
 
   const addMyReactionsColumn = () => {
     ensureNonNull([pubkey()] as const)(([pubkeyNonNull]) => {
       saveColumn(createReactionsColumn({ pubkey: pubkeyNonNull }));
     });
-    props.onClose();
+    finish();
   };
 
   return (
@@ -89,6 +103,15 @@ const AddColumn: Component<AddColumnProps> = (props) => {
           </span>
           日本リレー
         </button>
+        <button
+          class="flex basis-1/2 flex-col items-center gap-2 py-8 sm:basis-1/4"
+          onClick={() => addSearchColumn()}
+        >
+          <span class="inline-block h-8 w-8">
+            <MagnifyingGlass />
+          </span>
+          検索
+        </button>
         <button
           class="flex basis-1/2 flex-col items-center gap-2 py-8 sm:basis-1/4"
           onClick={() => addMyPostsColumn()}