From 64a9cf1cf3799a7bec3276df8e5a2e0003a6f839 Mon Sep 17 00:00:00 2001
From: Rafi Arrafif <rafiarrafif05@gmail.com>
Date: Tue, 2 Sep 2025 11:20:42 +0700
Subject: [PATCH] :boom: (breaking) replace useEffect with runOnce hook

using useRunOnce instead of using useEffect in a primitive way just to avoid React strict mode.
---
 features/oauth-callback/ui/LoadingProcess.tsx | 30 ++++++++-----------
 1 file changed, 13 insertions(+), 17 deletions(-)

diff --git a/features/oauth-callback/ui/LoadingProcess.tsx b/features/oauth-callback/ui/LoadingProcess.tsx
index 3ef51ad..bc70b56 100644
--- a/features/oauth-callback/ui/LoadingProcess.tsx
+++ b/features/oauth-callback/ui/LoadingProcess.tsx
@@ -1,29 +1,25 @@
 "use client";
 
+import React from "react";
 import { CircularProgress } from "@heroui/react";
-import React, { useEffect, useRef } from "react";
 import { SendCallbackToServer } from "../lib/sendCallbackToServer";
 import { useParams } from "next/navigation";
+import { useRunOnce } from "@/shared/hooks/useRunOnce";
 
 const LoadingProcess = () => {
   const params = useParams();
-  const calledRef = useRef(false);
-  useEffect(() => {
-    if (calledRef.current) return;
-    calledRef.current = true;
 
-    (async () => {
-      try {
-        await SendCallbackToServer(
-          window.location.search,
-          params.provider as string
-        );
-        window.close();
-      } catch (error) {
-        console.log(error);
-      }
-    })();
-  }, []);
+  useRunOnce("forwardCallbackResponseToBackend", async () => {
+    try {
+      await SendCallbackToServer(
+        window.location.search,
+        params.provider as string
+      );
+      window.close();
+    } catch (error) {
+      console.log(error);
+    }
+  });
   return (
     <div className="w-full flex flex-col items-center text-center mt-[26vh]">
       <CircularProgress aria-label="Loading..." size="lg" />