From a8864574625f416fcc32adb409cf4ed627fc9fbe Mon Sep 17 00:00:00 2001
From: Timo K <toger5@hotmail.de>
Date: Thu, 22 Feb 2024 15:19:25 +0100
Subject: [PATCH] useState->useRef

Signed-off-by: Timo K <toger5@hotmail.de>
---
 src/useTheme.ts | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/useTheme.ts b/src/useTheme.ts
index 70a076a0..99a7e9cd 100644
--- a/src/useTheme.ts
+++ b/src/useTheme.ts
@@ -14,22 +14,20 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-import { useLayoutEffect, useState } from "react";
+import { useLayoutEffect, useRef } from "react";
 
 import { useUrlParams } from "./UrlParams";
 
 export const useTheme = (): void => {
   const { theme: themeName } = useUrlParams();
-  const [previousTheme, setPreviousTheme] = useState<string | null>(
-    document.body.classList.item(0),
-  );
+  const previousTheme = useRef<string | null>(document.body.classList.item(0));
   useLayoutEffect(() => {
     // Don't update the current theme if the url does not contain a theme prop.
     if (!themeName) return;
     const theme = themeName.includes("light") ? "light" : "dark";
     const themeHighContrast = themeName.includes("high-contrast") ? "-hc" : "";
     const themeString = "cpd-theme-" + theme + themeHighContrast;
-    if (themeString !== previousTheme) {
+    if (themeString !== previousTheme.current) {
       document.body.classList.remove(
         "cpd-theme-light",
         "cpd-theme-dark",
@@ -37,7 +35,7 @@ export const useTheme = (): void => {
         "cpd-theme-dark-hc",
       );
       document.body.classList.add(themeString);
-      setPreviousTheme(themeString);
+      previousTheme.current = themeString;
     }
   }, [previousTheme, themeName]);
 };