From 13f44f336d38dbedf10383988710c68c514593c3 Mon Sep 17 00:00:00 2001
From: Ardeman <are.theman@gmail.com>
Date: Fri, 28 Feb 2025 22:50:58 +0800
Subject: [PATCH] feat: update News context to use consistent setter naming and
 refactor FormLogin to utilize context

---
 app/contexts/news.tsx              |  6 +++---
 app/layouts/news/default.tsx       | 11 +++--------
 app/layouts/news/form-login.tsx    | 13 +++----------
 app/layouts/news/form-register.tsx | 19 +++++++++++++++++++
 4 files changed, 28 insertions(+), 21 deletions(-)

diff --git a/app/contexts/news.tsx b/app/contexts/news.tsx
index c26404f..336a966 100644
--- a/app/contexts/news.tsx
+++ b/app/contexts/news.tsx
@@ -15,7 +15,7 @@ export type NewsContextProperties = {
   isRegisterOpen: boolean
   setIsRegisterOpen: Dispatch<SetStateAction<boolean>>
   isForgetOpen: boolean
-  setForgetOpen: Dispatch<SetStateAction<boolean>>
+  setIsForgetOpen: Dispatch<SetStateAction<boolean>>
   isSuccessOpen: ModalProperties['isOpen']
   setIsSuccessOpen: Dispatch<
     SetStateAction<ModalProperties['isOpen'] | undefined>
@@ -29,7 +29,7 @@ const NewsContext = createContext<NewsContextProperties | undefined>(undefined)
 export const NewsProvider = ({ children }: PropsWithChildren) => {
   const [isLoginOpen, setIsLoginOpen] = useState(false)
   const [isRegisterOpen, setIsRegisterOpen] = useState(false)
-  const [isForgetOpen, setForgetOpen] = useState(false)
+  const [isForgetOpen, setIsForgetOpen] = useState(false)
   const [isSuccessOpen, setIsSuccessOpen] =
     useState<ModalProperties['isOpen']>()
   const [isInitSubscribeOpen, setIsInitSubscribeOpen] = useState(false)
@@ -42,7 +42,7 @@ export const NewsProvider = ({ children }: PropsWithChildren) => {
         isRegisterOpen,
         setIsRegisterOpen,
         isForgetOpen,
-        setForgetOpen,
+        setIsForgetOpen,
         isSuccessOpen,
         setIsSuccessOpen,
         isInitSubscribeOpen,
diff --git a/app/layouts/news/default.tsx b/app/layouts/news/default.tsx
index 5caf422..64b704a 100644
--- a/app/layouts/news/default.tsx
+++ b/app/layouts/news/default.tsx
@@ -22,7 +22,7 @@ export const NewsDefaultLayout = (properties: PropsWithChildren) => {
     isRegisterOpen,
     setIsRegisterOpen,
     isForgetOpen,
-    setForgetOpen,
+    setIsForgetOpen,
     isSuccessOpen,
     setIsSuccessOpen,
     isInitSubscribeOpen,
@@ -49,12 +49,7 @@ export const NewsDefaultLayout = (properties: PropsWithChildren) => {
         onClose={() => setIsLoginOpen(false)}
         description="Selamat Datang, silakan daftarkan akun Anda untuk melanjutkan!"
       >
-        <FormLogin
-          setIsRegisterOpen={setIsRegisterOpen}
-          setIsLoginOpen={setIsLoginOpen}
-          setIsForgetOpen={setForgetOpen}
-          setIsInitSubscribeOpen={setIsInitSubscribeOpen}
-        />
+        <FormLogin />
       </PopupModal>
 
       <PopupModal
@@ -67,7 +62,7 @@ export const NewsDefaultLayout = (properties: PropsWithChildren) => {
 
       <PopupModal
         isOpen={isForgetOpen}
-        onClose={() => setForgetOpen(false)}
+        onClose={() => setIsForgetOpen(false)}
         description="Selamat Datang, silakan isi keterangan akun Anda untuk melanjutkan!"
       >
         <FormForgotPassword />
diff --git a/app/layouts/news/form-login.tsx b/app/layouts/news/form-login.tsx
index 86135fd..e379a08 100644
--- a/app/layouts/news/form-login.tsx
+++ b/app/layouts/news/form-login.tsx
@@ -6,7 +6,7 @@ import { z } from 'zod'
 
 import { Button } from '~/components/ui/button'
 import { Input } from '~/components/ui/input'
-import type { NewsContextProperties } from '~/contexts/news'
+import { useNewsContext } from '~/contexts/news'
 
 export const loginSchema = z.object({
   email: z.string().email('Email tidak valid'),
@@ -15,20 +15,13 @@ export const loginSchema = z.object({
 
 export type TLoginSchema = z.infer<typeof loginSchema>
 
-type TProperties = {
-  setIsRegisterOpen: NewsContextProperties['setIsRegisterOpen']
-  setIsLoginOpen: NewsContextProperties['setIsLoginOpen']
-  setIsForgetOpen: NewsContextProperties['setForgetOpen']
-  setIsInitSubscribeOpen: NewsContextProperties['setIsInitSubscribeOpen']
-}
-
-export const FormLogin = (properties: TProperties) => {
+export const FormLogin = () => {
   const {
     setIsRegisterOpen,
     setIsLoginOpen,
     setIsForgetOpen,
     setIsInitSubscribeOpen,
-  } = properties
+  } = useNewsContext()
   const fetcher = useFetcher()
   const [error, setError] = useState<string>()
   const [disabled, setDisabled] = useState(false)
diff --git a/app/layouts/news/form-register.tsx b/app/layouts/news/form-register.tsx
index aadb932..4f5cb48 100644
--- a/app/layouts/news/form-register.tsx
+++ b/app/layouts/news/form-register.tsx
@@ -1,9 +1,12 @@
 import { useState } from 'react'
 
 import { Button } from '~/components/ui/button'
+import { useNewsContext } from '~/contexts/news'
 
 export const FormRegister = () => {
+  const { setIsLoginOpen, setIsRegisterOpen } = useNewsContext()
   const [showPassword, setShowPassword] = useState(false)
+
   return (
     <div className="flex flex-col items-center justify-center">
       <div className="w-full max-w-md">
@@ -104,6 +107,22 @@ export const FormRegister = () => {
             Daftar
           </Button>
         </form>
+
+        {/* Link Login */}
+        <div className="mt-4 text-center text-sm">
+          Sudah punya akun?{' '}
+          <Button
+            onClick={() => {
+              setIsLoginOpen(true)
+              setIsRegisterOpen(false)
+            }}
+            className="font-semibold text-[#2E2F7C]"
+            variant="link"
+            size="fit"
+          >
+            Masuk Disini
+          </Button>
+        </div>
       </div>
     </div>
   )