Merge pull request #426 from bigcapitalhq/big-163-user-email-verification-after-signing-up

feat: User email verification after signing-up.

packages/webapp/src/hooks/query/authentication.tsx

@@ -78,7 +78,7 @@ export const useAuthResetPassword = (props) => {
  */
 export const useAuthMetadata = (props) => {
   return useRequestQuery(
-    [t.AUTH_METADATA_PAGE,],
+    [t.AUTH_METADATA_PAGE],
     {
       method: 'get',
       url: `auth/meta`,
@@ -88,5 +88,35 @@ export const useAuthMetadata = (props) => {
       defaultData: {},
       ...props,
     },
-  ); 
+  );
+};
+
+/**
+ *
+ */
+export const useAuthSignUpVerifyResendMail = (props) => {
+  const apiRequest = useApiRequest();
+
+  return useMutation(
+    () => apiRequest.post('auth/register/verify/resend'),
+    props,
+  );
+};
+
+interface AuthSignUpVerifyValues {
+  token: string;
+  email: string;
 }
+
+/**
+ *
+ */
+export const useAuthSignUpVerify = (props) => {
+  const apiRequest = useApiRequest();
+
+  return useMutation(
+    (values: AuthSignUpVerifyValues) =>
+      apiRequest.post('auth/register/verify', values),
+    props,
+  );
+};

packages/webapp/src/hooks/query/users.tsx

@@ -5,6 +5,7 @@ import { useQueryTenant, useRequestQuery } from '../useQueryRequest';
 import useApiRequest from '../useRequest';
 import { useSetFeatureDashboardMeta } from '../state/feature';
 import t from './types';
+import { useSetAuthEmailConfirmed } from '../state';
 
 // Common invalidate queries.
 const commonInvalidateQueries = (queryClient) => {
@@ -130,6 +131,8 @@ export function useUser(id, props) {
 }
 
 export function useAuthenticatedAccount(props) {
+  const setEmailConfirmed = useSetAuthEmailConfirmed();
+
   return useRequestQuery(
     ['AuthenticatedAccount'],
     {
@@ -139,6 +142,9 @@ export function useAuthenticatedAccount(props) {
     {
       select: (response) => response.data.data,
       defaultData: {},
+      onSuccess: (data) => {
+        setEmailConfirmed(data.is_verified);
+      },
       ...props,
     },
   );
@@ -166,4 +172,3 @@ export const useDashboardMeta = (props) => {
   }, [state.isSuccess, state.data, setFeatureDashboardMeta]);
   return state;
 };
-

packages/webapp/src/hooks/state/authentication.tsx

@@ -2,7 +2,10 @@
 import { useDispatch, useSelector } from 'react-redux';
 import { useCallback } from 'react';
 import { isAuthenticated } from '@/store/authentication/authentication.reducer';
-import { setLogin } from '@/store/authentication/authentication.actions';
+import {
+  setEmailConfirmed,
+  setLogin,
+} from '@/store/authentication/authentication.actions';
 import { useQueryClient } from 'react-query';
 import { removeCookie } from '@/utils';
 
@@ -64,3 +67,22 @@ export const useAuthUser = () => {
 export const useAuthOrganizationId = () => {
   return useSelector((state) => state.authentication.organizationId);
 };
+
+/**
+ * Retrieves the user's email verification status.
+ */
+export const useAuthUserVerified = () => {
+  return useSelector((state) => state.authentication.verified);
+};
+
+/**
+ * Sets the user's email verification status.
+ */
+export const useSetAuthEmailConfirmed = () => {
+  const dispatch = useDispatch();
+
+  return useCallback(
+    (verified?: boolean = true) => dispatch(setEmailConfirmed(verified)),
+    [dispatch],
+  );
+};