From eba70a73258a5dfc893a5128e44fbfc0b81a449a Mon Sep 17 00:00:00 2001
From: "Software Developer | Web, Blockchain & Desktop"
 <69617937+mkbeefcake@users.noreply.github.com>
Date: Mon, 12 Dec 2022 15:02:53 +0300
Subject: [PATCH] added description for ForumPageHeader (#3904) (#3925)

added description for ForumPageHeader
---
 packages/ui/src/app/pages/Forum/ForumCategory.tsx    | 7 ++++++-
 packages/ui/src/forum/components/ForumPageHeader.tsx | 5 ++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/packages/ui/src/app/pages/Forum/ForumCategory.tsx b/packages/ui/src/app/pages/Forum/ForumCategory.tsx
index 66a101943f..96cb1cc650 100644
--- a/packages/ui/src/app/pages/Forum/ForumCategory.tsx
+++ b/packages/ui/src/app/pages/Forum/ForumCategory.tsx
@@ -11,7 +11,7 @@ import { Loading } from '@/common/components/Loading'
 import { RowGapBlock } from '@/common/components/page/PageContent'
 import { PageTitle } from '@/common/components/page/PageTitle'
 import { PreviousPage } from '@/common/components/page/PreviousPage'
-import { Label } from '@/common/components/typography'
+import { Label, TextMedium } from '@/common/components/typography'
 import { useModal } from '@/common/hooks/useModal'
 import { useRefetchQueries } from '@/common/hooks/useRefetchQueries'
 import { useSort } from '@/common/hooks/useSort'
@@ -73,6 +73,11 @@ export const ForumCategory = () => {
               <PageTitle>{category.title}</PageTitle>
             </PreviousPage>
           }
+          description={
+            <TextMedium className="category-description" normalWeight inter lighter truncateLines={2}>
+              {category.description}
+            </TextMedium>
+          }
           buttons={
             <TransactionButton
               style="primary"
diff --git a/packages/ui/src/forum/components/ForumPageHeader.tsx b/packages/ui/src/forum/components/ForumPageHeader.tsx
index c6508a4e8b..0607e5662f 100644
--- a/packages/ui/src/forum/components/ForumPageHeader.tsx
+++ b/packages/ui/src/forum/components/ForumPageHeader.tsx
@@ -3,14 +3,16 @@ import React, { useState } from 'react'
 import { PageHeaderRow, PageHeaderWrapper } from '@/app/components/PageLayout'
 import { ButtonsGroup } from '@/common/components/buttons'
 import { SearchBox } from '@/common/components/forms/FilterBox/FilterSearchBox'
+import { TextMedium } from '@/common/components/typography'
 import { useModal } from '@/common/hooks/useModal'
 
 interface ForumPageHeaderProps {
   title: React.ReactNode
   children?: React.ReactNode
   buttons?: React.ReactNode
+  description?: React.ReactNode
 }
-export const ForumPageHeader = ({ title, children, buttons }: ForumPageHeaderProps) => {
+export const ForumPageHeader = ({ title, children, buttons, description }: ForumPageHeaderProps) => {
   const [search, setSearch] = useState('')
 
   const { showModal } = useModal()
@@ -28,6 +30,7 @@ export const ForumPageHeader = ({ title, children, buttons }: ForumPageHeaderPro
           {buttons}
         </ButtonsGroup>
       </PageHeaderRow>
+      {description && <PageHeaderRow>{description}</PageHeaderRow>}
       {children}
     </PageHeaderWrapper>
   )