From 936aa388edfc0761c9e855f4028360be41a7c3fc Mon Sep 17 00:00:00 2001
From: Andrei Dekterev <avdekterev@gmail.com>
Date: Fri, 14 Oct 2022 16:14:44 +0600
Subject: [PATCH] fix(#2949): reset filters after click logo

---
 .../components/DateFilter/index.tsx           | 15 ++++-
 .../HeaderFilters/store/hooks/index.tsx       | 14 ++++-
 .../HomePage/components/Header/index.tsx      | 59 +++++++++++--------
 .../components/HeaderFilters/index.tsx        |  1 -
 4 files changed, 62 insertions(+), 27 deletions(-)

diff --git a/src/features/HeaderFilters/components/DateFilter/index.tsx b/src/features/HeaderFilters/components/DateFilter/index.tsx
index 8d2017aa..5a60422f 100644
--- a/src/features/HeaderFilters/components/DateFilter/index.tsx
+++ b/src/features/HeaderFilters/components/DateFilter/index.tsx
@@ -22,6 +22,8 @@ import {
   WeekNumber,
 } from './styled'
 
+import { useHeaderFiltersStore } from '../../store'
+
 export const DateFilter = () => {
   const {
     close,
@@ -35,6 +37,11 @@ export const DateFilter = () => {
     selectedDate,
     week,
   } = useDateFilter()
+
+  const {
+    resetFilters,
+  } = useHeaderFiltersStore()
+
   return (
     <Wrapper>
       <MonthWrapper>
@@ -59,7 +66,13 @@ export const DateFilter = () => {
               <WeekDay
                 key={day.name}
                 selected={day.date.getDate() === selectedDate.getDate()}
-                onClick={() => onWeekDayClick(day.date)}
+                onClick={() => {
+                  if (day.date.getDate() !== selectedDate.getDate()) {
+                    onWeekDayClick(day.date)
+                  } else {
+                    resetFilters()
+                  }
+                }}
               >
                 <WeekName>{day.name.slice(0, 3)}</WeekName>
                 <WeekNumber>{day.date.getDate()}</WeekNumber>
diff --git a/src/features/HeaderFilters/store/hooks/index.tsx b/src/features/HeaderFilters/store/hooks/index.tsx
index a72c901e..8530987c 100644
--- a/src/features/HeaderFilters/store/hooks/index.tsx
+++ b/src/features/HeaderFilters/store/hooks/index.tsx
@@ -32,6 +32,12 @@ export const useFilters = () => {
   const isTodaySelected = isToday(selectedDate)
 
   const resetFilters = useCallback(() => {
+    setIsShowTournament(true)
+    setSelectedFilters([])
+    setSelectedLeague(['all_competitions'])
+  }, [])
+
+  const updateDate = useCallback(() => {
     setSelectedDate(new Date())
   }, [setSelectedDate])
 
@@ -46,17 +52,18 @@ export const useFilters = () => {
 
   useEffect(() => {
     if (!search) {
-      resetFilters()
+      updateDate()
     }
   }, [
     isTodaySelected,
-    resetFilters,
+    updateDate,
     search,
   ])
 
   const store = useMemo(() => ({
     isShowTournament,
     isTodaySelected,
+    resetFilters,
     selectTournament,
     selectedDate,
     selectedFilters,
@@ -70,9 +77,11 @@ export const useFilters = () => {
     setSelectedSport,
     setSportIds,
     sportIds,
+    updateDate,
   }), [
     isShowTournament,
     isTodaySelected,
+    resetFilters,
     selectedDate,
     selectedFilters,
     selectedLeague,
@@ -86,6 +95,7 @@ export const useFilters = () => {
     setSelectedSport,
     setSportIds,
     sportIds,
+    updateDate,
   ])
 
   return store
diff --git a/src/features/HomePage/components/Header/index.tsx b/src/features/HomePage/components/Header/index.tsx
index 46804336..21b639ab 100644
--- a/src/features/HomePage/components/Header/index.tsx
+++ b/src/features/HomePage/components/Header/index.tsx
@@ -6,7 +6,7 @@ import { client } from 'config/clients'
 import { Menu } from 'features/Menu'
 import { ScoreSwitch } from 'features/MatchSwitches'
 import { Search } from 'features/Search'
-import { DateFilter } from 'features/HeaderFilters'
+import { DateFilter, useHeaderFiltersStore } from 'features/HeaderFilters'
 
 import {
   HeaderStyled,
@@ -15,25 +15,38 @@ import {
   Position,
 } from 'features/ProfileHeader/styled'
 
-export const Header = () => (
-  <HeaderStyled>
-    <Position
-      top={client.styles.logoTop}
-      left={client.styles.logoLeft}
-    >
-      <HeaderGroup>
-        <Link to={PAGES.home}>
-          <HeaderLogo />
-        </Link>
-        <Search />
-      </HeaderGroup>
-    </Position>
-    <DateFilter />
-    <Position right={0.71}>
-      <HeaderGroup>
-        <ScoreSwitch />
-        <Menu />
-      </HeaderGroup>
-    </Position>
-  </HeaderStyled>
-)
+export const Header = () => {
+  const {
+    resetFilters,
+    updateDate,
+  } = useHeaderFiltersStore()
+
+  return (
+    <HeaderStyled>
+      <Position
+        top={client.styles.logoTop}
+        left={client.styles.logoLeft}
+      >
+        <HeaderGroup>
+          <Link
+            to={PAGES.home}
+            onClick={() => {
+              updateDate()
+              resetFilters()
+            }}
+          >
+            <HeaderLogo />
+          </Link>
+          <Search />
+        </HeaderGroup>
+      </Position>
+      <DateFilter />
+      <Position right={0.71}>
+        <HeaderGroup>
+          <ScoreSwitch />
+          <Menu />
+        </HeaderGroup>
+      </Position>
+    </HeaderStyled>
+  )
+}
diff --git a/src/features/HomePage/components/HeaderFilters/index.tsx b/src/features/HomePage/components/HeaderFilters/index.tsx
index 2f6d7702..9114e223 100644
--- a/src/features/HomePage/components/HeaderFilters/index.tsx
+++ b/src/features/HomePage/components/HeaderFilters/index.tsx
@@ -52,7 +52,6 @@ export const HeaderFilters = () => {
             onClick={() => handleClickBack()}
           />
           <SelectFilter
-            // onModalOpen={() => console.log()}
             open={false}
             selectItem={selectTournament}
             withArrow={false}