feat: add cover to article

eleven-labs · Jan 29, 2024 · 2bc6a65 · 2bc6a65
1 parent d0bd314
commit 2bc6a65
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 32 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -27,7 +27,7 @@
     "node": ">= 20.0"
   },
   "dependencies": {
-    "@eleven-labs/design-system": "^0.24.0",
+    "@eleven-labs/design-system": "^0.26.2",
     "@remix-run/router": "^1.7.2",
     "algoliasearch": "^4.19.1",
     "classnames": "^2.3.2",

diff --git a/src/assets/imgs/cover-article.jpg b/src/assets/imgs/cover-article.jpg
diff --git a/src/containers/AuthorPageContainer/useAuthorPageContainer.tsx b/src/containers/AuthorPageContainer/useAuthorPageContainer.tsx
@@ -7,7 +7,6 @@ import { useLoaderData, useParams } from 'react-router-dom';
 import { blogUrl } from '@/config/website';
 import { DEFAULT_LANGUAGE, PATHS } from '@/constants';
 import { PostCardListContainer, PostCardListContainerProps } from '@/containers/PostCardListContainer';
-import { getPathFile } from '@/helpers/assetHelper';
 import { generatePath } from '@/helpers/routerHelper';
 import { useNewsletterCard } from '@/hooks/useNewsletterCard';
 import { useTitle } from '@/hooks/useTitle';
@@ -65,7 +64,6 @@ export const useAuthorPageContainer = (): AuthorPageProps | undefined => {
       }),
       content: <div dangerouslySetInnerHTML={{ __html: author.content }} />,
     },
-    emptyAvatarImageUrl: getPathFile('/imgs/astronaut.png'),
     title: t('pages.author.post_list_title'),
     postCardList: (
       <PostCardListContainer

diff --git a/src/containers/HomePageContainer/useHomePageContainer.tsx b/src/containers/HomePageContainer/useHomePageContainer.tsx
@@ -62,16 +62,18 @@ export const useHomePageContainer = (): HomePageProps => {
         href: generatePath(PATHS.CATEGORY, { categoryName: 'all', lang: i18n.language }),
       },
     },
-    lastTutorialsBlock: {
-      title: <TransWithHtml i18nKey="pages.home.last-tutorials-block.title" onlyLineBreak />,
-      description: <TransWithHtml i18nKey="pages.home.last-tutorials-block.description" />,
-      tutorialLabel: t('common.tutorial-tag'),
-      posts: lastTutorialsForCardList,
-      linkSeeMore: {
-        label: t('pages.home.last-tutorials-block.link-see-more'),
-        href: generatePath(PATHS.CATEGORY, { categoryName: ContentTypeEnum.TUTORIAL, lang: i18n.language }),
-      },
-    },
+    lastTutorialsBlock: lastTutorialsForCardList.length
+      ? {
+          title: <TransWithHtml i18nKey="pages.home.last-tutorials-block.title" onlyLineBreak />,
+          description: <TransWithHtml i18nKey="pages.home.last-tutorials-block.description" />,
+          tutorialLabel: t('common.tutorial-tag'),
+          posts: lastTutorialsForCardList,
+          linkSeeMore: {
+            label: t('pages.home.last-tutorials-block.link-see-more'),
+            href: generatePath(PATHS.CATEGORY, { categoryName: ContentTypeEnum.TUTORIAL, lang: i18n.language }),
+          },
+        }
+      : undefined,
     newsletterCard,
   };
 };
diff --git a/src/hooks/usePostPage.tsx b/src/hooks/usePostPage.tsx
@@ -3,6 +3,7 @@ import React from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { PATHS } from '@/constants';
+import { getPathFile } from '@/helpers/assetHelper';
 import { generatePath } from '@/helpers/routerHelper';
 import { useBreadcrumb } from '@/hooks/useBreadcrumb';
 import { useContactCard } from '@/hooks/useContactCard';
@@ -40,6 +41,10 @@ export const usePostPage = (post: PostPageData): Omit<PostPageProps, 'variant' |
 
   return {
     breadcrumb,
+    cover: {
+      src: getPathFile('/imgs/cover-article.jpg'),
+      alt: 'cover',
+    },
     header: {
       title: post.title,
       date: getDateToString({ date: post.date }),
@@ -48,12 +53,10 @@ export const usePostPage = (post: PostPageData): Omit<PostPageProps, 'variant' |
       shareLinks: {
         urlToShare: typeof window !== 'undefined' ? window.location.href : '',
         shares: {
-          copyLink: true,
           twitter: true,
           facebook: true,
           linkedIn: true,
         },
-        copiedLabel: t('common.post.share_links.copied_label'),
       },
     },
     footer: {

diff --git a/src/hooks/usePostsForCardList.ts b/src/hooks/usePostsForCardList.ts
@@ -2,6 +2,7 @@ import { PostCardListProps } from '@eleven-labs/design-system';
 import { useTranslation } from 'react-i18next';
 
 import { PATHS } from '@/constants';
+import { getPathFile } from '@/helpers/assetHelper';
 import { generatePath } from '@/helpers/routerHelper';
 import { truncateText } from '@/helpers/stringHelper';
 import { useDateToString } from '@/hooks/useDateToString';
@@ -20,6 +21,10 @@ export const usePostsForCardList = (options: {
     : (options.posts ?? []).map((post) => ({
         contentType: post.contentType,
         slug: post.slug,
+        cover: {
+          src: getPathFile('/imgs/cover-article.jpg'),
+          alt: 'cover',
+        },
         title: post.title,
         excerpt: truncateText(post.excerpt, 125),
         date: getDateToString({ date: post.date }),