impl

packages/app/src/components/SearchPage/SearchResultList.tsx

@@ -16,9 +16,8 @@ type Props = {
 }
 
 const SearchResultList: FC<Props> = (props:Props) => {
-  console.log(props);
   const { focusedPage } = props;
-  const focusedPageId = (focusedPage !== undefined && focusedPage.pageData !== undefined ? focusedPage.pageData._id : '';
+  const focusedPageId = (focusedPage !== undefined && focusedPage.pageData !== undefined) ? focusedPage.pageData._id : '';
   return (
     <>
       {props.pages.map((page) => {

packages/app/src/components/SearchPage/SearchResultListItem.tsx

@@ -9,14 +9,15 @@ import { IPageSearchResultData } from '../../interfaces/search';
 
 
 import loggerFactory from '~/utils/logger';
+import { IPageHasId } from '~/interfaces/page';
 
 const logger = loggerFactory('growi:searchResultList');
 
 type PageItemControlProps = {
-  page: IPageSearchResultData,
+  page: IPageHasId,
 }
 
-const PageItemControl: FC<PageItemControlProps> = (props: {page: IPageSearchResultData}) => {
+const PageItemControl: FC<PageItemControlProps> = (props: {page: IPageHasId}) => {
 
   const { page } = props;
   const { t } = useTranslation('');
@@ -68,19 +69,19 @@ const PageItemControl: FC<PageItemControlProps> = (props: {page: IPageSearchResu
 };
 
 type Props = {
-  page: ISearchedPage,
+  page: IPageSearchResultData,
   isSelected: boolean,
   onClickInvoked?: (pageId: string) => void,
 }
 
 const SearchResultListItem: FC<Props> = (props:Props) => {
-  const { page, isSelected } = props;
+  const { page: { pageData, pageMeta }, isSelected } = props;
 
   // Add prefix 'id_' in pageId, because scrollspy of bootstrap doesn't work when the first letter of id attr of target component is numeral.
-  const pageId = `#${page._id}`;
+  const pageId = `#${pageData._id}`;
 
-  const dPagePath = new DevidedPagePath(page.path, false, true);
-  const pagePathElem = <PagePathLabel page={page} isFormerOnly />;
+  const dPagePath = new DevidedPagePath(pageData.path, false, true);
+  const pagePathElem = <PagePathLabel page={pageData} isFormerOnly />;
 
   const onClickInvoked = (pageId) => {
     if (props.onClickInvoked != null) {
@@ -89,11 +90,11 @@ const SearchResultListItem: FC<Props> = (props:Props) => {
   };
 
   return (
-    <li key={page._id} className={`page-list-li search-page-item w-100 border-bottom px-4 list-group-item-action ${isSelected ? 'active' : ''}`}>
+    <li key={pageData._id} className={`page-list-li search-page-item w-100 border-bottom px-4 list-group-item-action ${isSelected ? 'active' : ''}`}>
       <a
         className="d-block pt-3"
         href={pageId}
-        onClick={() => onClickInvoked(page._id)}
+        onClick={() => onClickInvoked(pageData._id)}
       >
         <div className="d-flex">
           {/* checkbox */}
@@ -109,26 +110,23 @@ const SearchResultListItem: FC<Props> = (props:Props) => {
             <div className="d-flex my-1 align-items-center">
               {/* page title */}
               <h3 className="mb-0">
-                <UserPicture user={page.lastUpdateUser} />
+                <UserPicture user={pageData.lastUpdateUser} />
                 <span className="mx-2">{dPagePath.latter}</span>
               </h3>
               {/* page meta */}
               <div className="d-flex mx-2">
-                <PageListMeta page={page} />
+                <PageListMeta pageData={pageData} pageMeta={pageMeta} />
               </div>
               {/* doropdown icon includes page control buttons */}
               <div className="ml-auto">
-                <PageItemControl page={page} />
+                <PageItemControl page={pageData} />
               </div>
             </div>
             <div className="my-2">
               <Clamp
                 lines={2}
               >
-                {page.snippet
-                  ? <div className="mt-1">page.snippet</div>
-                  : <div className="mt-1" dangerouslySetInnerHTML={{ __html: page.elasticSearchResult.snippet }}></div>
-                }
+                {pageMeta.elasticSearchResult && <div className="mt-1" dangerouslySetInnerHTML={{ __html: pageMeta.elasticSearchResult.snippet }}></div>}
               </Clamp>
             </div>
           </div>

packages/app/src/interfaces/search.ts

@@ -10,6 +10,9 @@ export type IPageSearchResultData = {
   pageData: IPageHasId,
   pageMeta: {
     bookmarkCount: number,
-    snippet: string,
+    elasticSearchResult: {
+      snippet: string,
+      matchedPath: string,
+    },
   },
 }

packages/app/src/server/routes/search.js

@@ -189,7 +189,6 @@ module.exports = function(crowi, app) {
     catch (err) {
       return res.json(ApiResponse.error(err));
     }
-    console.log(JSON.stringify(result, null, 2));
     return res.json(ApiResponse.success(result));
   };
 

packages/ui/src/components/PagePath/PageListMeta.jsx

@@ -8,38 +8,38 @@ const { checkTemplatePath } = templateChecker;
 export class PageListMeta extends React.Component {
 
   render() {
-    const { page } = this.props;
+    const { pageData, pageMeta } = this.props;
 
     // top check
     let topLabel;
-    if (isTopPage(page.path)) {
+    if (isTopPage(pageData.path)) {
       topLabel = <span className="badge badge-info">TOP</span>;
     }
 
     // template check
     let templateLabel;
-    if (checkTemplatePath(page.path)) {
+    if (checkTemplatePath(pageData.path)) {
       templateLabel = <span className="badge badge-info">TMPL</span>;
     }
 
     let commentCount;
-    if (page.commentCount > 0) {
-      commentCount = <span><i className="icon-bubble" />{page.commentCount}</span>;
+    if (pageData.commentCount > 0) {
+      commentCount = <span><i className="icon-bubble" />{pageData.commentCount}</span>;
     }
 
     let likerCount;
-    if (page.liker.length > 0) {
-      likerCount = <span><i className="icon-like" />{page.liker.length}</span>;
+    if (pageData.liker.length > 0) {
+      likerCount = <span><i className="icon-like" />{pageData.liker.length}</span>;
     }
 
     let locked;
-    if (page.grant !== 1) {
+    if (pageData.grant !== 1) {
       locked = <span><i className="icon-lock" /></span>;
     }
 
     let bookmarkCount;
-    if (this.props.bookmarkCount > 0) {
-      bookmarkCount = <span><i className="icon-star" />{this.props.bookmarkCount}</span>;
+    if (pageMeta.bookmarkCount > 0) {
+      bookmarkCount = <span><i className="icon-star" />{pageMeta.bookmarkCount}</span>;
     }
 
 
@@ -58,8 +58,8 @@ export class PageListMeta extends React.Component {
 }
 
 PageListMeta.propTypes = {
-  page: PropTypes.object.isRequired,
-  bookmarkCount: PropTypes.number,
+  pageData: PropTypes.object.isRequired,
+  pageMeta: PropTypes.object.isRequired,
 };
 
 PageListMeta.defaultProps = {