feat: updated next auth session controller to handle both auth and pr…

…ofile status (#178)

src/components/Authentication/components/SessionController/components/NextSessionController/SessionController.tsx

@@ -1,19 +1,23 @@
 import { useSession } from "next-auth/react";
 import React, { Fragment, useEffect } from "react";
+import { updateAuthState } from "../../../../../../providers/authentication/auth/dispatch";
+import { useAuth } from "../../../../../../providers/authentication/auth/hook";
 import { updateAuthentication } from "../../../../../../providers/authentication/authentication/dispatch";
 import { useAuthentication } from "../../../../../../providers/authentication/authentication/hook";
 import { SessionControllerProps } from "./types";
-import { mapAuthentication } from "./utils";
+import { mapAuth, mapAuthentication } from "./utils";
 
 export function SessionController({
   children,
 }: SessionControllerProps): JSX.Element {
+  const { authDispatch } = useAuth();
   const { authenticationDispatch } = useAuthentication();
   const session = useSession();
 
   useEffect(() => {
+    authDispatch?.(updateAuthState(mapAuth(session)));
     authenticationDispatch?.(updateAuthentication(mapAuthentication(session)));
-  }, [authenticationDispatch, session]);
+  }, [authDispatch, authenticationDispatch, session]);
 
   return <Fragment>{children}</Fragment>;
 }

src/components/Authentication/components/SessionController/components/NextSessionController/constants.ts

@@ -0,0 +1,21 @@
+import { SessionContextValue } from "next-auth/react";
+import { AUTH_STATUS } from "../../../../../../providers/authentication/auth/types";
+import { AUTHENTICATION_STATUS } from "../../../../../../providers/authentication/authentication/types";
+
+export const AUTH_STATUS_MAP: Record<
+  SessionContextValue["status"],
+  AUTH_STATUS
+> = {
+  authenticated: AUTH_STATUS.SETTLED,
+  loading: AUTH_STATUS.PENDING,
+  unauthenticated: AUTH_STATUS.SETTLED,
+};
+
+export const AUTHENTICATION_STATUS_MAP: Record<
+  SessionContextValue["status"],
+  AUTHENTICATION_STATUS
+> = {
+  authenticated: AUTHENTICATION_STATUS.SETTLED,
+  loading: AUTHENTICATION_STATUS.PENDING,
+  unauthenticated: AUTHENTICATION_STATUS.SETTLED,
+};

src/components/Authentication/components/SessionController/components/NextSessionController/utils.ts

@@ -1,10 +1,27 @@
 import { Session } from "next-auth";
 import { SessionContextValue } from "next-auth/react";
+import {
+  AUTH_STATUS,
+  UpdateAuthStatePayload,
+} from "../../../../../../providers/authentication/auth/types";
 import {
   AUTHENTICATION_STATUS,
   UpdateAuthenticationPayload,
   UserProfile,
 } from "../../../../../../providers/authentication/authentication/types";
+import { AUTH_STATUS_MAP, AUTHENTICATION_STATUS_MAP } from "./constants";
+
+/**
+ * Returns the auth state from the session context.
+ * @param session - Session context value.
+ * @returns auth state.
+ */
+export function mapAuth(session: SessionContextValue): UpdateAuthStatePayload {
+  return {
+    isAuthenticated: session.status === "authenticated",
+    status: mapStatus(session.status, AUTH_STATUS_MAP, AUTH_STATUS.SETTLED),
+  };
+}
 
 /**
  * Returns the authentication profile and status from the session context.
@@ -16,7 +33,11 @@ export function mapAuthentication(
 ): UpdateAuthenticationPayload {
   return {
     profile: mapProfile(session.data),
-    status: mapAuthenticationStatus(session.status),
+    status: mapStatus(
+      session.status,
+      AUTHENTICATION_STATUS_MAP,
+      AUTHENTICATION_STATUS.SETTLED
+    ),
   };
 }
 
@@ -38,19 +59,16 @@ function mapProfile(sessionData: Session | null): UserProfile | undefined {
 }
 
 /**
- * Returns the authentication status based on the session status.
+ * Returns the auth or authentication status <S> based on the session status.
  * @param status - Session status.
- * @returns authentication status.
+ * @param statusBySessionStatus - Map of session status to auth or authentication status.
+ * @param defaultStatus - Default auth or authentication status.
+ * @returns auth or authentication status.
  */
-function mapAuthenticationStatus(
-  status: SessionContextValue["status"]
-): AUTHENTICATION_STATUS {
-  switch (status) {
-    case "authenticated":
-      return AUTHENTICATION_STATUS.SETTLED;
-    case "loading":
-      return AUTHENTICATION_STATUS.PENDING;
-    default:
-      return AUTHENTICATION_STATUS.SETTLED;
-  }
+function mapStatus<S>(
+  status: SessionContextValue["status"],
+  statusBySessionStatus: Record<SessionContextValue["status"], S>,
+  defaultStatus: S
+): S {
+  return statusBySessionStatus[status] || defaultStatus;
 }

src/providers/nextAuthAuthentication/provider.tsx

@@ -3,7 +3,6 @@ import React from "react";
 import { SessionController } from "../../components/Authentication/components/SessionController/components/NextSessionController/SessionController";
 import { useAuthReducer } from "../../hooks/authentication/auth/useAuthReducer";
 import { useAuthenticationReducer } from "../../hooks/authentication/authentication/useAuthenticationReducer";
-import { useSessionAuth } from "../../hooks/authentication/session/useSessionAuth";
 import { useSessionCallbackUrl } from "../../hooks/authentication/session/useSessionCallbackUrl";
 import { useSessionIdleTimer } from "../../hooks/authentication/session/useSessionIdleTimer";
 import { AuthContext } from "../authentication/auth/context";
@@ -31,7 +30,6 @@ export function NextAuthAuthenticationProvider({
     },
     timeout,
   });
-  useSessionAuth({ authReducer, authenticationReducer });
   return (
     <SessionProvider session={session} refetchInterval={refetchInterval / 1000}>
       <AuthenticationContext.Provider value={authenticationReducer}>