feat: resolved bug on org change select and project on change

This commit is contained in:
=
2025-01-06 19:01:10 +05:30
parent 0a6aef0afa
commit b7d11444a9
7 changed files with 95 additions and 74 deletions

View File

@@ -44,7 +44,7 @@
"@radix-ui/react-tooltip": "^1.1.5",
"@sindresorhus/slugify": "^2.2.1",
"@tanstack/react-query": "^5.62.7",
"@tanstack/react-router": "^1.87.9",
"@tanstack/react-router": "^1.95.1",
"@tanstack/virtual-file-routes": "^1.87.6",
"@tanstack/zod-adapter": "^1.91.0",
"@types/nprogress": "^0.2.3",
@@ -93,7 +93,7 @@
"@tailwindcss/typography": "^0.5.15",
"@tanstack/eslint-plugin-router": "^1.87.6",
"@tanstack/router-devtools": "^1.87.9",
"@tanstack/router-plugin": "^1.87.11",
"@tanstack/router-plugin": "^1.95.1",
"@types/argon2-browser": "^1.18.4",
"@types/file-saver": "^2.0.7",
"@types/jsrp": "^0.2.6",
@@ -1003,6 +1003,23 @@
"node": ">=12"
}
},
"node_modules/@esbuild/openbsd-arm64": {
"version": "0.23.1",
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.23.1.tgz",
"integrity": "sha512-3x37szhLexNA4bXhLrCC/LImN/YtWis6WXr1VESlfVtVeoFJBRINPJ3f0a/6LV8zpikqoUg4hyXw0sFBt5Cr+Q==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"openbsd"
],
"engines": {
"node": ">=18"
}
},
"node_modules/@esbuild/openbsd-x64": {
"version": "0.21.5",
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.21.5.tgz",
@@ -3635,9 +3652,9 @@
}
},
"node_modules/@tanstack/history": {
"version": "1.87.6",
"resolved": "https://registry.npmjs.org/@tanstack/history/-/history-1.87.6.tgz",
"integrity": "sha512-5OPHcc20Ye5XR+RBkFk+64TtRJ83clrpaOcC/S8t4N0k+/xPDJpkPEPnoENb3sQeRI28y1dJaUuvXt/dv/ylaQ==",
"version": "1.95.0",
"resolved": "https://registry.npmjs.org/@tanstack/history/-/history-1.95.0.tgz",
"integrity": "sha512-w1/yWuIBqmG0Z0MPMf1OuOCce7FXyVH4L4dIA4rvpnjIUCH8qRUgloFAVg37nTMUbOmhMsY2NZDxCpKBv+CLJg==",
"license": "MIT",
"engines": {
"node": ">=12"
@@ -3674,13 +3691,13 @@
}
},
"node_modules/@tanstack/react-router": {
"version": "1.87.9",
"resolved": "https://registry.npmjs.org/@tanstack/react-router/-/react-router-1.87.9.tgz",
"integrity": "sha512-oHmgGsN5rEZkRfCDei9OisOGDpLTUgdriW8nNvaNwYdnd1x7igR4gXYbX57Pv7JJjG0CHsmlR/2Oisp7JYoZqA==",
"version": "1.95.1",
"resolved": "https://registry.npmjs.org/@tanstack/react-router/-/react-router-1.95.1.tgz",
"integrity": "sha512-P5x4yNhcdkYsCEoYeGZP8Q9Jlxf0WXJa4G/xvbmM905seZc9FqJqvCSRvX3dWTPOXRABhl4g+8DHqfft0c/AvQ==",
"license": "MIT",
"dependencies": {
"@tanstack/history": "1.87.6",
"@tanstack/react-store": "^0.6.1",
"@tanstack/history": "1.95.0",
"@tanstack/react-store": "^0.7.0",
"jsesc": "^3.0.2",
"tiny-invariant": "^1.3.3",
"tiny-warning": "^1.0.3"
@@ -3693,24 +3710,18 @@
"url": "https://github.com/sponsors/tannerlinsley"
},
"peerDependencies": {
"@tanstack/router-generator": "^1.87.7",
"react": ">=18",
"react-dom": ">=18"
},
"peerDependenciesMeta": {
"@tanstack/router-generator": {
"optional": true
}
}
},
"node_modules/@tanstack/react-store": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/@tanstack/react-store/-/react-store-0.6.1.tgz",
"integrity": "sha512-6gOopOpPp1cAXkEyTEv6tMbAywwFunvIdCKN/SpEiButUayjXU+Q5Sp5Y3hREN3VMR4OA5+RI5SPhhJoqP9e4w==",
"version": "0.7.0",
"resolved": "https://registry.npmjs.org/@tanstack/react-store/-/react-store-0.7.0.tgz",
"integrity": "sha512-S/Rq17HaGOk+tQHV/yrePMnG1xbsKZIl/VsNWnNXt4XW+tTY8dTlvpJH2ZQ3GRALsusG5K6Q3unAGJ2pd9W/Ng==",
"license": "MIT",
"dependencies": {
"@tanstack/store": "0.6.0",
"use-sync-external-store": "^1.2.2"
"@tanstack/store": "0.7.0",
"use-sync-external-store": "^1.4.0"
},
"funding": {
"type": "github",
@@ -3762,10 +3773,10 @@
}
},
"node_modules/@tanstack/router-generator": {
"version": "1.87.7",
"resolved": "https://registry.npmjs.org/@tanstack/router-generator/-/router-generator-1.87.7.tgz",
"integrity": "sha512-w9Px1C6DM0YNVXvu1VjUuZ5el0ykOeofEmEZBW83VUTzvCXFpcjPCHncU9FO9uXup8NFIxNfGz+xpwf93GoFnQ==",
"devOptional": true,
"version": "1.95.1",
"resolved": "https://registry.npmjs.org/@tanstack/router-generator/-/router-generator-1.95.1.tgz",
"integrity": "sha512-bUymh20C9AdtwLdZkgfx04S3N9yvm8S60xFFJu1dyYI7gn5g4aPSPYaQKYFmPhc+kQJ67ZbmWVkFBKHZ8YGYvA==",
"dev": true,
"license": "MIT",
"dependencies": {
"@tanstack/virtual-file-routes": "^1.87.6",
@@ -3779,12 +3790,20 @@
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
},
"peerDependencies": {
"@tanstack/react-router": "^1.95.1"
},
"peerDependenciesMeta": {
"@tanstack/react-router": {
"optional": true
}
}
},
"node_modules/@tanstack/router-plugin": {
"version": "1.87.11",
"resolved": "https://registry.npmjs.org/@tanstack/router-plugin/-/router-plugin-1.87.11.tgz",
"integrity": "sha512-mg8Ci9IT2H5aDBM6DippwKr1AHTBc6eudgpvHRMelGxLl4VY7vlKNx5Ds5yZeqE9Jp6VNr2z7E0xx70e8cFoBg==",
"version": "1.95.1",
"resolved": "https://registry.npmjs.org/@tanstack/router-plugin/-/router-plugin-1.95.1.tgz",
"integrity": "sha512-d8iIaehb/6fAUdhHOuIP/9B9pEXLy0AWTX8yWIK9PB3r/kSShWqNDrx7Qj0O6dg3xK3yiwHSNqPQMtA03s0vag==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -3796,13 +3815,13 @@
"@babel/template": "^7.25.9",
"@babel/traverse": "^7.26.4",
"@babel/types": "^7.26.3",
"@tanstack/router-generator": "^1.87.7",
"@tanstack/router-generator": "^1.95.1",
"@tanstack/virtual-file-routes": "^1.87.6",
"@types/babel__core": "^7.20.5",
"@types/babel__generator": "^7.6.8",
"@types/babel__template": "^7.4.4",
"@types/babel__traverse": "^7.20.6",
"babel-dead-code-elimination": "^1.0.6",
"babel-dead-code-elimination": "^1.0.8",
"chokidar": "^3.6.0",
"unplugin": "^1.16.0",
"zod": "^3.23.8"
@@ -3832,9 +3851,9 @@
}
},
"node_modules/@tanstack/store": {
"version": "0.6.0",
"resolved": "https://registry.npmjs.org/@tanstack/store/-/store-0.6.0.tgz",
"integrity": "sha512-+m2OBglsjXcLmmKOX6/9v8BDOCtyxhMmZLsRUDswOOSdIIR9mvv6i0XNKsmTh3AlYU8c1mRcodC8/Vyf+69VlQ==",
"version": "0.7.0",
"resolved": "https://registry.npmjs.org/@tanstack/store/-/store-0.7.0.tgz",
"integrity": "sha512-CNIhdoUsmD2NolYuaIs8VfWM467RK6oIBAW4nPEKZhg1smZ+/CwtCdpURgp7nxSqOaV9oKkzdWD80+bC66F/Jg==",
"license": "MIT",
"funding": {
"type": "github",
@@ -4782,9 +4801,9 @@
}
},
"node_modules/babel-dead-code-elimination": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/babel-dead-code-elimination/-/babel-dead-code-elimination-1.0.6.tgz",
"integrity": "sha512-JxFi9qyRJpN0LjEbbjbN8g0ux71Qppn9R8Qe3k6QzHg2CaKsbUQtbn307LQGiDLGjV6JCtEFqfxzVig9MyDCHQ==",
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/babel-dead-code-elimination/-/babel-dead-code-elimination-1.0.8.tgz",
"integrity": "sha512-og6HQERk0Cmm+nTT4Od2wbPtgABXFMPaHACjbKLulZIFMkYyXZLkUGuAxdgpMJBrxyt/XFpSz++lNzjbcMnPkQ==",
"dev": true,
"license": "MIT",
"dependencies": {
@@ -7274,7 +7293,7 @@
"version": "4.8.1",
"resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.8.1.tgz",
"integrity": "sha512-k9PN+cFBmaLWtVz29SkUoqU5O0slLuHJXt/2P+tMVFT+phsSGXGkp9t3rQIqdz0e+06EHNGs3oM6ZX1s2zHxRg==",
"devOptional": true,
"dev": true,
"license": "MIT",
"dependencies": {
"resolve-pkg-maps": "^1.0.0"
@@ -9466,7 +9485,7 @@
"version": "3.4.2",
"resolved": "https://registry.npmjs.org/prettier/-/prettier-3.4.2.tgz",
"integrity": "sha512-e9MewbtFo+Fevyuxn/4rrcDAaq0IYxPGLvObpQjiZBMAzB9IGmzlnG9RZy3FFas+eBMu2vA0CszMeduow5dIuQ==",
"devOptional": true,
"dev": true,
"license": "MIT",
"bin": {
"prettier": "bin/prettier.cjs"
@@ -10204,7 +10223,7 @@
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/resolve-pkg-maps/-/resolve-pkg-maps-1.0.0.tgz",
"integrity": "sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==",
"devOptional": true,
"dev": true,
"license": "MIT",
"funding": {
"url": "https://github.com/privatenumber/resolve-pkg-maps?sponsor=1"
@@ -11210,7 +11229,7 @@
"version": "4.19.2",
"resolved": "https://registry.npmjs.org/tsx/-/tsx-4.19.2.tgz",
"integrity": "sha512-pOUl6Vo2LUq/bSa8S5q7b91cgNSjctn9ugq/+Mvow99qW6x/UZYwzxy/3NmqoT66eHYfCVvFvACC58UBPFf28g==",
"devOptional": true,
"dev": true,
"license": "MIT",
"dependencies": {
"esbuild": "~0.23.0",
@@ -11532,23 +11551,6 @@
"node": ">=18"
}
},
"node_modules/tsx/node_modules/@esbuild/openbsd-arm64": {
"version": "0.23.1",
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.23.1.tgz",
"integrity": "sha512-3x37szhLexNA4bXhLrCC/LImN/YtWis6WXr1VESlfVtVeoFJBRINPJ3f0a/6LV8zpikqoUg4hyXw0sFBt5Cr+Q==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"openbsd"
],
"engines": {
"node": ">=18"
}
},
"node_modules/tsx/node_modules/@esbuild/openbsd-x64": {
"version": "0.23.1",
"resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.23.1.tgz",
@@ -11638,7 +11640,7 @@
"version": "0.23.1",
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.23.1.tgz",
"integrity": "sha512-VVNz/9Sa0bs5SELtn3f7qhJCDPCF5oMEl5cO9/SSinpE9hbPVvxbd572HH5AKiP7WD8INO53GgfDDhRjkylHEg==",
"devOptional": true,
"dev": true,
"hasInstallScript": true,
"license": "MIT",
"bin": {

View File

@@ -48,7 +48,7 @@
"@radix-ui/react-tooltip": "^1.1.5",
"@sindresorhus/slugify": "^2.2.1",
"@tanstack/react-query": "^5.62.7",
"@tanstack/react-router": "^1.87.9",
"@tanstack/react-router": "^1.95.1",
"@tanstack/virtual-file-routes": "^1.87.6",
"@tanstack/zod-adapter": "^1.91.0",
"@types/nprogress": "^0.2.3",
@@ -97,7 +97,7 @@
"@tailwindcss/typography": "^0.5.15",
"@tanstack/eslint-plugin-router": "^1.87.6",
"@tanstack/router-devtools": "^1.87.9",
"@tanstack/router-plugin": "^1.87.11",
"@tanstack/router-plugin": "^1.95.1",
"@types/argon2-browser": "^1.18.4",
"@types/file-saver": "^2.0.7",
"@types/jsrp": "^0.2.6",

View File

@@ -2,7 +2,8 @@ import { useState } from "react";
import { useTranslation } from "react-i18next";
import { faMobile } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Link, Outlet } from "@tanstack/react-router";
import { useQueryClient } from "@tanstack/react-query";
import { Link, Outlet, useNavigate, useRouter } from "@tanstack/react-router";
import { Mfa } from "@app/components/auth/Mfa";
import { CreateOrgModal } from "@app/components/organization/CreateOrgModal";
@@ -10,9 +11,11 @@ import SecurityClient from "@app/components/utilities/SecurityClient";
import { Menu, MenuItem } from "@app/components/v2";
import { useUser } from "@app/context";
import { usePopUp, useToggle } from "@app/hooks";
import { useSelectOrganization } from "@app/hooks/api";
import { useSelectOrganization, workspaceKeys } from "@app/hooks/api";
import { authKeys } from "@app/hooks/api/auth/queries";
import { MfaMethod } from "@app/hooks/api/auth/types";
import { ProjectType } from "@app/hooks/api/workspace/types";
import { navigateUserToOrg } from "@app/pages/auth/LoginPage/Login.utils";
import { InsecureConnectionBanner } from "./components/InsecureConnectionBanner";
import { SidebarFooter } from "./components/SidebarFooter";
@@ -27,10 +30,15 @@ export const OrganizationLayout = () => {
const { popUp, handlePopUpToggle } = usePopUp(["createOrg"] as const);
const { mutateAsync: selectOrganization } = useSelectOrganization();
const navigate = useNavigate();
const router = useRouter();
const queryClient = useQueryClient();
const { t } = useTranslation();
const handleOrgChange = async (orgId: string) => {
queryClient.removeQueries({ queryKey: authKeys.getAuthToken });
queryClient.removeQueries({ queryKey: workspaceKeys.getAllUserWorkspace() });
const { token, isMfaEnabled, mfaMethod } = await selectOrganization({
organizationId: orgId
});
@@ -42,9 +50,10 @@ export const OrganizationLayout = () => {
}
toggleShowMfa.on();
setMfaSuccessCallback(() => () => handleOrgChange(orgId));
return;
}
// await navigateUserToOrg(router, orgId);
await router.invalidate();
await navigateUserToOrg(navigate, orgId);
};
if (shouldShowMfa) {

View File

@@ -2,7 +2,8 @@ import { useState } from "react";
import { useTranslation } from "react-i18next";
import { faMobile } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Link, Outlet } from "@tanstack/react-router";
import { useQueryClient } from "@tanstack/react-query";
import { Link, Outlet, useNavigate, useRouter } from "@tanstack/react-router";
import { Mfa } from "@app/components/auth/Mfa";
import SecurityClient from "@app/components/utilities/SecurityClient";
@@ -12,10 +13,13 @@ import { useToggle } from "@app/hooks";
import {
useGetAccessRequestsCount,
useGetSecretApprovalRequestCount,
useSelectOrganization
useSelectOrganization,
workspaceKeys
} from "@app/hooks/api";
import { authKeys } from "@app/hooks/api/auth/queries";
import { MfaMethod } from "@app/hooks/api/auth/types";
import { ProjectType } from "@app/hooks/api/workspace/types";
import { navigateUserToOrg } from "@app/pages/auth/LoginPage/Login.utils";
import { InsecureConnectionBanner } from "../OrganizationLayout/components/InsecureConnectionBanner";
import { SidebarFooter } from "../OrganizationLayout/components/SidebarFooter";
@@ -26,6 +30,7 @@ import { SidebarHeader } from "./components/SidebarHeader";
// If the product layout differs significantly, create a new layout as needed.
export const ProjectLayout = () => {
const { currentWorkspace } = useWorkspace();
const navigate = useNavigate();
const [shouldShowMfa, toggleShowMfa] = useToggle(false);
const [requiredMfaMethod, setRequiredMfaMethod] = useState(MfaMethod.EMAIL);
@@ -36,6 +41,8 @@ export const ProjectLayout = () => {
const { mutateAsync: selectOrganization } = useSelectOrganization();
const { t } = useTranslation();
const router = useRouter();
const queryClient = useQueryClient();
const workspaceId = currentWorkspace?.id || "";
const projectSlug = currentWorkspace?.slug || "";
@@ -46,6 +53,9 @@ export const ProjectLayout = () => {
(secretApprovalReqCount?.open || 0) + (accessApprovalRequestCount?.pendingCount || 0);
const handleOrgChange = async (orgId: string) => {
queryClient.removeQueries({ queryKey: authKeys.getAuthToken });
queryClient.removeQueries({ queryKey: workspaceKeys.getAllUserWorkspace() });
const { token, isMfaEnabled, mfaMethod } = await selectOrganization({
organizationId: orgId
});
@@ -57,9 +67,10 @@ export const ProjectLayout = () => {
}
toggleShowMfa.on();
setMfaSuccessCallback(() => () => handleOrgChange(orgId));
return;
}
// await navigateUserToOrg(router, orgId);
await router.invalidate();
await navigateUserToOrg(navigate, orgId);
};
if (shouldShowMfa) {

View File

@@ -17,7 +17,7 @@ import {
useSubscription,
useWorkspace
} from "@app/context";
import { getProjectHomePage, getProjectTitle } from "@app/helpers/project";
import { getProjectTitle } from "@app/helpers/project";
import { usePopUp } from "@app/hooks";
import { useGetUserWorkspaces } from "@app/hooks/api";
import { useUpdateUserProjectFavorites } from "@app/hooks/api/users/mutation";
@@ -194,7 +194,7 @@ export const ProjectSelect = () => {
// todo(akhi): this is not using react query because react query in overview is throwing error when envs are not exact same count
// to reproduce change this back to router.push and switch between two projects with different env count
// look into this on dashboard revamp
window.location.assign(getProjectHomePage(project));
window.location.assign(`/${project.type}/${project.id}/overview`);
}}
options={options}
components={{

View File

@@ -10,7 +10,6 @@ export const Route = createFileRoute("/_authenticate")({
if (!context.serverConfig.initialized) {
throw redirect({ to: "/admin/signup" });
}
const data = await context.queryClient
.ensureQueryData({
queryKey: authKeys.getAuthToken,

View File

@@ -6,8 +6,8 @@ import { GithubOauthCallbackPage } from "./GithubOauthCallbackPage";
export const GithubOAuthCallbackPageQueryParamsSchema = z.object({
state: z.string().catch(""),
installation_id: z.string(),
code: z.string()
installation_id: z.string().catch(""),
code: z.string().catch("")
});
export const Route = createFileRoute(