feat(research): added author card in search result

apps/research/src/api/authors.ts

@@ -0,0 +1,33 @@
+import { gql } from 'graphql-request';
+import { contentful } from './client';
+import { AssetFragment } from './fragments';
+import { Author, AuthorCollection } from '@/types';
+
+const GetAuthorByName = gql`
+    query GetAuthorByName($name: String!) {
+        authorCollection(where: { name: $name}, limit: 1) {
+            items {
+                name
+                title
+                description
+                profilePicture {
+                    ...asset
+                }
+            }
+        }
+    }
+    ${AssetFragment}
+`;
+
+export const getAuthorByName = async (
+  name: string,
+) => {
+  const { authorCollection } =
+    await contentful.request<AuthorCollection<Author>>(
+      GetAuthorByName,
+      {
+        name,
+      },
+    );
+  return authorCollection.items[0];
+};

apps/research/src/api/index.ts

@@ -1,4 +1,5 @@
 export * from './articles';
+export * from './authors';
 export * from './client';
 export * from './products';
 export * from './home';

apps/research/src/components/search/SearchHits.tsx

@@ -21,10 +21,6 @@ interface SearchHit extends BaseHit {
 
 const SearchHits: React.FC = () => {
   const { results } = useHits<SearchHit>();
-  const { indexUiState, setIndexUiState } = useInstantSearch();
-
-  console.log(indexUiState);
-
   if (results!.__isArtificial && results!.nbHits === 0) {
     return (
       <div>

apps/research/src/pages/articles/index.tsx

@@ -1,14 +1,19 @@
-import { Col, Row, Layout, theme } from 'antd';
+import { Col, Layout, Row, theme } from 'antd';
 import { NextPageWithLayout } from 'platform-js';
 import algoliasearch from 'algoliasearch/lite';
 import { history } from 'instantsearch.js/es/lib/routers';
-import { InstantSearch, Configure } from 'react-instantsearch-hooks-web';
-import { SearchHits, SearchText } from '@/components';
+import { InstantSearch } from 'react-instantsearch-hooks-web';
+import { AuthorCard, SearchHits, SearchText } from '@/components';
 import { NextSeo } from 'next-seo';
 import { siteUsername } from '@/utils';
 import styles from './styles.module.scss';
 import { UiState } from 'instantsearch.js';
 import { RouterProps } from 'instantsearch.js/es/middlewares';
+import { Author } from '@/types';
+import React, { useState } from 'react';
+import { useRouter } from 'next/router';
+import { getAuthorByName } from '@/api';
+import { useAsyncEffect } from 'ahooks';
 
 const { useToken } = theme;
 
@@ -67,6 +72,22 @@ const Articles: NextPageWithLayout = () => {
       },
     },
   };
+  const [author, setAuthor] = useState<Author | null>(null)
+  const router = useRouter()
+  useAsyncEffect(async () => {
+    const authors = router.query["authors"]
+    if (authors) {
+      if (authors && typeof authors == 'string') {
+        console.log("authors as string", authors);
+        setAuthor(await getAuthorByName(authors));
+      } else if (typeof authors == 'object') {
+        console.log("authors as array", authors);
+        if (authors.length == 1) {
+          setAuthor(await getAuthorByName(authors[0]));
+        }
+      }
+    }
+  }, [router]);
   return (
     <>
       <NextSeo
@@ -142,6 +163,12 @@ const Articles: NextPageWithLayout = () => {
               paddingTop: 40,
             }}
           >
+            {author && <Row>
+              <Col span={22} offset={1} className="default-body">
+                <AuthorCard {...author} />
+              </Col>
+            </Row>
+            }
             <Row>
               <Col span={22} offset={1} className="default-body">
                 <SearchHits />

apps/research/src/types/contentful/article.ts

@@ -4,7 +4,7 @@ import {
   ISectionFields,
   ITagFields,
 } from '../generated/contentful';
-import { AuthorCollection, AuthorCompact } from './author';
+import { AuthorCompact, AuthorsCollection } from './author';
 import { Asset, RichTextDocument } from './global';
 import { SeoData } from './Seo';
 import { RelatedArticleSummaryLinked } from './indexes';
@@ -15,7 +15,7 @@ export interface ArticleSlug extends Pick<IArticleFields, 'articleSlug'> {}
 
 export interface Article
   extends Pick<IArticleFields, 'title' | 'subtitle' | 'keyPoints' | 'publishedDate' | 'articleSlug'>,
-    AuthorCollection<AuthorCompact>,
+    AuthorsCollection<AuthorCompact>,
     TagCollection<ITagFields>,
     RecommendedArticle<RelatedArticleSummaryLinked>,
     RelatedArticles<RelatedArticleSummaryLinked> {

apps/research/src/types/contentful/author.ts

@@ -1,12 +1,18 @@
 import type { IAuthorFields } from '../generated/contentful';
 import { Asset } from './global';
 
-export interface AuthorCollection<T extends object> {
+export interface AuthorsCollection<T extends object> {
   authorsCollection: {
     items: ReadonlyArray<T>;
   };
 }
 
+export interface AuthorCollection<T extends object> {
+  authorCollection: {
+    items: ReadonlyArray<T>;
+  };
+}
+
 export interface Author extends Omit<IAuthorFields, 'profilePicture'> {
   profilePicture: Asset;
 }