diff --git a/frontend-v2/src/routes/__root.tsx b/frontend-v2/src/routes/__root.tsx
index 98ba2ceef..65c344299 100644
--- a/frontend-v2/src/routes/__root.tsx
+++ b/frontend-v2/src/routes/__root.tsx
@@ -30,7 +30,7 @@ const RootPage = () => {
export const Route = createRootRouteWithContext
()({
component: RootPage,
beforeLoad: async ({ context }) => {
- const serverConfig = await context.queryClient.fetchQuery({
+ const serverConfig = await context.queryClient.ensureQueryData({
queryKey: adminQueryKeys.serverConfig(),
queryFn: fetchServerConfig
});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/admin/-components/OrgAdminProjects/OrgAdminProjects.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/admin/-components/OrgAdminProjects/OrgAdminProjects.tsx
index 164c37a18..adba6d9a9 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/admin/-components/OrgAdminProjects/OrgAdminProjects.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/admin/-components/OrgAdminProjects/OrgAdminProjects.tsx
@@ -1,6 +1,7 @@
import { useState } from "react";
import { faEllipsis, faMagnifyingGlass, faSignIn } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { useNavigate } from "@tanstack/react-router";
import { format } from "date-fns";
import { motion } from "framer-motion";
@@ -31,7 +32,6 @@ import {
import { withPermission } from "@app/hoc";
import { useDebounce } from "@app/hooks";
import { useOrgAdminAccessProject, useOrgAdminGetProjects } from "@app/hooks/api";
-import { useNavigate } from "@tanstack/react-router";
import { ProjectType } from "@app/hooks/api/workspace/types";
export const OrgAdminProjects = withPermission(
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/admin/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/admin/index.tsx
index fd2868421..edef86c13 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/admin/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/admin/index.tsx
@@ -1,38 +1,31 @@
-import { useState } from 'react'
-import { Helmet } from 'react-helmet'
-import { useTranslation } from 'react-i18next'
-import { createFileRoute } from '@tanstack/react-router'
+import { useState } from "react";
+import { Helmet } from "react-helmet";
+import { useTranslation } from "react-i18next";
+import { createFileRoute } from "@tanstack/react-router";
-import { Tab, TabList, TabPanel, Tabs } from '@app/components/v2'
+import { Tab, TabList, TabPanel, Tabs } from "@app/components/v2";
-import { OrgAdminProjects } from './-components/OrgAdminProjects'
+import { OrgAdminProjects } from "./-components/OrgAdminProjects";
enum TabSections {
- Projects = 'projects',
+ Projects = "projects"
}
const OrgAdminPage = () => {
- const { t } = useTranslation()
- const [activeTab, setActiveTab] = useState(TabSections.Projects)
+ const { t } = useTranslation();
+ const [activeTab, setActiveTab] = useState(TabSections.Projects);
return (
<>
-
- {t('common.head-title', { title: t('settings.org.title') })}
-
+ {t("common.head-title", { title: t("settings.org.title") })}
-
- Organization Admin Console
-
+
Organization Admin Console
-
setActiveTab(el as TabSections)}
- >
+ setActiveTab(el as TabSections)}>
Projects
@@ -43,11 +36,11 @@ const OrgAdminPage = () => {
>
- )
-}
+ );
+};
export const Route = createFileRoute(
- '/_authenticate/_org_details/_org-layout/organization/$organizationId/admin/',
+ "/_authenticate/_org_details/_org-layout/organization/$organizationId/admin/"
)({
- component: OrgAdminPage,
-})
+ component: OrgAdminPage
+});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/billing/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/billing/index.tsx
index dc2a0de6a..62b1b61f2 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/billing/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/billing/index.tsx
@@ -1,52 +1,50 @@
-import { Helmet } from 'react-helmet'
-import { useTranslation } from 'react-i18next'
-import { createFileRoute } from '@tanstack/react-router'
+import { Helmet } from "react-helmet";
+import { useTranslation } from "react-i18next";
+import { createFileRoute } from "@tanstack/react-router";
-import { OrgPermissionActions, OrgPermissionSubjects } from '@app/context'
-import { withPermission } from '@app/hoc'
+import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
+import { withPermission } from "@app/hoc";
-import { BillingTabGroup } from './-components'
+import { BillingTabGroup } from "./-components";
const BillngPage = withPermission(
() => {
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
-
- {t('billing.title')}
-
+
{t("billing.title")}
- )
+ );
},
{
action: OrgPermissionActions.Read,
- subject: OrgPermissionSubjects.Billing,
- },
-)
+ subject: OrgPermissionSubjects.Billing
+ }
+);
const BillingRoute = () => {
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
- {t('common.head-title', { title: t('billing.title') })}
+ {t("common.head-title", { title: t("billing.title") })}
- )
-}
+ );
+};
export const Route = createFileRoute(
- '/_authenticate/_org_details/_org-layout/organization/$organizationId/billing/',
+ "/_authenticate/_org_details/_org-layout/organization/$organizationId/billing/"
)({
- component: BillingRoute,
-})
+ component: BillingRoute
+});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/groups/$groupId/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/groups/$groupId/index.tsx
index ed2867b09..a1c265405 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/groups/$groupId/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/groups/$groupId/index.tsx
@@ -1,12 +1,12 @@
-import { Helmet } from 'react-helmet'
-import { useTranslation } from 'react-i18next'
-import { faChevronLeft, faEllipsis } from '@fortawesome/free-solid-svg-icons'
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { createFileRoute, useNavigate, useParams } from '@tanstack/react-router'
-import { twMerge } from 'tailwind-merge'
+import { Helmet } from "react-helmet";
+import { useTranslation } from "react-i18next";
+import { faChevronLeft, faEllipsis } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { createFileRoute, useNavigate, useParams } from "@tanstack/react-router";
+import { twMerge } from "tailwind-merge";
-import { createNotification } from '@app/components/notifications'
-import { OrgPermissionCan } from '@app/components/permissions'
+import { createNotification } from "@app/components/notifications";
+import { OrgPermissionCan } from "@app/components/permissions";
import {
Button,
DeleteActionModal,
@@ -16,81 +16,74 @@ import {
DropdownMenuTrigger,
Spinner,
Tooltip,
- UpgradePlanModal,
-} from '@app/components/v2'
-import {
- OrgPermissionActions,
- OrgPermissionSubjects,
- useOrganization,
-} from '@app/context'
-import { withPermission } from '@app/hoc'
-import { useDeleteGroup } from '@app/hooks/api'
-import { useGetGroupById } from '@app/hooks/api/groups/queries'
-import { usePopUp } from '@app/hooks/usePopUp'
+ UpgradePlanModal
+} from "@app/components/v2";
+import { OrgPermissionActions, OrgPermissionSubjects, useOrganization } from "@app/context";
+import { withPermission } from "@app/hoc";
+import { useDeleteGroup } from "@app/hooks/api";
+import { useGetGroupById } from "@app/hooks/api/groups/queries";
+import { usePopUp } from "@app/hooks/usePopUp";
-import { GroupCreateUpdateModal } from './-components/GroupCreateUpdateModal'
-import { GroupMembersSection } from './-components/GroupMembersSection'
-import { GroupDetailsSection } from './-components'
+import { GroupCreateUpdateModal } from "./-components/GroupCreateUpdateModal";
+import { GroupMembersSection } from "./-components/GroupMembersSection";
+import { GroupDetailsSection } from "./-components";
export enum TabSections {
- Member = 'members',
- Groups = 'groups',
- Roles = 'roles',
- Identities = 'identities',
+ Member = "members",
+ Groups = "groups",
+ Roles = "roles",
+ Identities = "identities"
}
const GroupPage = withPermission(
() => {
- const navigate = useNavigate()
+ const navigate = useNavigate();
const params = useParams({
- from: '/_authenticate/_org_details/_org-layout/organization/$organizationId/groups/$groupId',
- })
- const groupId = params.groupId as string
- const { currentOrg } = useOrganization()
+ from: "/_authenticate/_org_details/_org-layout/organization/$organizationId/groups/$groupId/"
+ });
+ const groupId = params.groupId as string;
+ const { currentOrg } = useOrganization();
- const { data, isLoading } = useGetGroupById(groupId)
+ const { data, isLoading } = useGetGroupById(groupId);
- const { mutateAsync: deleteMutateAsync } = useDeleteGroup()
+ const { mutateAsync: deleteMutateAsync } = useDeleteGroup();
- const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } =
- usePopUp(['groupCreateUpdate', 'deleteGroup', 'upgradePlan'] as const)
+ const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
+ "groupCreateUpdate",
+ "deleteGroup",
+ "upgradePlan"
+ ] as const);
- const onDeleteGroupSubmit = async ({
- name,
- id,
- }: {
- name: string
- id: string
- }) => {
+ const onDeleteGroupSubmit = async ({ name, id }: { name: string; id: string }) => {
try {
await deleteMutateAsync({
- id,
- })
+ id
+ });
createNotification({
text: `Successfully deleted the ${name} group`,
- type: 'success',
- })
+ type: "success"
+ });
navigate({
- to: '/organization/$organizationId/members' as const,
+ to: "/organization/$organizationId/members" as const,
params: {
- organizationId: currentOrg.id,
+ organizationId: currentOrg.id
},
search: {
- selectedTab: TabSections.Groups,
- },
- })
+ selectedTab: TabSections.Groups
+ }
+ });
} catch (err) {
- console.error(err)
+ console.error(err);
createNotification({
text: `Failed to delete the ${name} group`,
- type: 'error',
- })
+ type: "error"
+ });
}
- handlePopUpClose('deleteGroup')
- }
+ handlePopUpClose("deleteGroup");
+ };
- if (isLoading) return
+ if (isLoading) return ;
return (
@@ -102,23 +95,21 @@ const GroupPage = withPermission(
leftIcon={
}
onClick={() => {
navigate({
- to: '/organization/$organizationId/members' as const,
+ to: "/organization/$organizationId/members" as const,
params: {
- organizationId: currentOrg.id,
+ organizationId: currentOrg.id
},
search: {
- selectedTab: TabSections.Groups,
- },
- })
+ selectedTab: TabSections.Groups
+ }
+ });
}}
className="mb-4"
>
Groups
-
- {data.group.name}
-
+
{data.group.name}
@@ -128,23 +119,19 @@ const GroupPage = withPermission(
-
+
{(isAllowed) => (
{
- handlePopUpOpen('groupCreateUpdate', {
+ handlePopUpOpen("groupCreateUpdate", {
groupId,
name: data.group.name,
slug: data.group.slug,
- role: data.group.role,
- })
+ role: data.group.role
+ });
}}
disabled={!isAllowed}
>
@@ -160,14 +147,14 @@ const GroupPage = withPermission(
{
- handlePopUpOpen('deleteGroup', {
+ handlePopUpOpen("deleteGroup", {
id: groupId,
- name: data.group.name,
- })
+ name: data.group.name
+ });
}}
disabled={!isAllowed}
>
@@ -180,15 +167,9 @@ const GroupPage = withPermission(
)}
@@ -200,46 +181,40 @@ const GroupPage = withPermission(
handlePopUpToggle('deleteGroup', isOpen)}
+ onChange={(isOpen) => handlePopUpToggle("deleteGroup", isOpen)}
deleteKey="confirm"
onDeleteApproved={() =>
- onDeleteGroupSubmit(
- popUp?.deleteGroup?.data as { name: string; id: string },
- )
+ onDeleteGroupSubmit(popUp?.deleteGroup?.data as { name: string; id: string })
}
/>
handlePopUpToggle('upgradePlan', isOpen)}
- text={
- (popUp.upgradePlan?.data as { description: string })?.description
- }
+ onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
+ text={(popUp.upgradePlan?.data as { description: string })?.description}
/>
- )
+ );
},
- { action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.Groups },
-)
+ { action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.Groups }
+);
const GroupDetailPage = () => {
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
<>
-
- {t('common.head-title', { title: t('settings.org.title') })}
-
+ {t("common.head-title", { title: t("settings.org.title") })}
>
- )
-}
+ );
+};
export const Route = createFileRoute(
- '/_authenticate/_org_details/_org-layout/organization/$organizationId/groups/$groupId/',
+ "/_authenticate/_org_details/_org-layout/organization/$organizationId/groups/$groupId/"
)({
- component: GroupDetailPage,
-})
+ component: GroupDetailPage
+});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/identities/$identityId/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/identities/$identityId/index.tsx
index f5e20cd97..0421015c9 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/identities/$identityId/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/identities/$identityId/index.tsx
@@ -1,14 +1,14 @@
/* eslint-disable @typescript-eslint/no-unused-vars */
-import { useState } from 'react'
-import { Helmet } from 'react-helmet'
-import { useTranslation } from 'react-i18next'
-import { faChevronLeft, faEllipsis } from '@fortawesome/free-solid-svg-icons'
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { createFileRoute, useNavigate, useParams } from '@tanstack/react-router'
-import { twMerge } from 'tailwind-merge'
+import { useState } from "react";
+import { Helmet } from "react-helmet";
+import { useTranslation } from "react-i18next";
+import { faChevronLeft, faEllipsis } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { createFileRoute, useNavigate, useParams } from "@tanstack/react-router";
+import { twMerge } from "tailwind-merge";
-import { createNotification } from '@app/components/notifications'
-import { OrgPermissionCan } from '@app/components/permissions'
+import { createNotification } from "@app/components/notifications";
+import { OrgPermissionCan } from "@app/components/permissions";
import {
Button,
DeleteActionModal,
@@ -17,168 +17,155 @@ import {
DropdownMenuItem,
DropdownMenuTrigger,
Tooltip,
- UpgradePlanModal,
-} from '@app/components/v2'
-import {
- OrgPermissionActions,
- OrgPermissionSubjects,
- useOrganization,
-} from '@app/context'
-import { withPermission } from '@app/hoc'
+ UpgradePlanModal
+} from "@app/components/v2";
+import { OrgPermissionActions, OrgPermissionSubjects, useOrganization } from "@app/context";
+import { withPermission } from "@app/hoc";
import {
IdentityAuthMethod,
useDeleteIdentity,
useGetIdentityById,
useRevokeIdentityTokenAuthToken,
- useRevokeIdentityUniversalAuthClientSecret,
-} from '@app/hooks/api'
-import { Identity } from '@app/hooks/api/identities/types'
-import { usePopUp } from '@app/hooks/usePopUp'
-import { TabSections } from '@app/types/org'
+ useRevokeIdentityUniversalAuthClientSecret
+} from "@app/hooks/api";
+import { Identity } from "@app/hooks/api/identities/types";
+import { usePopUp } from "@app/hooks/usePopUp";
+import { TabSections } from "@app/types/org";
-import { IdentityAuthMethodModal } from '../../members/-components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal'
-import { IdentityModal } from '../../members/-components/OrgIdentityTab/components/IdentitySection/IdentityModal'
-import { IdentityUniversalAuthClientSecretModal } from '../../members/-components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthClientSecretModal'
+import { IdentityAuthMethodModal } from "../../members/-components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal";
+import { IdentityModal } from "../../members/-components/OrgIdentityTab/components/IdentitySection/IdentityModal";
+import { IdentityUniversalAuthClientSecretModal } from "../../members/-components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthClientSecretModal";
import {
IdentityAuthenticationSection,
IdentityClientSecretModal,
IdentityDetailsSection,
IdentityProjectsSection,
IdentityTokenListModal,
- IdentityTokenModal,
-} from './-components'
+ IdentityTokenModal
+} from "./-components";
export const IdentitySection = withPermission(
() => {
- const navigate = useNavigate()
+ const navigate = useNavigate();
const params = useParams({
- from: '/_authenticate/_org_details/_org-layout/organization/$organizationId/identities/$identityId',
- })
- const identityId = params.identityId as string
- const { currentOrg } = useOrganization()
- const orgId = currentOrg?.id || ''
- const { data } = useGetIdentityById(identityId)
- const { mutateAsync: deleteIdentity } = useDeleteIdentity()
- const { mutateAsync: revokeToken } = useRevokeIdentityTokenAuthToken()
- const { mutateAsync: revokeClientSecret } =
- useRevokeIdentityUniversalAuthClientSecret()
+ from: "/_authenticate/_org_details/_org-layout/organization/$organizationId/identities/$identityId/"
+ });
+ const identityId = params.identityId as string;
+ const { currentOrg } = useOrganization();
+ const orgId = currentOrg?.id || "";
+ const { data } = useGetIdentityById(identityId);
+ const { mutateAsync: deleteIdentity } = useDeleteIdentity();
+ const { mutateAsync: revokeToken } = useRevokeIdentityTokenAuthToken();
+ const { mutateAsync: revokeClientSecret } = useRevokeIdentityUniversalAuthClientSecret();
const [selectedAuthMethod, setSelectedAuthMethod] = useState<
- Identity['authMethods'][number] | null
- >(null)
+ Identity["authMethods"][number] | null
+ >(null);
- const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } =
- usePopUp([
- 'identity',
- 'deleteIdentity',
- 'identityAuthMethod',
- 'revokeAuthMethod',
- 'token',
- 'tokenList',
- 'revokeToken',
- 'clientSecret',
- 'revokeClientSecret',
- 'universalAuthClientSecret', // list of client secrets
- 'upgradePlan',
- ] as const)
+ const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
+ "identity",
+ "deleteIdentity",
+ "identityAuthMethod",
+ "revokeAuthMethod",
+ "token",
+ "tokenList",
+ "revokeToken",
+ "clientSecret",
+ "revokeClientSecret",
+ "universalAuthClientSecret", // list of client secrets
+ "upgradePlan"
+ ] as const);
const onDeleteIdentitySubmit = async (id: string) => {
try {
await deleteIdentity({
identityId: id,
- organizationId: orgId,
- })
+ organizationId: orgId
+ });
createNotification({
- text: 'Successfully deleted identity',
- type: 'success',
- })
+ text: "Successfully deleted identity",
+ type: "success"
+ });
- handlePopUpClose('deleteIdentity')
+ handlePopUpClose("deleteIdentity");
navigate({
- to: `/organization/${orgId}/members` as const,
- search: {
- selectedTab: TabSections.Identities,
+ to: "/organization/$organizationId/members",
+ params: {
+ organizationId: orgId
},
- })
+ search: {
+ selectedTab: TabSections.Identities
+ }
+ });
} catch (err) {
- console.error(err)
- const error = err as any
- const text =
- error?.response?.data?.message ?? 'Failed to delete identity'
+ console.error(err);
+ const error = err as any;
+ const text = error?.response?.data?.message ?? "Failed to delete identity";
createNotification({
text,
- type: 'error',
- })
+ type: "error"
+ });
}
- }
+ };
const onRevokeTokenSubmit = async ({
identityId: parentIdentityId,
tokenId,
- name,
+ name
}: {
- identityId: string
- tokenId: string
- name: string
+ identityId: string;
+ tokenId: string;
+ name: string;
}) => {
try {
await revokeToken({
identityId: parentIdentityId,
- tokenId,
- })
+ tokenId
+ });
- handlePopUpClose('revokeToken')
+ handlePopUpClose("revokeToken");
createNotification({
- text: `Successfully revoked token ${name ?? ''}`,
- type: 'success',
- })
+ text: `Successfully revoked token ${name ?? ""}`,
+ type: "success"
+ });
} catch (err) {
- console.error(err)
- const error = err as any
- const text =
- error?.response?.data?.message ?? 'Failed to delete identity'
+ console.error(err);
+ const error = err as any;
+ const text = error?.response?.data?.message ?? "Failed to delete identity";
createNotification({
text,
- type: 'error',
- })
+ type: "error"
+ });
}
- }
+ };
- const onDeleteClientSecretSubmit = async ({
- clientSecretId,
- }: {
- clientSecretId: string
- }) => {
+ const onDeleteClientSecretSubmit = async ({ clientSecretId }: { clientSecretId: string }) => {
try {
- if (
- !data?.identity.id ||
- selectedAuthMethod !== IdentityAuthMethod.UNIVERSAL_AUTH
- )
- return
+ if (!data?.identity.id || selectedAuthMethod !== IdentityAuthMethod.UNIVERSAL_AUTH) return;
await revokeClientSecret({
identityId: data?.identity.id,
- clientSecretId,
- })
+ clientSecretId
+ });
- handlePopUpToggle('revokeClientSecret', false)
+ handlePopUpToggle("revokeClientSecret", false);
createNotification({
- text: 'Successfully deleted client secret',
- type: 'success',
- })
+ text: "Successfully deleted client secret",
+ type: "success"
+ });
} catch (err) {
- console.error(err)
+ console.error(err);
createNotification({
- text: 'Failed to delete client secret',
- type: 'error',
- })
+ text: "Failed to delete client secret",
+ type: "error"
+ });
}
- }
+ };
return (
@@ -190,20 +177,21 @@ export const IdentitySection = withPermission(
leftIcon={
}
onClick={() => {
navigate({
- to: `/organization/${orgId}/members` as const,
- search: {
- selectedTab: TabSections.Identities,
+ to: "/organization/$organizationId/members",
+ params: {
+ organizationId: orgId
},
- })
+ search: {
+ selectedTab: TabSections.Identities
+ }
+ });
}}
className="mb-4"
>
Identities
-
- {data.identity.name}
-
+
{data.identity.name}
@@ -220,16 +208,15 @@ export const IdentitySection = withPermission(
{(isAllowed) => (
{
- handlePopUpOpen('identity', {
+ handlePopUpOpen("identity", {
identityId,
name: data.identity.name,
role: data.role,
- customRole: data.customRole,
- })
+ customRole: data.customRole
+ });
}}
disabled={!isAllowed}
>
@@ -244,15 +231,14 @@ export const IdentitySection = withPermission(
{(isAllowed) => (
{
- handlePopUpOpen('identityAuthMethod', {
+ handlePopUpOpen("identityAuthMethod", {
identityId,
name: data.identity.name,
- allAuthMethods: data.identity.authMethods,
- })
+ allAuthMethods: data.identity.authMethods
+ });
}}
disabled={!isAllowed}
>
@@ -268,14 +254,14 @@ export const IdentitySection = withPermission(
{
- handlePopUpOpen('deleteIdentity', {
+ handlePopUpOpen("deleteIdentity", {
identityId,
- name: data.identity.name,
- })
+ name: data.identity.name
+ });
}}
disabled={!isAllowed}
>
@@ -288,10 +274,7 @@ export const IdentitySection = withPermission(
-
+
-
+
-
+
handlePopUpToggle('upgradePlan', isOpen)}
- text={
- (popUp.upgradePlan?.data as { description: string })?.description
- }
+ onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
+ text={(popUp.upgradePlan?.data as { description: string })?.description}
/>
handlePopUpToggle('deleteIdentity', isOpen)}
+ onChange={(isOpen) => handlePopUpToggle("deleteIdentity", isOpen)}
deleteKey="confirm"
onDeleteApproved={() =>
onDeleteIdentitySubmit(
- (popUp?.deleteIdentity?.data as { identityId: string })
- ?.identityId,
+ (popUp?.deleteIdentity?.data as { identityId: string })?.identityId
)
}
/>
handlePopUpToggle('revokeToken', isOpen)}
+ onChange={(isOpen) => handlePopUpToggle("revokeToken", isOpen)}
deleteKey="confirm"
onDeleteApproved={() => {
const revokeTokenData = popUp?.revokeToken?.data as {
- identityId: string
- tokenId: string
- name: string
- }
+ identityId: string;
+ tokenId: string;
+ name: string;
+ };
- return onRevokeTokenSubmit(revokeTokenData)
+ return onRevokeTokenSubmit(revokeTokenData);
}}
/>
handlePopUpToggle('revokeClientSecret', isOpen)}
+ onChange={(isOpen) => handlePopUpToggle("revokeClientSecret", isOpen)}
deleteKey="confirm"
onDeleteApproved={() => {
const deleteClientSecretData = popUp?.revokeClientSecret?.data as {
- clientSecretId: string
- clientSecretPrefix: string
- }
+ clientSecretId: string;
+ clientSecretPrefix: string;
+ };
return onDeleteClientSecretSubmit({
- clientSecretId: deleteClientSecretData.clientSecretId,
- })
+ clientSecretId: deleteClientSecretData.clientSecretId
+ });
}}
/>
- )
+ );
},
{
action: OrgPermissionActions.Read,
- subject: OrgPermissionSubjects.Identity,
- },
-)
+ subject: OrgPermissionSubjects.Identity
+ }
+);
const IdentityDetailPage = () => {
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
<>
-
- {t('common.head-title', { title: t('settings.org.title') })}
-
+ {t("common.head-title", { title: t("settings.org.title") })}
>
- )
-}
+ );
+};
export const Route = createFileRoute(
- '/_authenticate/_org_details/_org-layout/organization/$organizationId/identities/$identityId/',
+ "/_authenticate/_org_details/_org-layout/organization/$organizationId/identities/$identityId/"
)({
- component: IdentityDetailPage,
-})
+ component: IdentityDetailPage
+});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/kms/overview.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/kms/overview.tsx
index cb8b5f9d4..758d899de 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/kms/overview.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/kms/overview.tsx
@@ -1,13 +1,13 @@
-import { createFileRoute } from '@tanstack/react-router'
+import { createFileRoute } from "@tanstack/react-router";
-import { ProjectType } from '@app/hooks/api/workspace/types'
+import { ProjectType } from "@app/hooks/api/workspace/types";
-import { ProductOverview } from '../secret-manager/overview'
+import { ProductOverview } from "../secret-manager/overview";
-const KeyManagerOverviewPage = () =>
+const KeyManagerOverviewPage = () =>
;
export const Route = createFileRoute(
- '/_authenticate/_org_details/_org-layout/organization/$organizationId/kms/overview',
+ "/_authenticate/_org_details/_org-layout/organization/$organizationId/kms/overview"
)({
- component: KeyManagerOverviewPage,
-})
+ component: KeyManagerOverviewPage
+});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/OrgGroupsTab.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/OrgGroupsTab.tsx
index 428ee68d8..2192f78fd 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/OrgGroupsTab.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/OrgGroupsTab.tsx
@@ -15,4 +15,3 @@ export const OrgGroupsTab = () => {
);
};
-
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/OrgGroupsSection/OrgGroupsTable.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/OrgGroupsSection/OrgGroupsTable.tsx
index 6edcf9ba8..0e0506559 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/OrgGroupsSection/OrgGroupsTable.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/OrgGroupsSection/OrgGroupsTable.tsx
@@ -8,6 +8,7 @@ import {
faUsers
} from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { useNavigate } from "@tanstack/react-router";
import { twMerge } from "tailwind-merge";
import { createNotification } from "@app/components/notifications";
@@ -37,7 +38,6 @@ import { usePagination, useResetPageHelper } from "@app/hooks";
import { useGetOrganizationGroups, useGetOrgRoles, useUpdateGroup } from "@app/hooks/api";
import { OrderByDirection } from "@app/hooks/api/generic/types";
import { UsePopUpState } from "@app/hooks/usePopUp";
-import { useNavigate } from "@tanstack/react-router";
type Props = {
handlePopUpOpen: (
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/OrgGroupsSection/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/OrgGroupsSection/index.tsx
index ca3caabea..9928441a5 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/OrgGroupsSection/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/OrgGroupsSection/index.tsx
@@ -1 +1 @@
-export { OrgGroupsSection } from "./OrgGroupsSection";
\ No newline at end of file
+export { OrgGroupsSection } from "./OrgGroupsSection";
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/index.tsx
index ca3caabea..9928441a5 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/components/index.tsx
@@ -1 +1 @@
-export { OrgGroupsSection } from "./OrgGroupsSection";
\ No newline at end of file
+export { OrgGroupsSection } from "./OrgGroupsSection";
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/index.tsx
index 69936a978..35da86edf 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgGroupsTab/index.tsx
@@ -1 +1 @@
-export { OrgGroupsTab } from "./OrgGroupsTab";
\ No newline at end of file
+export { OrgGroupsTab } from "./OrgGroupsTab";
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgIdentityTab/components/IdentitySection/IdentityTable.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgIdentityTab/components/IdentitySection/IdentityTable.tsx
index 87f004f0c..b13889945 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgIdentityTab/components/IdentitySection/IdentityTable.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/-components/OrgIdentityTab/components/IdentitySection/IdentityTable.tsx
@@ -6,6 +6,7 @@ import {
faServer
} from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { useNavigate } from "@tanstack/react-router";
import { twMerge } from "tailwind-merge";
import { createNotification } from "@app/components/notifications";
@@ -37,7 +38,6 @@ import { useGetIdentityMembershipOrgs, useGetOrgRoles, useUpdateIdentity } from
import { OrderByDirection } from "@app/hooks/api/generic/types";
import { OrgIdentityOrderBy } from "@app/hooks/api/organization/types";
import { UsePopUpState } from "@app/hooks/usePopUp";
-import { useNavigate } from "@tanstack/react-router";
type Props = {
handlePopUpOpen: (
@@ -254,7 +254,13 @@ export const IdentityTable = ({ handlePopUpOpen }: Props) => {
)}
onClick={(e) => {
e.stopPropagation();
- navigate.push(`/org/${organizationId}/identities/${id}`);
+ navigate({
+ to: "/organization/$organizationId/identities/$identityId",
+ params: {
+ organizationId,
+ identityId: id
+ }
+ });
}}
disabled={!isAllowed}
>
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/index.tsx
index 920480b14..cca86e32f 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/members/index.tsx
@@ -1,54 +1,40 @@
/* eslint-disable @typescript-eslint/no-unused-vars */
-import { useEffect, useState } from 'react'
-import { Helmet } from 'react-helmet'
-import { useTranslation } from 'react-i18next'
-import { createFileRoute, useNavigate, useSearch } from '@tanstack/react-router'
+import { useEffect, useState } from "react";
+import { Helmet } from "react-helmet";
+import { useTranslation } from "react-i18next";
+import { createFileRoute, useNavigate, useSearch } from "@tanstack/react-router";
+import { zodValidator } from "@tanstack/zod-adapter";
+import { z } from "zod";
-import { Tab, TabList, TabPanel, Tabs } from '@app/components/v2'
-import { OrgPermissionActions, OrgPermissionSubjects } from '@app/context'
-import { withPermission } from '@app/hoc'
-import { TabSections } from '@app/types/org'
+import { Tab, TabList, TabPanel, Tabs } from "@app/components/v2";
+import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
+import { withPermission } from "@app/hoc";
+import { TabSections } from "@app/types/org";
-import {
- OrgGroupsTab,
- OrgIdentityTab,
- OrgMembersTab,
- OrgRoleTabSection,
-} from './-components'
+import { OrgGroupsTab, OrgIdentityTab, OrgMembersTab, OrgRoleTabSection } from "./-components";
export const MembersSection = withPermission(
() => {
const navigate = useNavigate({
- from: '/_authenticate/_org_details/_org-layout/organization/$organizationId/members',
- })
- const search = useSearch({
- from: '/_authenticate/_org_details/_org-layout/organization/$organizationId/members',
- })
- const selectedTab = search.selectedTab as TabSections
- const [activeTab, setActiveTab] = useState
(TabSections.Member)
-
- useEffect(() => {
- if (
- selectedTab &&
- Object.values(TabSections).includes(selectedTab as TabSections)
- ) {
- setActiveTab(selectedTab)
- }
- }, [selectedTab])
+ from: "/organization/$organizationId/members"
+ });
+ const selectedTab = useSearch({
+ from: "/_authenticate/_org_details/_org-layout/organization/$organizationId/members/",
+ select: (el) => el.selectedTab,
+ structuralSharing: true
+ });
const updateSelectedTab = (tab: string) => {
navigate({
- search: { ...search, selectedTab: tab },
- })
- }
+ search: { selectedTab: tab }
+ });
+ };
return (
-
- Organization Access Control
-
-
+ Organization Access Control
+
Users
Groups
@@ -74,29 +60,32 @@ export const MembersSection = withPermission(
- )
+ );
},
- { action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.Member },
-)
+ { action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.Member }
+);
const MembersPage = () => {
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
<>
-
- {t('common.head-title', { title: t('settings.org.title') })}
-
+ {t("common.head-title", { title: t("settings.org.title") })}
>
- )
-}
+ );
+};
+
+const MembersPageQuerySchema = z.object({
+ selectedTab: z.string().catch(TabSections.Member)
+});
export const Route = createFileRoute(
- '/_authenticate/_org_details/_org-layout/organization/$organizationId/members/',
+ "/_authenticate/_org_details/_org-layout/organization/$organizationId/members/"
)({
component: MembersPage,
-})
+ validateSearch: zodValidator(MembersPageQuerySchema)
+});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/memberships/$membershipId/-components/UserProjectsSection/UserAuditLogsSection.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/memberships/$membershipId/-components/UserProjectsSection/UserAuditLogsSection.tsx
index a5884a9f7..bf3e194c3 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/memberships/$membershipId/-components/UserProjectsSection/UserAuditLogsSection.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/memberships/$membershipId/-components/UserProjectsSection/UserAuditLogsSection.tsx
@@ -7,6 +7,8 @@ import { OrgPermissionActions, OrgPermissionSubjects, useSubscription } from "@a
import { withPermission } from "@app/hoc";
import { OrgUser } from "@app/hooks/api/types";
+import { LogsSection } from "../../../../audit-logs/-components";
+
type Props = {
orgMembership: OrgUser;
};
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/memberships/$membershipId/-components/UserProjectsSection/UserProjectRow.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/memberships/$membershipId/-components/UserProjectsSection/UserProjectRow.tsx
index 7eba6af93..6ddb0ea46 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/memberships/$membershipId/-components/UserProjectsSection/UserProjectRow.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/memberships/$membershipId/-components/UserProjectsSection/UserProjectRow.tsx
@@ -1,6 +1,7 @@
import { useMemo } from "react";
import { faTrash } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { useNavigate } from "@tanstack/react-router";
import { createNotification } from "@app/components/notifications";
import { IconButton, Tag, Td, Tooltip, Tr } from "@app/components/v2";
@@ -8,7 +9,6 @@ import { useWorkspace } from "@app/context";
import { ProjectMembershipRole } from "@app/hooks/api/roles/types";
import { TWorkspaceUser } from "@app/hooks/api/types";
import { UsePopUpState } from "@app/hooks/usePopUp";
-import { useNavigate } from "@tanstack/react-router";
import { TabSections } from "@app/types/org";
type Props = {
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/overview/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/overview/index.tsx
index 2d60819bc..79fa78ac9 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/overview/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/overview/index.tsx
@@ -1,15 +1,16 @@
-import { ProjectType } from '@app/hooks/api/workspace/types'
-import { createFileRoute, redirect } from '@tanstack/react-router'
+import { createFileRoute, redirect } from "@tanstack/react-router";
+
+import { ProjectType } from "@app/hooks/api/workspace/types";
export const Route = createFileRoute(
- '/_authenticate/_org_details/_org-layout/organization/$organizationId/overview/',
+ "/_authenticate/_org_details/_org-layout/organization/$organizationId/overview/"
)({
beforeLoad: ({ context }) => {
throw redirect({
- to: `/organization/$organizationId/${ProjectType.SecretManager}` as const,
+ to: `/organization/$organizationId/${ProjectType.SecretManager}/overview` as const,
params: {
- organizationId: context.organizationId,
- },
- })
- },
-})
+ organizationId: context.organizationId
+ }
+ });
+ }
+});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/roles/$roleId/-components/RoleModal.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/roles/$roleId/-components/RoleModal.tsx
index 874f36d66..855a15d4a 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/roles/$roleId/-components/RoleModal.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/roles/$roleId/-components/RoleModal.tsx
@@ -1,6 +1,7 @@
import { useEffect } from "react";
import { Controller, useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
+import { useNavigate } from "@tanstack/react-router";
import { z } from "zod";
import { createNotification } from "@app/components/notifications";
@@ -9,7 +10,6 @@ import { useOrganization } from "@app/context";
import { useCreateOrgRole, useGetOrgRole, useUpdateOrgRole } from "@app/hooks/api";
import { UsePopUpState } from "@app/hooks/usePopUp";
import { slugSchema } from "@app/lib/schemas";
-import { useNavigate } from "@tanstack/react-router";
const schema = z
.object({
@@ -104,7 +104,7 @@ export const RoleModal = ({ popUp, handlePopUpToggle }: Props) => {
handlePopUpToggle("role", false);
navigate({
- to: "/organization/$organizationId/roles/roleId",
+ to: "/organization/$organizationId/roles/$roleId",
params: {
organizationId: orgId,
roleId: newRole.id
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/roles/$roleId/index.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/roles/$roleId/index.tsx
index 3378bd546..18745b1e1 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/roles/$roleId/index.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/roles/$roleId/index.tsx
@@ -1,12 +1,12 @@
-import { Helmet } from 'react-helmet'
-import { useTranslation } from 'react-i18next'
-import { faChevronLeft, faEllipsis } from '@fortawesome/free-solid-svg-icons'
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { createFileRoute, useNavigate, useParams } from '@tanstack/react-router'
-import { twMerge } from 'tailwind-merge'
+import { Helmet } from "react-helmet";
+import { useTranslation } from "react-i18next";
+import { faChevronLeft, faEllipsis } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { createFileRoute, useNavigate, useParams } from "@tanstack/react-router";
+import { twMerge } from "tailwind-merge";
-import { createNotification } from '@app/components/notifications'
-import { OrgPermissionCan } from '@app/components/permissions'
+import { createNotification } from "@app/components/notifications";
+import { OrgPermissionCan } from "@app/components/permissions";
import {
Button,
DeleteActionModal,
@@ -14,79 +14,70 @@ import {
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
- Tooltip,
-} from '@app/components/v2'
-import {
- OrgPermissionActions,
- OrgPermissionSubjects,
- useOrganization,
-} from '@app/context'
-import { withPermission } from '@app/hoc'
-import { useDeleteOrgRole, useGetOrgRole } from '@app/hooks/api'
-import { usePopUp } from '@app/hooks/usePopUp'
-import { TabSections } from '@app/types/org'
+ Tooltip
+} from "@app/components/v2";
+import { OrgPermissionActions, OrgPermissionSubjects, useOrganization } from "@app/context";
+import { withPermission } from "@app/hoc";
+import { useDeleteOrgRole, useGetOrgRole } from "@app/hooks/api";
+import { usePopUp } from "@app/hooks/usePopUp";
+import { TabSections } from "@app/types/org";
-import {
- RoleDetailsSection,
- RoleModal,
- RolePermissionsSection,
-} from './-components'
+import { RoleDetailsSection, RoleModal, RolePermissionsSection } from "./-components";
export const RolePage = withPermission(
() => {
- const navigate = useNavigate()
+ const navigate = useNavigate();
const params = useParams({
- from: '/_authenticate/_org_details/_org-layout/organization/$organizationId/roles/$roleId',
- })
- const roleId = params.roleId as string
- const { currentOrg } = useOrganization()
- const orgId = currentOrg?.id || ''
- const { data } = useGetOrgRole(orgId, roleId)
- const { mutateAsync: deleteOrgRole } = useDeleteOrgRole()
+ from: "/_authenticate/_org_details/_org-layout/organization/$organizationId/roles/$roleId/"
+ });
+ const roleId = params.roleId as string;
+ const { currentOrg } = useOrganization();
+ const orgId = currentOrg?.id || "";
+ const { data } = useGetOrgRole(orgId, roleId);
+ const { mutateAsync: deleteOrgRole } = useDeleteOrgRole();
- const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } =
- usePopUp(['role', 'deleteOrgRole'] as const)
+ const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
+ "role",
+ "deleteOrgRole"
+ ] as const);
const onDeleteOrgRoleSubmit = async () => {
try {
- if (!orgId || !roleId) return
+ if (!orgId || !roleId) return;
await deleteOrgRole({
orgId,
- id: roleId,
- })
+ id: roleId
+ });
createNotification({
- text: 'Successfully deleted organization role',
- type: 'success',
- })
+ text: "Successfully deleted organization role",
+ type: "success"
+ });
- handlePopUpClose('deleteOrgRole')
+ handlePopUpClose("deleteOrgRole");
navigate({
- to: '/organization/$organizationId/members' as const,
+ to: "/organization/$organizationId/members" as const,
params: {
- organizationId: currentOrg.id,
+ organizationId: currentOrg.id
},
search: {
- selectedTab: TabSections.Roles,
- },
- })
+ selectedTab: TabSections.Roles
+ }
+ });
} catch (err) {
- console.error(err)
- const error = err as any
- const text =
- error?.response?.data?.message ?? 'Failed to delete organization role'
+ console.error(err);
+ const error = err as any;
+ const text = error?.response?.data?.message ?? "Failed to delete organization role";
createNotification({
text,
- type: 'error',
- })
+ type: "error"
+ });
}
- }
+ };
- const isCustomRole = !['admin', 'member', 'no-access'].includes(
- data?.slug ?? '',
- )
+ const isCustomRole = !["admin", "member", "no-access"].includes(data?.slug ?? "");
return (
@@ -98,14 +89,14 @@ export const RolePage = withPermission(
leftIcon={ }
onClick={() => {
navigate({
- to: '/organization/$organizationId/members' as const,
+ to: "/organization/$organizationId/members" as const,
params: {
- organizationId: currentOrg.id,
+ organizationId: currentOrg.id
},
search: {
- selectedTab: TabSections.Roles,
- },
- })
+ selectedTab: TabSections.Roles
+ }
+ });
}}
className="mb-4"
>
@@ -123,20 +114,16 @@ export const RolePage = withPermission(
-
+
{(isAllowed) => (
{
- handlePopUpOpen('role', {
- roleId,
- })
+ handlePopUpOpen("role", {
+ roleId
+ });
}}
disabled={!isAllowed}
>
@@ -152,11 +139,11 @@ export const RolePage = withPermission(
{
- handlePopUpOpen('deleteOrgRole')
+ handlePopUpOpen("deleteOrgRole");
}}
disabled={!isAllowed}
>
@@ -170,10 +157,7 @@ export const RolePage = withPermission(
@@ -182,34 +166,32 @@ export const RolePage = withPermission(
handlePopUpToggle('deleteOrgRole', isOpen)}
+ title={`Are you sure want to delete the organization role ${data?.name ?? ""}?`}
+ onChange={(isOpen) => handlePopUpToggle("deleteOrgRole", isOpen)}
deleteKey="confirm"
onDeleteApproved={() => onDeleteOrgRoleSubmit()}
/>
- )
+ );
},
- { action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.Role },
-)
+ { action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.Role }
+);
const OrgRoleRoute = () => {
- const { t } = useTranslation()
+ const { t } = useTranslation();
return (
<>
-
- {t('common.head-title', { title: t('settings.org.title') })}
-
+ {t("common.head-title", { title: t("settings.org.title") })}
>
- )
-}
+ );
+};
export const Route = createFileRoute(
- '/_authenticate/_org_details/_org-layout/organization/$organizationId/roles/$roleId/',
+ "/_authenticate/_org_details/_org-layout/organization/$organizationId/roles/$roleId/"
)({
- component: OrgRoleRoute,
-})
+ component: OrgRoleRoute
+});
diff --git a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/secret-manager/overview.tsx b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/secret-manager/overview.tsx
index b308dbdc9..2e98fe1b9 100644
--- a/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/secret-manager/overview.tsx
+++ b/frontend-v2/src/routes/_authenticate/_org_details/organization/$organizationId/secret-manager/overview.tsx
@@ -1,9 +1,9 @@
// REFACTOR(akhilmhdh): This file needs to be split into multiple components too complex
-import { ReactNode, useMemo, useState } from 'react'
-import { Helmet } from 'react-helmet'
-import { useTranslation } from 'react-i18next'
-import { faFolderOpen, faStar } from '@fortawesome/free-regular-svg-icons'
+import { ReactNode, useMemo, useState } from "react";
+import { Helmet } from "react-helmet";
+import { useTranslation } from "react-i18next";
+import { faFolderOpen, faStar } from "@fortawesome/free-regular-svg-icons";
import {
faArrowDownAZ,
faArrowRight,
@@ -14,14 +14,14 @@ import {
faMagnifyingGlass,
faPlus,
faSearch,
- faStar as faSolidStar,
-} from '@fortawesome/free-solid-svg-icons'
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { createFileRoute, useNavigate } from '@tanstack/react-router'
+ faStar as faSolidStar
+} from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { createFileRoute, useNavigate } from "@tanstack/react-router";
-import { createNotification } from '@app/components/notifications'
-import { OrgPermissionCan } from '@app/components/permissions'
-import { NewProjectModal } from '@app/components/projects'
+import { createNotification } from "@app/components/notifications";
+import { OrgPermissionCan } from "@app/components/permissions";
+import { NewProjectModal } from "@app/components/projects";
import {
Button,
IconButton,
@@ -29,89 +29,86 @@ import {
Pagination,
Skeleton,
Tooltip,
- UpgradePlanModal,
-} from '@app/components/v2'
+ UpgradePlanModal
+} from "@app/components/v2";
import {
OrgPermissionActions,
OrgPermissionSubjects,
useOrganization,
- useSubscription,
-} from '@app/context'
-import { getProjectHomePage } from '@app/helpers/project'
-import { usePagination, useResetPageHelper } from '@app/hooks'
-import { useGetUserWorkspaces } from '@app/hooks/api'
-import { OrderByDirection } from '@app/hooks/api/generic/types'
+ useSubscription
+} from "@app/context";
+import { getProjectHomePage } from "@app/helpers/project";
+import { usePagination, useResetPageHelper } from "@app/hooks";
+import { useGetUserWorkspaces } from "@app/hooks/api";
+import { OrderByDirection } from "@app/hooks/api/generic/types";
// import { fetchUserWsKey } from "@app/hooks/api/keys/queries";
-import { useFetchServerStatus } from '@app/hooks/api/serverDetails'
-import { Workspace } from '@app/hooks/api/types'
-import { useUpdateUserProjectFavorites } from '@app/hooks/api/users/mutation'
-import { useGetUserProjectFavorites } from '@app/hooks/api/users/queries'
-import { ProjectType } from '@app/hooks/api/workspace/types'
-import { usePopUp } from '@app/hooks/usePopUp'
+import { useFetchServerStatus } from "@app/hooks/api/serverDetails";
+import { Workspace } from "@app/hooks/api/types";
+import { useUpdateUserProjectFavorites } from "@app/hooks/api/users/mutation";
+import { useGetUserProjectFavorites } from "@app/hooks/api/users/queries";
+import { ProjectType } from "@app/hooks/api/workspace/types";
+import { usePopUp } from "@app/hooks/usePopUp";
enum ProjectsViewMode {
- GRID = 'grid',
- LIST = 'list',
+ GRID = "grid",
+ LIST = "list"
}
enum ProjectOrderBy {
- Name = 'name',
+ Name = "name"
}
const formatTitle = (type: ProjectType) => {
- if (type === ProjectType.SecretManager) return 'Secret Management'
- if (type === ProjectType.CertificateManager) return 'Cert Management'
- return 'Key Management'
-}
+ if (type === ProjectType.SecretManager) return "Secret Management";
+ if (type === ProjectType.CertificateManager) return "Cert Management";
+ return "Key Management";
+};
const formatDescription = (type: ProjectType) => {
if (type === ProjectType.SecretManager)
- return 'Securely store, manage, and rotate various application secrets, such as database credentials, API keys, etc.'
+ return "Securely store, manage, and rotate various application secrets, such as database credentials, API keys, etc.";
if (type === ProjectType.CertificateManager)
- return 'Manage your PKI infrastructure and issue digital certificates for services, applications, and devices.'
- return 'Centralize the management of keys for cryptographic operations, such as encryption and decryption.'
-}
+ return "Manage your PKI infrastructure and issue digital certificates for services, applications, and devices.";
+ return "Centralize the management of keys for cryptographic operations, such as encryption and decryption.";
+};
type Props = {
- type: ProjectType
-}
+ type: ProjectType;
+};
// #TODO: Update all the workspaceIds
export const ProductOverview = ({ type }: Props) => {
- const { t } = useTranslation()
+ const { t } = useTranslation();
- const navigate = useNavigate()
+ const navigate = useNavigate();
- const { data: workspaces, isLoading: isWorkspaceLoading } =
- useGetUserWorkspaces({ type })
- const { currentOrg } = useOrganization()
- const orgWorkspaces = workspaces || []
+ const { data: workspaces, isLoading: isWorkspaceLoading } = useGetUserWorkspaces({ type });
+ const { currentOrg } = useOrganization();
+ const orgWorkspaces = workspaces || [];
const { data: projectFavorites, isLoading: isProjectFavoritesLoading } =
- useGetUserProjectFavorites(currentOrg?.id)
- const { mutateAsync: updateUserProjectFavorites } =
- useUpdateUserProjectFavorites()
+ useGetUserProjectFavorites(currentOrg?.id);
+ const { mutateAsync: updateUserProjectFavorites } = useUpdateUserProjectFavorites();
- const isProjectViewLoading = isWorkspaceLoading || isProjectFavoritesLoading
+ const isProjectViewLoading = isWorkspaceLoading || isProjectFavoritesLoading;
const { popUp, handlePopUpOpen, handlePopUpToggle } = usePopUp([
- 'addNewWs',
- 'upgradePlan',
- ] as const)
+ "addNewWs",
+ "upgradePlan"
+ ] as const);
- const [searchFilter, setSearchFilter] = useState('')
- const { data: serverDetails } = useFetchServerStatus()
+ const [searchFilter, setSearchFilter] = useState("");
+ const { data: serverDetails } = useFetchServerStatus();
const [projectsViewMode, setProjectsViewMode] = useState
(
- (localStorage.getItem('projectsViewMode') as ProjectsViewMode) ||
- ProjectsViewMode.GRID,
- )
+ (localStorage.getItem("projectsViewMode") as ProjectsViewMode) || ProjectsViewMode.GRID
+ );
- const { subscription } = useSubscription()
+ const { subscription } = useSubscription();
const isAddingProjectsAllowed = subscription?.workspaceLimit
? subscription.workspacesUsed < subscription.workspaceLimit
- : true
+ : true;
- const isWorkspaceEmpty = !isProjectViewLoading && orgWorkspaces?.length === 0
+ const isWorkspaceEmpty = !isProjectViewLoading && orgWorkspaces?.length === 0;
const {
setPage,
@@ -121,76 +118,72 @@ export const ProductOverview = ({ type }: Props) => {
offset,
limit,
toggleOrderDirection,
- orderDirection,
- } = usePagination(ProjectOrderBy.Name, { initPerPage: 24 })
+ orderDirection
+ } = usePagination(ProjectOrderBy.Name, { initPerPage: 24 });
const filteredWorkspaces = useMemo(
() =>
orgWorkspaces
- .filter((ws) =>
- ws?.name?.toLowerCase().includes(searchFilter.toLowerCase()),
- )
+ .filter((ws) => ws?.name?.toLowerCase().includes(searchFilter.toLowerCase()))
.sort((a, b) =>
orderDirection === OrderByDirection.ASC
? a.name.toLowerCase().localeCompare(b.name.toLowerCase())
- : b.name.toLowerCase().localeCompare(a.name.toLowerCase()),
+ : b.name.toLowerCase().localeCompare(a.name.toLowerCase())
),
- [searchFilter, orderDirection, orgWorkspaces],
- )
+ [searchFilter, orderDirection, orgWorkspaces]
+ );
useResetPageHelper({
setPage,
offset,
- totalCount: filteredWorkspaces.length,
- })
+ totalCount: filteredWorkspaces.length
+ });
const { workspacesWithFaveProp } = useMemo(() => {
const workspacesWithFav = filteredWorkspaces
.map((w): Workspace & { isFavorite: boolean } => ({
...w,
- isFavorite: Boolean(projectFavorites?.includes(w.id)),
+ isFavorite: Boolean(projectFavorites?.includes(w.id))
}))
.sort((a, b) => Number(b.isFavorite) - Number(a.isFavorite))
- .slice(offset, limit * page)
+ .slice(offset, limit * page);
return {
- workspacesWithFaveProp: workspacesWithFav,
- }
- }, [filteredWorkspaces, projectFavorites])
+ workspacesWithFaveProp: workspacesWithFav
+ };
+ }, [filteredWorkspaces, projectFavorites]);
const addProjectToFavorites = async (projectId: string) => {
try {
if (currentOrg?.id) {
await updateUserProjectFavorites({
orgId: currentOrg?.id,
- projectFavorites: [...(projectFavorites || []), projectId],
- })
+ projectFavorites: [...(projectFavorites || []), projectId]
+ });
}
} catch {
createNotification({
- text: 'Failed to add project to favorites.',
- type: 'error',
- })
+ text: "Failed to add project to favorites.",
+ type: "error"
+ });
}
- }
+ };
const removeProjectFromFavorites = async (projectId: string) => {
try {
if (currentOrg?.id) {
await updateUserProjectFavorites({
orgId: currentOrg?.id,
- projectFavorites: [
- ...(projectFavorites || []).filter((entry) => entry !== projectId),
- ],
- })
+ projectFavorites: [...(projectFavorites || []).filter((entry) => entry !== projectId)]
+ });
}
} catch {
createNotification({
- text: 'Failed to remove project from favorites.',
- type: 'error',
- })
+ text: "Failed to remove project from favorites.",
+ type: "error"
+ });
}
- }
+ };
const renderProjectGridItem = (workspace: Workspace, isFavorite: boolean) => (
// eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events
@@ -198,24 +191,22 @@ export const ProductOverview = ({ type }: Props) => {
onClick={() => {
// TODO(rbr): fix this
navigate({
- to: getProjectHomePage(workspace),
- })
- localStorage.setItem('projectData.id', workspace.id)
+ to: getProjectHomePage(workspace)
+ });
+ localStorage.setItem("projectData.id", workspace.id);
}}
key={workspace.id}
className="flex h-40 min-w-72 cursor-pointer flex-col rounded-md border border-mineshaft-600 bg-mineshaft-800 p-4"
>
-
- {workspace.name}
-
+
{workspace.name}
{isFavorite ? (
{
- e.stopPropagation()
- removeProjectFromFavorites(workspace.id)
+ e.stopPropagation();
+ removeProjectFromFavorites(workspace.id);
}}
/>
) : (
@@ -223,8 +214,8 @@ export const ProductOverview = ({ type }: Props) => {
icon={faStar}
className="text-sm text-mineshaft-400 hover:text-mineshaft-300"
onClick={(e) => {
- e.stopPropagation()
- addProjectToFavorites(workspace.id)
+ e.stopPropagation();
+ addProjectToFavorites(workspace.id);
}}
/>
)}
@@ -233,10 +224,10 @@ export const ProductOverview = ({ type }: Props) => {
{workspace.description}
@@ -250,7 +241,7 @@ export const ProductOverview = ({ type }: Props) => {
)}
- Explore{' '}
+ Explore{" "}
{
- )
+ );
- const renderProjectListItem = (
- workspace: Workspace,
- isFavorite: boolean,
- index: number,
- ) => (
+ const renderProjectListItem = (workspace: Workspace, isFavorite: boolean, index: number) => (
// eslint-disable-next-line jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events
{
// TODO(rbr): fix this
navigate({
- to: getProjectHomePage(workspace),
- })
- localStorage.setItem('projectData.id', workspace.id)
+ to: getProjectHomePage(workspace)
+ });
+ localStorage.setItem("projectData.id", workspace.id);
}}
key={workspace.id}
className={`group grid h-14 min-w-72 cursor-pointer grid-cols-6 border-l border-r border-t border-mineshaft-600 bg-mineshaft-800 px-6 hover:bg-mineshaft-700 ${
- index === 0 && 'rounded-t-md'
+ index === 0 && "rounded-t-md"
}`}
>
-
- {workspace.name}
-
+
{workspace.name}
@@ -294,8 +279,8 @@ export const ProductOverview = ({ type }: Props) => {
icon={faSolidStar}
className="ml-6 text-sm text-yellow-600 hover:text-mineshaft-400"
onClick={(e) => {
- e.stopPropagation()
- removeProjectFromFavorites(workspace.id)
+ e.stopPropagation();
+ removeProjectFromFavorites(workspace.id);
}}
/>
) : (
@@ -303,16 +288,16 @@ export const ProductOverview = ({ type }: Props) => {
icon={faStar}
className="ml-6 text-sm text-mineshaft-400 hover:text-mineshaft-300"
onClick={(e) => {
- e.stopPropagation()
- addProjectToFavorites(workspace.id)
+ e.stopPropagation();
+ addProjectToFavorites(workspace.id);
}}
/>
)}
- )
+ );
- let projectsComponents: ReactNode
+ let projectsComponents: ReactNode;
if (filteredWorkspaces.length || isProjectViewLoading) {
switch (projectsViewMode) {
@@ -339,14 +324,14 @@ export const ProductOverview = ({ type }: Props) => {
{!isProjectViewLoading && (
<>
{workspacesWithFaveProp.map((workspace) =>
- renderProjectGridItem(workspace, workspace.isFavorite),
+ renderProjectGridItem(workspace, workspace.isFavorite)
)}
>
)}
- )
+ );
- break
+ break;
case ProjectsViewMode.LIST:
default:
projectsComponents = (
@@ -356,19 +341,19 @@ export const ProductOverview = ({ type }: Props) => {
))}
{!isProjectViewLoading &&
workspacesWithFaveProp.map((workspace, ind) =>
- renderProjectListItem(workspace, workspace.isFavorite, ind),
+ renderProjectListItem(workspace, workspace.isFavorite, ind)
)}
- )
- break
+ );
+ break;
}
} else if (orgWorkspaces.length && searchFilter) {
projectsComponents = (
@@ -377,19 +362,15 @@ export const ProductOverview = ({ type }: Props) => {
icon={faSearch}
className="mb-4 mt-2 w-full text-center text-5xl text-mineshaft-400"
/>
-
- No projects match search...
-
+ No projects match search...
- )
+ );
}
return (
-
- {t('common.head-title', { title: t('settings.members.title') })}
-
+ {t("common.head-title", { title: t("settings.members.title") })}
{!serverDetails?.redisConfigured && (
@@ -400,8 +381,8 @@ export const ProductOverview = ({ type }: Props) => {
icon={faExclamationCircle}
className="mr-4 p-4 text-2xl text-mineshaft-50"
/>
- Attention: Updated versions of Infisical now require Redis for full
- functionality. Learn how to configure it
+ Attention: Updated versions of Infisical now require Redis for full functionality. Learn
+ how to configure it
{
)}
-
- {formatTitle(type)}
-
+
{formatTitle(type)}
{formatDescription(type)}
@@ -437,9 +416,7 @@ export const ProductOverview = ({ type }: Props) => {
{
onClick={toggleOrderDirection}
>
@@ -460,15 +433,13 @@ export const ProductOverview = ({ type }: Props) => {
{
- localStorage.setItem('projectsViewMode', ProjectsViewMode.GRID)
- setProjectsViewMode(ProjectsViewMode.GRID)
+ localStorage.setItem("projectsViewMode", ProjectsViewMode.GRID);
+ setProjectsViewMode(ProjectsViewMode.GRID);
}}
ariaLabel="grid"
size="xs"
className={`${
- projectsViewMode === ProjectsViewMode.GRID
- ? 'bg-mineshaft-500'
- : 'bg-transparent'
+ projectsViewMode === ProjectsViewMode.GRID ? "bg-mineshaft-500" : "bg-transparent"
} min-w-[2.4rem] border-none hover:bg-mineshaft-600`}
>
@@ -476,24 +447,19 @@ export const ProductOverview = ({ type }: Props) => {
{
- localStorage.setItem('projectsViewMode', ProjectsViewMode.LIST)
- setProjectsViewMode(ProjectsViewMode.LIST)
+ localStorage.setItem("projectsViewMode", ProjectsViewMode.LIST);
+ setProjectsViewMode(ProjectsViewMode.LIST);
}}
ariaLabel="list"
size="xs"
className={`${
- projectsViewMode === ProjectsViewMode.LIST
- ? 'bg-mineshaft-500'
- : 'bg-transparent'
+ projectsViewMode === ProjectsViewMode.LIST ? "bg-mineshaft-500" : "bg-transparent"
} min-w-[2.4rem] border-none hover:bg-mineshaft-600`}
>
-
+
{(isAllowed) => (
{
leftIcon={ }
onClick={() => {
if (isAddingProjectsAllowed) {
- handlePopUpOpen('addNewWs')
+ handlePopUpOpen("addNewWs");
} else {
- handlePopUpOpen('upgradePlan')
+ handlePopUpOpen("upgradePlan");
}
}}
className="ml-2"
@@ -518,8 +484,8 @@ export const ProductOverview = ({ type }: Props) => {
{
className="mb-4 mt-2 w-full text-center text-5xl text-mineshaft-400"
/>
- You are not part of any projects in this organization yet. When
- you are, they will appear here.
+ You are not part of any projects in this organization yet. When you are, they will
+ appear here.
- Create a new project, or ask other organization members to give
- you necessary permissions.
+ Create a new project, or ask other organization members to give you necessary
+ permissions.
)}
handlePopUpToggle('addNewWs', isOpen)}
+ onOpenChange={(isOpen) => handlePopUpToggle("addNewWs", isOpen)}
projectType={type}
/>
handlePopUpToggle('upgradePlan', isOpen)}
+ onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
text="You have exceeded the number of projects allowed on the free plan."
/>
- )
-}
+ );
+};
-const SecretManagerOverviewPage = () => (
-