Fix: Email signup and switching organization

frontend/src/components/signup/UserInfoStep.tsx

@@ -8,7 +8,7 @@ import jsrp from "jsrp";
 import nacl from "tweetnacl";
 import { encodeBase64 } from "tweetnacl-util";
 
-import { completeAccountSignup } from "@app/hooks/api/auth/queries";
+import { completeAccountSignup, useSelectOrganization } from "@app/hooks/api/auth/queries";
 import { fetchOrganizations } from "@app/hooks/api/organization/queries";
 import ProjectService from "@app/services/ProjectService";
 
@@ -79,6 +79,7 @@ export default function UserInfoStep({
 
   const [errors, setErrors] = useState<Errors>({});
 
+  const { mutateAsync: selectOrganization } = useSelectOrganization();
   const [isLoading, setIsLoading] = useState(false);
   const { t } = useTranslation();
 
@@ -181,6 +182,10 @@ export default function UserInfoStep({
               SecurityClient.setToken(response.token);
               SecurityClient.setProviderAuthToken("");
 
+              if (response.organizationId) {
+                await selectOrganization({ organizationId: response.organizationId });
+              }
+
               saveTokenToLocalStorage({
                 publicKey,
                 encryptedPrivateKey,

frontend/src/layouts/AppLayout/AppLayout.tsx

@@ -68,8 +68,10 @@ import {
   useGetSecretApprovalRequestCount,
   useGetUserAction,
   useLogoutUser,
-  useRegisterUserAction
+  useRegisterUserAction,
+  useSelectOrganization
 } from "@app/hooks/api";
+import { navigateUserToOrg } from "@app/views/Login/Login.utils";
 import { CreateOrgModal } from "@app/views/Org/components";
 
 interface LayoutProps {
@@ -100,7 +102,12 @@ const supportOptions = [
 ];
 
 const formSchema = yup.object({
-  name: yup.string().required().label("Project Name").trim().max(64, "Too long, maximum length is 64 characters"),
+  name: yup
+    .string()
+    .required()
+    .label("Project Name")
+    .trim()
+    .max(64, "Too long, maximum length is 64 characters"),
   addMembers: yup.bool().required().label("Add Members")
 });
 
@@ -147,6 +154,7 @@ export const AppLayout = ({ children }: LayoutProps) => {
   const { t } = useTranslation();
 
   const registerUserAction = useRegisterUserAction();
+  const { mutateAsync: selectOrganization } = useSelectOrganization();
 
   const closeUpdate = async () => {
     await registerUserAction.mutateAsync("december_update_closed");
@@ -164,8 +172,11 @@ export const AppLayout = ({ children }: LayoutProps) => {
   };
 
   const changeOrg = async (orgId: string) => {
-    localStorage.setItem("orgData.id", orgId);
-    router.push(`/org/${orgId}/overview`);
+    await selectOrganization({
+      organizationId: orgId
+    });
+
+    await navigateUserToOrg(router, orgId);
   };
 
   // TODO(akhilmhdh): This entire logic will be rechecked and will try to avoid
@@ -425,7 +436,7 @@ export const AppLayout = ({ children }: LayoutProps) => {
                       <Select
                         defaultValue={currentWorkspace?.id}
                         value={currentWorkspace?.id}
-                        className="w-full [&>*:first-child]:truncate bg-mineshaft-600 py-2.5 font-medium"
+                        className="w-full bg-mineshaft-600 py-2.5 font-medium [&>*:first-child]:truncate"
                         onValueChange={(value) => {
                           router.push(`/project/${value}/secrets/overview`);
                           localStorage.setItem("projectData.id", value);