GW77674 component mostly ready

packages/app/resource/locales/en_US/translation.json

@@ -566,7 +566,9 @@
     "delete": "Delete",
     "check_all": "Check all",
     "deletion_modal_header": "Delete page",
-    "delete_completely": "Delete completely"
+    "delete_completely": "Delete completely",
+    "include_user_path" : "Include /user path ",
+    "include_trash_path": "Include /trash path "
   },
   "security_setting": {
     "Guest Users Access": "Guest users access",

packages/app/resource/locales/ja_JP/translation.json

@@ -567,7 +567,9 @@
     "delete": "削除",
     "check_all": "すべてチェック",
     "deletion_modal_header": "以下のページを削除",
-    "delete_completely": "完全に削除する"
+    "delete_completely": "完全に削除する",
+    "include_user_path": "/user下を含む ",
+    "include_trash_path": "/trash下を含む "
   },
   "security_setting": {
     "Guest Users Access": "ゲストユーザーのアクセス",

packages/app/resource/locales/zh_CN/translation.json

@@ -839,7 +839,9 @@
 		"delete": "删除",
 		"check_all": "全部检查",
 		"deletion_modal_header": "删除页",
-		"delete_completely": "完全删除"
+		"delete_completely": "完全删除",
+    "include_user_path": "包含 /user 路径 ",
+    "include_trash_path": "包含 /trash 路径 "
 	},
 	"to_cloud_settings": "進入 GROWI.cloud 的管理界面",
 	"login": {

packages/app/src/components/SearchPage/IncludeSpecificPathButton.jsx

@@ -0,0 +1,40 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { useTranslation } from 'react-i18next';
+
+const IncludeSpecificPathButton = (props) => {
+  const { pathToInclude } = props;
+  const { t } = useTranslation();
+  const [checked, setChecked] = useState(true);
+
+  // TODO : implement this function
+  // 77526 story https://estoc.weseek.co.jp/redmine/issues/77526
+  // 77535 stroy https://estoc.weseek.co.jp/redmine/issues/77535
+  function includeSpecificPathInSearchResult(pathToInclude) {
+    console.log(`now including ${pathToInclude} in search result`);
+  }
+  return (
+    <div className="border px-2 pt-1">
+      <label>
+        <span className="">{pathToInclude === '/user' ? t('search_result.include_user_path') : t('search_result.include_trash_path')}</span>
+        <input
+          type="checkbox"
+          name="check"
+          onChange={() => {
+            setChecked(prevState => !prevState);
+            if (checked) {
+              includeSpecificPathInSearchResult(pathToInclude);
+            }
+          }}
+        />
+      </label>
+    </div>
+  );
+
+};
+
+IncludeSpecificPathButton.propTypes = {
+  pathToInclude: PropTypes.string.isRequired,
+};
+
+export default IncludeSpecificPathButton;

packages/app/src/components/SearchPage/SearchResult.jsx

@@ -9,6 +9,7 @@ import SearchResultList from './SearchResultList';
 import DeletePageListModal from './DeletePageListModal';
 import AppContainer from '~/client/services/AppContainer';
 import { withUnstatedContainers } from '../UnstatedUtils';
+import IncludeSpecificPathButton from './IncludeSpecificPathButton';
 
 class SearchResult extends React.Component {
 
@@ -293,6 +294,20 @@ class SearchResult extends React.Component {
       <div className="content-main">
         <div className="search-result row" id="search-result">
           <div className="col-lg-4 d-none d-lg-block page-list search-result-list pr-0" id="search-result-list">
+            <div className="d-flex">
+              <div className="mr-auto">
+                {/* TODO
+                  :place deleteAllButton here
+                  #77739  https://estoc.weseek.co.jp/redmine/issues/77739
+              */}
+              </div>
+              <div className="mr-3">
+                <IncludeSpecificPathButton pathToInclude="/user"></IncludeSpecificPathButton>
+              </div>
+              <div className="mr-4">
+                <IncludeSpecificPathButton pathToInclude="/trash"></IncludeSpecificPathButton>
+              </div>
+            </div>
             <nav>
               <div className="d-flex align-items-start justify-content-between mt-1">
                 <div className="search-result-meta">