Redirecting to overview page if environment doesn't exists in secrets main page

This commit is contained in:
Rhythm Bhiwani
2024-03-11 06:52:37 +05:30
parent f1b7653a52
commit 56bf82e4f6
2 changed files with 32 additions and 13 deletions

View File

@ -1,10 +1,11 @@
import { useCallback, useState } from "react";
import { useCallback, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { useRouter } from "next/router";
import { subject } from "@casl/ability";
import { faArrowDown, faArrowUp } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
import NavHeader from "@app/components/navigation/NavHeader";
import { PermissionDeniedBanner } from "@app/components/permissions";
import { ContentLoader } from "@app/components/v2";
@ -47,9 +48,10 @@ const LOADER_TEXT = [
export const SecretMainPage = () => {
const { t } = useTranslation();
const { currentWorkspace } = useWorkspace();
const { currentWorkspace, isLoading: isWorkspaceLoading } = useWorkspace();
const router = useRouter();
const { permission } = useProjectPermission();
const { createNotification } = useNotificationContext();
const [isVisible, setIsVisible] = useState(false);
const [sortDir, setSortDir] = useState<SortDir>(SortDir.ASC);
@ -65,6 +67,7 @@ export const SecretMainPage = () => {
// env slug
const environment = router.query.env as string;
const workspaceId = currentWorkspace?.id || "";
console.log("currentWorkspace", currentWorkspace, environment);
const secretPath = (router.query.secretPath as string) || "/";
const canReadSecret = permission.can(
ProjectPermissionActions.Read,
@ -75,6 +78,20 @@ export const SecretMainPage = () => {
ProjectPermissionSub.SecretRollback
);
useEffect(() => {
if (
!isWorkspaceLoading &&
!currentWorkspace?.environments.find((env) => env.slug === environment) &&
router.isReady
) {
router.push(`/project/${workspaceId}/secrets/overview`);
createNotification({
text: "No envronment found with given slug",
type: "error"
});
}
}, [isWorkspaceLoading, currentWorkspace, environment, router.isReady]);
const { data: decryptFileKey } = useGetUserWsKey(workspaceId);
// fetch secrets

View File

@ -2,15 +2,15 @@ import { useEffect, useRef, useState } from "react";
import { useTranslation } from "react-i18next";
import Link from "next/link";
import { useRouter } from "next/router";
import { faCheckCircle } from "@fortawesome/free-regular-svg-icons";
import { subject } from "@casl/ability";
import { faCheckCircle } from "@fortawesome/free-regular-svg-icons";
import {
faAngleDown,
faArrowDown,
faArrowUp,
faFolderBlank,
faList,
faFolderPlus,
faList,
faMagnifyingGlass,
faPlus
} from "@fortawesome/free-solid-svg-icons";
@ -207,10 +207,10 @@ export const SecretOverviewPage = () => {
};
const handleEnvSelect = (envId: string) => {
if (visibleEnvs.map(env => env.id).includes(envId)) {
setVisisbleEnvs(visibleEnvs.filter(env => env.id !== envId))
if (visibleEnvs.map((env) => env.id).includes(envId)) {
setVisisbleEnvs(visibleEnvs.filter((env) => env.id !== envId));
} else {
setVisisbleEnvs(visibleEnvs.concat(userAvailableEnvs.filter(env => env.id === envId)))
setVisisbleEnvs(visibleEnvs.concat(userAvailableEnvs.filter((env) => env.id === envId)));
}
};
@ -396,7 +396,7 @@ export const SecretOverviewPage = () => {
ariaLabel="Environments"
variant="plain"
size="sm"
className="flex justify-center items-center overflow-hidden p-0 w-11 bg-mineshaft-800 hover:bg-primary/10 hover:border-primary/60 border border-mineshaft-600 mr-2"
className="mr-2 flex w-11 items-center justify-center overflow-hidden border border-mineshaft-600 bg-mineshaft-800 p-0 hover:border-primary/60 hover:bg-primary/10"
>
<Tooltip content="Choose visible environments" className="mb-2">
<FontAwesomeIcon icon={faList} />
@ -408,17 +408,19 @@ export const SecretOverviewPage = () => {
{userAvailableEnvs.map((avaiableEnv) => {
const { id: envId, name } = avaiableEnv;
const isEnvSelected = visibleEnvs.map(env => env.id).includes(envId);
const isEnvSelected = visibleEnvs.map((env) => env.id).includes(envId);
return (
<DropdownMenuItem
onClick={() => handleEnvSelect(envId)}
key={envId}
icon={isEnvSelected && <FontAwesomeIcon className="text-primary" icon={faCheckCircle} />}
icon={
isEnvSelected && (
<FontAwesomeIcon className="text-primary" icon={faCheckCircle} />
)
}
iconPos="left"
>
<div className="flex items-center">
{name}
</div>
<div className="flex items-center">{name}</div>
</DropdownMenuItem>
);
})}