From 76a7cfb3c631c5c8a074e376fe7ff0ba5a699071 Mon Sep 17 00:00:00 2001
From: Gresille&Siffle <39056254+GresilleSiffle@users.noreply.github.com>
Date: Thu, 24 Oct 2024 13:51:37 +0200
Subject: [PATCH] fix: simplify the hook

---
 frontend/src/hooks/index.ts                   |  2 +-
 frontend/src/hooks/useDocumentTitle.tsx       | 15 ++++++++++++
 .../src/hooks/useRestorePreviousTitle.tsx     | 18 ---------------
 .../src/pages/entities/EntityAnalysisPage.tsx | 23 ++++++++++---------
 4 files changed, 28 insertions(+), 30 deletions(-)
 create mode 100644 frontend/src/hooks/useDocumentTitle.tsx
 delete mode 100644 frontend/src/hooks/useRestorePreviousTitle.tsx

diff --git a/frontend/src/hooks/index.ts b/frontend/src/hooks/index.ts
index 2b8edb13d3..2421ff4971 100644
--- a/frontend/src/hooks/index.ts
+++ b/frontend/src/hooks/index.ts
@@ -8,4 +8,4 @@ export { useRefreshSettings } from './useRefreshSettings';
 export { useScrollToLocation } from './useScrollToLocation';
 export { useStats } from './useStats';
 export { usePreferredLanguages } from './usePreferredLanguages';
-export { useRestorePreviousTitle } from './useRestorePreviousTitle';
+export { useDocumentTitle } from './useDocumentTitle';
diff --git a/frontend/src/hooks/useDocumentTitle.tsx b/frontend/src/hooks/useDocumentTitle.tsx
new file mode 100644
index 0000000000..72dae6eee6
--- /dev/null
+++ b/frontend/src/hooks/useDocumentTitle.tsx
@@ -0,0 +1,15 @@
+import { useEffect, useState } from 'react';
+
+export const useDocumentTitle = (pageTitle: string) => {
+  const [previousTitle] = useState(document.title);
+
+  useEffect(() => {
+    document.title = pageTitle;
+  }, [pageTitle]);
+
+  useEffect(() => {
+    return () => {
+      document.title = previousTitle;
+    };
+  }, [previousTitle]);
+};
diff --git a/frontend/src/hooks/useRestorePreviousTitle.tsx b/frontend/src/hooks/useRestorePreviousTitle.tsx
deleted file mode 100644
index 0c7bad4142..0000000000
--- a/frontend/src/hooks/useRestorePreviousTitle.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { useEffect, useState } from 'react';
-import { useHistory } from 'react-router-dom';
-
-export const useRestorePreviousTitle = () => {
-  const history = useHistory();
-  const [previousTitle] = useState(document.title);
-
-  useEffect(() => {
-    return () => {
-      if (history.action === 'POP') {
-        document.title = previousTitle;
-      } else {
-        document.title = 'Tournesol';
-      }
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-};
diff --git a/frontend/src/pages/entities/EntityAnalysisPage.tsx b/frontend/src/pages/entities/EntityAnalysisPage.tsx
index fb4f63cc7f..b95feb2d5f 100644
--- a/frontend/src/pages/entities/EntityAnalysisPage.tsx
+++ b/frontend/src/pages/entities/EntityAnalysisPage.tsx
@@ -5,11 +5,7 @@ import { Link, useParams } from 'react-router-dom';
 import { Box, Button, Container, Grid, Typography } from '@mui/material';
 
 import { LoaderWrapper } from 'src/components';
-import {
-  useCurrentPoll,
-  useLoginState,
-  useRestorePreviousTitle,
-} from 'src/hooks';
+import { useCurrentPoll, useLoginState, useDocumentTitle } from 'src/hooks';
 import {
   ApiError,
   PollsService,
@@ -106,8 +102,18 @@ const EntityAnalysisPage = () => {
   const [entity, setEntity] = useState<Recommendation>();
   const [isLoading, setIsLoading] = useState(true);
   const [apiError, setApiError] = useState<ApiError>();
+  const [pageTitle, setPageTitle] = useState('Tournesol');
 
-  useRestorePreviousTitle();
+  useDocumentTitle(pageTitle);
+
+  useEffect(() => {
+    if (entity) {
+      const title = createPageTitle(t, pollName, entity.entity);
+      if (title) {
+        setPageTitle(title);
+      }
+    }
+  }, [currentLang, entity, pollName, t]);
 
   const tryToCreateVideo = async () => {
     if (pollName !== YOUTUBE_POLL_NAME) {
@@ -148,11 +154,6 @@ const EntityAnalysisPage = () => {
       try {
         const entity = await getEntityWithPollStats();
         setEntity(entity);
-
-        const title = createPageTitle(t, pollName, entity.entity);
-        if (title) {
-          document.title = title;
-        }
       } catch (error) {
         const reason: ApiError = error;
         if (reason.status === 404 && createVideo) {