diff --git a/apps/app/src/client/components/SearchForm.module.scss b/apps/app/src/client/components/SearchForm.module.scss
deleted file mode 100644
index 335d5bae86d..00000000000
--- a/apps/app/src/client/components/SearchForm.module.scss
+++ /dev/null
@@ -1,36 +0,0 @@
-@use '@growi/core-styles/scss/bootstrap/init' as bs;
-
-.grw-search-table {
-  caption {
-    display: table-header-group;
-  }
-}
-
-@include bs.media-breakpoint-down(sm) {
-  .grw-search-table {
-    th {
-      text-align: right;
-    }
-
-    td {
-      overflow-wrap: anywhere;
-      white-space: normal !important;
-    }
-
-    @include bs.media-breakpoint-down(xs) {
-      th,
-      td {
-        display: block;
-      }
-
-      th {
-        text-align: left;
-      }
-
-      td {
-        padding-top: 0 !important;
-        border-top: none !important;
-      }
-    }
-  }
-}
diff --git a/apps/app/src/client/components/SearchForm.tsx b/apps/app/src/client/components/SearchForm.tsx
deleted file mode 100644
index 099cf333902..00000000000
--- a/apps/app/src/client/components/SearchForm.tsx
+++ /dev/null
@@ -1,143 +0,0 @@
-import React, {
-  FC, forwardRef, ForwardRefRenderFunction, useImperativeHandle,
-  useRef, useState,
-} from 'react';
-
-import { useTranslation } from 'next-i18next';
-
-import { IFocusable } from '~/client/interfaces/focusable';
-import { TypeaheadProps } from '~/client/interfaces/react-bootstrap-typeahead';
-import { IPageWithSearchMeta } from '~/interfaces/search';
-
-import SearchTypeahead from './SearchTypeahead';
-
-import styles from './SearchForm.module.scss';
-
-
-type SearchFormHelpProps = {
-  isReachable: boolean,
-}
-
-const SearchFormHelp: FC<SearchFormHelpProps> = React.memo((props: SearchFormHelpProps) => {
-  const { t } = useTranslation();
-
-  const { isReachable } = props;
-
-  if (!isReachable) {
-    return (
-      <>
-        <h5 className="text-danger">Error occured on Search Service</h5>
-        Try to reconnect from management page.
-      </>
-    );
-  }
-
-  return (
-    <table className={`${styles['grw-search-table']} table grw-search-table search-help m-0`}>
-      <caption className="text-start text-primary p-2">
-        <h5 className="h6"><span className="material-symbols-outlined">search</span>{ t('search_help.title') }</h5>
-      </caption>
-      <tbody>
-        <tr>
-          <th className="py-2">
-            <code>word1</code> <code>word2</code><br></br>
-            <small>({ t('search_help.and.syntax help') })</small>
-          </th>
-          <td><h6 className="m-0">{ t('search_help.and.desc', { word1: 'word1', word2: 'word2' }) }</h6></td>
-        </tr>
-        <tr>
-          <th className="py-2">
-            <code>&quot;This is GROWI&quot;</code><br></br>
-            <small>({ t('search_help.phrase.syntax help') })</small>
-          </th>
-          <td><h6 className="m-0">{ t('search_help.phrase.desc', { phrase: 'This is GROWI' }) }</h6></td>
-        </tr>
-        <tr>
-          <th className="py-2"><code>-keyword</code></th>
-          <td><h6 className="m-0">{ t('search_help.exclude.desc', { word: 'keyword' }) }</h6></td>
-        </tr>
-        <tr>
-          <th className="py-2"><code>prefix:/user/</code></th>
-          <td><h6 className="m-0">{ t('search_help.prefix.desc', { path: '/user/' }) }</h6></td>
-        </tr>
-        <tr>
-          <th className="py-2"><code>-prefix:/user/</code></th>
-          <td><h6 className="m-0">{ t('search_help.exclude_prefix.desc', { path: '/user/' }) }</h6></td>
-        </tr>
-        <tr>
-          <th className="py-2"><code>tag:wiki</code></th>
-          <td><h6 className="m-0">{ t('search_help.tag.desc', { tag: 'wiki' }) }</h6></td>
-        </tr>
-        <tr>
-          <th className="py-2"><code>-tag:wiki</code></th>
-          <td><h6 className="m-0">{ t('search_help.exclude_tag.desc', { tag: 'wiki' }) }</h6></td>
-        </tr>
-      </tbody>
-    </table>
-  );
-});
-
-SearchFormHelp.displayName = 'SearchFormHelp';
-
-
-type Props = TypeaheadProps & {
-  isSearchServiceReachable: boolean,
-
-  keywordOnInit?: string,
-  disableIncrementalSearch?: boolean,
-  onChange?: (data: IPageWithSearchMeta[]) => void,
-  onSubmit?: (input: string) => void,
-};
-
-
-const SearchForm: ForwardRefRenderFunction<IFocusable, Props> = (props: Props, ref) => {
-  const { t } = useTranslation();
-  const {
-    isSearchServiceReachable,
-    keywordOnInit,
-    disableIncrementalSearch,
-    dropup, onChange, onBlur, onFocus, onSubmit, onInputChange,
-  } = props;
-
-  const [searchError, setSearchError] = useState<Error | null>(null);
-
-  const searchTyheaheadRef = useRef<IFocusable>(null);
-
-  // publish focus()
-  useImperativeHandle(ref, () => ({
-    focus() {
-      const instance = searchTyheaheadRef?.current;
-      if (instance != null) {
-        instance.focus();
-      }
-    },
-  }));
-
-  const placeholder = isSearchServiceReachable
-    ? 'Search ...'
-    : 'Error on Search Service';
-
-  const emptyLabel = (searchError != null)
-    ? 'Error on searching.'
-    : t('search.search page bodies');
-
-  return (
-    <SearchTypeahead
-      ref={searchTyheaheadRef}
-      dropup={dropup}
-      emptyLabel={emptyLabel}
-      placeholder={placeholder}
-      onChange={onChange}
-      onSubmit={onSubmit}
-      onInputChange={onInputChange}
-      onSearchError={err => setSearchError(err)}
-      onBlur={onBlur}
-      onFocus={onFocus}
-      keywordOnInit={keywordOnInit}
-      disableIncrementalSearch={disableIncrementalSearch}
-      helpElement={<SearchFormHelp isReachable={isSearchServiceReachable} />}
-    />
-  );
-};
-
-export default forwardRef(SearchForm);