From 5d696410d478c3f7837fe4f5fcad7e53afb21c85 Mon Sep 17 00:00:00 2001
From: Ilya <shakurov.77@mail.ru>
Date: Tue, 13 Feb 2024 15:07:52 +0300
Subject: [PATCH] refactor: working group page header props and tabs

---
 .../src/app/pages/WorkingGroups/WorkingGroup/AboutTab.tsx  | 2 +-
 .../app/pages/WorkingGroups/WorkingGroup/WorkingGroup.tsx  | 2 +-
 .../WorkingGroups/WorkingGroup/WorkingGroupHistory.tsx     | 2 +-
 .../WorkingGroups/WorkingGroup/WorkingGroupOpenings.tsx    | 2 +-
 .../WorkingGroup/components/WorkingGroupPageHeader.tsx     | 7 +++----
 .../WorkingGroup/components/WorkingGroupTabs.tsx           | 4 ++--
 6 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/AboutTab.tsx b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/AboutTab.tsx
index 8cec92d103..fecb0dad73 100644
--- a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/AboutTab.tsx
+++ b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/AboutTab.tsx
@@ -77,7 +77,7 @@ export const AboutTab = ({ workingGroup }: Props) => {
           <MarkdownPreview markdown={workingGroup.about || defaultDescription} />
           {handbookLink && (
             <ExternalLinkButtonGhost size="small" href={handbookLink} disabled={false} target="_blank">
-              Learn more from Knowlage Book
+              Learn more from the Handbook
               <LinkSymbol />
             </ExternalLinkButtonGhost>
           )}
diff --git a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroup.tsx b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroup.tsx
index a8d6e18ad3..ca8c5e3369 100644
--- a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroup.tsx
+++ b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroup.tsx
@@ -16,7 +16,7 @@ export const WorkingGroup = () => {
 
   return (
     <PageLayout
-      header={<WorkingGroupPageHeader />}
+      header={<WorkingGroupPageHeader group={group} />}
       main={isLoading || !group ? <Loading /> : <AboutTab workingGroup={group} />}
       sidebar={!isLoading && group && <AboutTabSidebar workingGroup={group} />}
       sidebarScrollable
diff --git a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroupHistory.tsx b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroupHistory.tsx
index 3f72515983..3ff8e9a872 100644
--- a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroupHistory.tsx
+++ b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroupHistory.tsx
@@ -15,7 +15,7 @@ export function WorkingGroupHistory() {
 
   return (
     <PageLayout
-      header={<WorkingGroupPageHeader />}
+      header={<WorkingGroupPageHeader group={group} />}
       main={isLoading || !group ? <Loading /> : <HistoryTab workingGroup={group} />}
       sidebar={!isLoading && group && <HistoryTabSidebar workingGroup={group} />}
       sidebarScrollable
diff --git a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroupOpenings.tsx b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroupOpenings.tsx
index cd49df0a0b..e1d9b73b0a 100644
--- a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroupOpenings.tsx
+++ b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/WorkingGroupOpenings.tsx
@@ -15,7 +15,7 @@ export function WorkingGroupOpenings() {
 
   return (
     <PageLayout
-      header={<WorkingGroupPageHeader withButtons />}
+      header={<WorkingGroupPageHeader group={group} withButtons />}
       main={isLoading || !group ? <Loading /> : <OpeningsTab workingGroup={group} />}
       sidebar={!isLoading && group && <OpeningsTabSidebar workingGroup={group} />}
       sidebarScrollable
diff --git a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/components/WorkingGroupPageHeader.tsx b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/components/WorkingGroupPageHeader.tsx
index 736bb8303e..fbbb94e841 100644
--- a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/components/WorkingGroupPageHeader.tsx
+++ b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/components/WorkingGroupPageHeader.tsx
@@ -5,20 +5,19 @@ import { PageHeader } from '@/app/components/PageHeader'
 import { nameMapping } from '@/common/helpers'
 import { CreateOpeningButton } from '@/working-groups/components/CreateOpeningButton'
 import { useMyWorkers } from '@/working-groups/hooks/useMyWorkers'
-import { useWorkingGroup } from '@/working-groups/hooks/useWorkingGroup'
-import { urlParamToWorkingGroupId } from '@/working-groups/model/workingGroupName'
+import { WorkingGroup } from '@/working-groups/types'
 
 import { StatusBadge, StatusGroup } from '../../components/StatusBadges'
 
 import { WorkingGroupTabs } from './WorkingGroupTabs'
 
 interface WorkingGroupPageHeaderProps {
+  group: WorkingGroup | undefined
   withButtons?: boolean
 }
 
-export const WorkingGroupPageHeader = React.memo(({ withButtons = false }: WorkingGroupPageHeaderProps) => {
+export const WorkingGroupPageHeader = React.memo(({ group, withButtons = false }: WorkingGroupPageHeaderProps) => {
   const { name } = useParams<{ name: string }>()
-  const { group } = useWorkingGroup({ name: urlParamToWorkingGroupId(name) })
   const { workers } = useMyWorkers()
   const isLead = useMemo(
     () => group?.isActive && workers.find((w) => w.membership.id === group?.leadId),
diff --git a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/components/WorkingGroupTabs.tsx b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/components/WorkingGroupTabs.tsx
index 6e0248df19..d74e2f2aa6 100644
--- a/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/components/WorkingGroupTabs.tsx
+++ b/packages/ui/src/app/pages/WorkingGroups/WorkingGroup/components/WorkingGroupTabs.tsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import { useParams } from 'react-router-dom'
+import { generatePath, useParams } from 'react-router-dom'
 
 import { usePageTabs, TabsDefinition } from '@/app/hooks/usePageTabs'
 import { Tabs } from '@/common/components/Tabs'
@@ -13,7 +13,7 @@ const workingGroupTabs: TabsDefinition[] = [
 
 export const WorkingGroupTabs = () => {
   const { name } = useParams<{ name: string }>()
-  const tabs = usePageTabs(workingGroupTabs.map(([title, path]) => [title, path.replace(':name', name)]))
+  const tabs = usePageTabs(workingGroupTabs.map(([title, path]) => [title, generatePath(path, { name })]))
 
   return <Tabs tabs={tabs} />
 }