mirror of
https://github.com/awatertrevi/infisical.git
synced 2026-10-21 08:28:22 +00:00
fix: minor tw4 fixes and lint tw format
This commit is contained in:
@@ -76,7 +76,7 @@ export const AccessManagementPage = () => {
|
||||
const hasNoAccess = tabSections.every((tab) => tab.isHidden);
|
||||
|
||||
return (
|
||||
<div className="container mx-auto flex flex-col justify-between bg-bunker-800 text-white">
|
||||
<div className="bg-bunker-800 container mx-auto flex flex-col justify-between text-white">
|
||||
<Helmet>
|
||||
<title>{t("common.head-title", { title: t("settings.org.title") })}</title>
|
||||
</Helmet>
|
||||
@@ -86,12 +86,12 @@ export const AccessManagementPage = () => {
|
||||
description="Manage fine-grained access for users, groups, roles, and identities within your organization resources."
|
||||
/>
|
||||
{!currentOrg.shouldUseNewPrivilegeSystem && (
|
||||
<div className="mt-4 mb-4 flex flex-col rounded-r border-l-2 border-l-primary bg-mineshaft-300/5 px-4 py-2.5">
|
||||
<div className="border-l-primary bg-mineshaft-300/5 mb-4 mt-4 flex flex-col rounded-r border-l-2 px-4 py-2.5">
|
||||
<div className="mb-1 flex items-center text-sm">
|
||||
<FontAwesomeIcon icon={faInfoCircle} size="sm" className="mr-1.5 text-primary" />
|
||||
<FontAwesomeIcon icon={faInfoCircle} size="sm" className="text-primary mr-1.5" />
|
||||
Your organization is using legacy privilege management
|
||||
</div>
|
||||
<p className="mt-1 mb-2 text-sm text-bunker-300">
|
||||
<p className="text-bunker-300 mb-2 mt-1 text-sm">
|
||||
We've developed an improved privilege management system to better serve your
|
||||
security needs. Upgrade to our new permission-based approach that allows you to
|
||||
explicitly designate who can modify specific access levels, rather than relying on
|
||||
|
||||
+2
-2
@@ -55,9 +55,9 @@ export const OrgGroupsSection = () => {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<div className="border-mineshaft-600 bg-mineshaft-900 mb-6 rounded-lg border p-4">
|
||||
<div className="mb-4 flex items-center justify-between">
|
||||
<p className="text-xl font-medium text-mineshaft-100">Groups</p>
|
||||
<p className="text-mineshaft-100 text-xl font-medium">Groups</p>
|
||||
<OrgPermissionCan I={OrgPermissionGroupActions.Create} a={OrgPermissionSubjects.Groups}>
|
||||
{(isAllowed) => (
|
||||
<Button
|
||||
|
||||
+2
-2
@@ -249,7 +249,7 @@ export const OrgGroupsTable = ({ handlePopUpOpen }: Props) => {
|
||||
}
|
||||
})
|
||||
}
|
||||
className="h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 h-10 cursor-pointer transition-colors duration-100"
|
||||
key={`org-group-${id}`}
|
||||
>
|
||||
<Td>{name}</Td>
|
||||
@@ -264,7 +264,7 @@ export const OrgGroupsTable = ({ handlePopUpOpen }: Props) => {
|
||||
<Select
|
||||
value={role === "custom" ? (customRole?.slug as string) : role}
|
||||
isDisabled={!isAllowed}
|
||||
className="h-8 w-48 bg-mineshaft-700"
|
||||
className="bg-mineshaft-700 h-8 w-48"
|
||||
position="popper"
|
||||
dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
|
||||
onValueChange={(selectedRole) =>
|
||||
|
||||
+2
-2
@@ -182,7 +182,7 @@ export const IdentityAuthTemplatesTable = ({ handlePopUpOpen }: Props) => {
|
||||
{!isPending &&
|
||||
templates?.map((template) => (
|
||||
<Tr
|
||||
className="h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 h-10 cursor-pointer transition-colors duration-100"
|
||||
key={`template-${template.id}`}
|
||||
>
|
||||
<Td>{template.name}</Td>
|
||||
@@ -192,7 +192,7 @@ export const IdentityAuthTemplatesTable = ({ handlePopUpOpen }: Props) => {
|
||||
</div>
|
||||
</Td>
|
||||
<Td>
|
||||
<span className="text-sm text-mineshaft-400">
|
||||
<span className="text-mineshaft-400 text-sm">
|
||||
{template.templateFields.url}
|
||||
</span>
|
||||
</Td>
|
||||
|
||||
+1
-1
@@ -343,7 +343,7 @@ export const IdentityKubernetesAuthForm = ({
|
||||
);
|
||||
}
|
||||
}}
|
||||
className="w-full border border-mineshaft-500"
|
||||
className="border-mineshaft-500 w-full border"
|
||||
dropdownContainerClassName="max-w-none"
|
||||
isLoading={isGatewayLoading}
|
||||
placeholder="Default: Internet Gateway"
|
||||
|
||||
+3
-3
@@ -233,7 +233,7 @@ export const IdentityModal = ({ popUp, handlePopUpToggle }: Props) => {
|
||||
render={({ field: { onChange, value }, fieldState: { error } }) => (
|
||||
<FormControl errorText={error?.message} isError={Boolean(error)}>
|
||||
<Switch
|
||||
className="mr-2 ml-0 bg-mineshaft-400/80 shadow-inner data-[state=checked]:bg-green/80"
|
||||
className="bg-mineshaft-400/80 data-[state=checked]:bg-green/80 ml-0 mr-2 shadow-inner"
|
||||
containerClassName="flex-row-reverse w-fit"
|
||||
id="delete-protection-enabled"
|
||||
thumbClassName="bg-mineshaft-800"
|
||||
@@ -252,7 +252,7 @@ export const IdentityModal = ({ popUp, handlePopUpToggle }: Props) => {
|
||||
{metadataFormFields.fields.map(({ id: metadataFieldId }, i) => (
|
||||
<div key={metadataFieldId} className="flex items-end space-x-2">
|
||||
<div className="grow">
|
||||
{i === 0 && <span className="text-xs text-mineshaft-400">Key</span>}
|
||||
{i === 0 && <span className="text-mineshaft-400 text-xs">Key</span>}
|
||||
<Controller
|
||||
control={control}
|
||||
name={`metadata.${i}.key`}
|
||||
@@ -269,7 +269,7 @@ export const IdentityModal = ({ popUp, handlePopUpToggle }: Props) => {
|
||||
</div>
|
||||
<div className="grow">
|
||||
{i === 0 && (
|
||||
<FormLabel label="Value" className="text-xs text-mineshaft-400" isOptional />
|
||||
<FormLabel label="Value" className="text-mineshaft-400 text-xs" isOptional />
|
||||
)}
|
||||
<Controller
|
||||
control={control}
|
||||
|
||||
+6
-6
@@ -104,16 +104,16 @@ export const IdentitySection = withPermission(
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<div className="border-mineshaft-600 bg-mineshaft-900 rounded-lg border p-4">
|
||||
<div className="mb-4 flex items-center justify-between">
|
||||
<div className="flex items-center gap-1">
|
||||
<p className="text-xl font-medium text-mineshaft-100">Identities</p>
|
||||
<p className="text-mineshaft-100 text-xl font-medium">Identities</p>
|
||||
<a
|
||||
href="https://infisical.com/docs/documentation/platform/identities/overview"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<div className="mt-[0.16rem] ml-1 inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
|
||||
<div className="bg-yellow/20 text-yellow ml-1 mt-[0.16rem] inline-block rounded-md px-1.5 text-sm opacity-80 hover:opacity-100">
|
||||
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
|
||||
<span>Docs</span>
|
||||
<FontAwesomeIcon
|
||||
@@ -152,16 +152,16 @@ export const IdentitySection = withPermission(
|
||||
<IdentityTable handlePopUpOpen={handlePopUpOpen} />
|
||||
</div>
|
||||
{/* Identity Auth Templates Section */}
|
||||
<div className="mt-4 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<div className="border-mineshaft-600 bg-mineshaft-900 mt-4 rounded-lg border p-4">
|
||||
<div className="mb-4 flex items-center justify-between">
|
||||
<div className="flex items-center gap-1">
|
||||
<p className="text-xl font-medium text-mineshaft-100">Identity Auth Templates</p>
|
||||
<p className="text-mineshaft-100 text-xl font-medium">Identity Auth Templates</p>
|
||||
<a
|
||||
href="https://infisical.com/docs/documentation/platform/identities/auth-templates"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
>
|
||||
<div className="mt-[0.16rem] ml-1 inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
|
||||
<div className="bg-yellow/20 text-yellow ml-1 mt-[0.16rem] inline-block rounded-md px-1.5 text-sm opacity-80 hover:opacity-100">
|
||||
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
|
||||
<span>Docs</span>
|
||||
<FontAwesomeIcon
|
||||
|
||||
+7
-7
@@ -192,7 +192,7 @@ export const IdentityTable = ({ handlePopUpOpen }: Props) => {
|
||||
variant="plain"
|
||||
size="sm"
|
||||
className={twMerge(
|
||||
"flex h-9.5 w-[2.6rem] items-center justify-center overflow-hidden border border-mineshaft-600 bg-mineshaft-800 p-0 transition-all hover:border-primary/60 hover:bg-primary/10",
|
||||
"h-9.5 border-mineshaft-600 bg-mineshaft-800 hover:border-primary/60 hover:bg-primary/10 flex w-[2.6rem] items-center justify-center overflow-hidden border p-0 transition-all",
|
||||
isTableFiltered && "border-primary/50 text-primary"
|
||||
)}
|
||||
>
|
||||
@@ -208,8 +208,8 @@ export const IdentityTable = ({ handlePopUpOpen }: Props) => {
|
||||
>
|
||||
Roles
|
||||
</DropdownSubMenuTrigger>
|
||||
<DropdownSubMenuContent className="max-h-80 thin-scrollbar overflow-y-auto rounded-l-none">
|
||||
<DropdownMenuLabel className="sticky top-0 bg-mineshaft-900">
|
||||
<DropdownSubMenuContent className="thin-scrollbar max-h-80 overflow-y-auto rounded-l-none">
|
||||
<DropdownMenuLabel className="bg-mineshaft-900 sticky top-0">
|
||||
Apply Roles to Filter Identities
|
||||
</DropdownMenuLabel>
|
||||
{roles?.map(({ id, slug, name }) => (
|
||||
@@ -302,7 +302,7 @@ export const IdentityTable = ({ handlePopUpOpen }: Props) => {
|
||||
}) => {
|
||||
return (
|
||||
<Tr
|
||||
className="h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 h-10 cursor-pointer transition-colors duration-100"
|
||||
key={`identity-${id}`}
|
||||
onClick={() =>
|
||||
navigate({
|
||||
@@ -317,7 +317,7 @@ export const IdentityTable = ({ handlePopUpOpen }: Props) => {
|
||||
{name}
|
||||
{lastLoginAuthMethod && lastLoginTime && (
|
||||
<Tooltip
|
||||
className="max-w-96 min-w-52 px-3"
|
||||
className="min-w-52 max-w-96 px-3"
|
||||
content={
|
||||
<LastLoginSection
|
||||
lastLoginAuthMethod={identityAuthToNameMap[lastLoginAuthMethod]}
|
||||
@@ -327,7 +327,7 @@ export const IdentityTable = ({ handlePopUpOpen }: Props) => {
|
||||
>
|
||||
<FontAwesomeIcon
|
||||
icon={faInfoCircle}
|
||||
className="ml-2 text-mineshaft-400 opacity-0 transition-all group-hover:opacity-100"
|
||||
className="text-mineshaft-400 ml-2 opacity-0 transition-all group-hover:opacity-100"
|
||||
/>
|
||||
</Tooltip>
|
||||
)}
|
||||
@@ -342,7 +342,7 @@ export const IdentityTable = ({ handlePopUpOpen }: Props) => {
|
||||
<Select
|
||||
value={role === "custom" ? (customRole?.slug as string) : role}
|
||||
isDisabled={!isAllowed}
|
||||
className="h-8 w-48 bg-mineshaft-700"
|
||||
className="bg-mineshaft-700 h-8 w-48"
|
||||
position="popper"
|
||||
dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
|
||||
onValueChange={(selectedRole) =>
|
||||
|
||||
+1
-1
@@ -312,7 +312,7 @@ export const IdentityUniversalAuthForm = ({
|
||||
</TabList>
|
||||
<TabPanel value={IdentityFormTab.Configuration}>
|
||||
{accessTokenPeriodValue > 0 ? (
|
||||
<div className="mb-4 text-xs text-bunker-400">
|
||||
<div className="text-bunker-400 mb-4 text-xs">
|
||||
When Access Token Period is set, TTL and Max TTL are ignored.
|
||||
</div>
|
||||
) : (
|
||||
|
||||
+2
-2
@@ -57,7 +57,7 @@ export const MachineAuthTemplateUsagesModal = ({
|
||||
{!isPending &&
|
||||
usages.map((usage) => (
|
||||
<Tr
|
||||
className="h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 h-10 cursor-pointer transition-colors duration-100"
|
||||
key={`usage-${usage.identityId}`}
|
||||
onClick={() =>
|
||||
navigate({
|
||||
@@ -70,7 +70,7 @@ export const MachineAuthTemplateUsagesModal = ({
|
||||
>
|
||||
<Td>{usage.identityName}</Td>
|
||||
<Td>
|
||||
<span className="text-sm text-mineshaft-400">{usage.identityId}</span>
|
||||
<span className="text-mineshaft-400 text-sm">{usage.identityId}</span>
|
||||
</Td>
|
||||
</Tr>
|
||||
))}
|
||||
|
||||
+8
-8
@@ -35,7 +35,7 @@ export const LockoutTab = ({
|
||||
errorText={error?.message}
|
||||
>
|
||||
<Switch
|
||||
className="mr-3 ml-0 bg-mineshaft-400/80 shadow-inner data-[state=checked]:bg-green/80"
|
||||
className="bg-mineshaft-400/80 data-[state=checked]:bg-green/80 ml-0 mr-3 shadow-inner"
|
||||
containerClassName="flex-row-reverse w-fit"
|
||||
id="lockout-enabled"
|
||||
thumbClassName="bg-mineshaft-800"
|
||||
@@ -110,25 +110,25 @@ export const LockoutTab = ({
|
||||
>
|
||||
<SelectItem
|
||||
value="s"
|
||||
className="relative py-2 pr-8 pl-6 text-sm hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 relative py-2 pl-6 pr-8 text-sm"
|
||||
>
|
||||
<div className="ml-3 font-medium">Seconds</div>
|
||||
</SelectItem>
|
||||
<SelectItem
|
||||
value="m"
|
||||
className="relative py-2 pr-8 pl-6 text-sm hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 relative py-2 pl-6 pr-8 text-sm"
|
||||
>
|
||||
<div className="ml-3 font-medium">Minutes</div>
|
||||
</SelectItem>
|
||||
<SelectItem
|
||||
value="h"
|
||||
className="relative py-2 pr-8 pl-6 text-sm hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 relative py-2 pl-6 pr-8 text-sm"
|
||||
>
|
||||
<div className="ml-3 font-medium">Hours</div>
|
||||
</SelectItem>
|
||||
<SelectItem
|
||||
value="d"
|
||||
className="relative py-2 pr-8 pl-6 text-sm hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 relative py-2 pl-6 pr-8 text-sm"
|
||||
>
|
||||
<div className="ml-3 font-medium">Days</div>
|
||||
</SelectItem>
|
||||
@@ -177,19 +177,19 @@ export const LockoutTab = ({
|
||||
>
|
||||
<SelectItem
|
||||
value="s"
|
||||
className="relative py-2 pr-8 pl-6 text-sm hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 relative py-2 pl-6 pr-8 text-sm"
|
||||
>
|
||||
<div className="ml-3 font-medium">Seconds</div>
|
||||
</SelectItem>
|
||||
<SelectItem
|
||||
value="m"
|
||||
className="relative py-2 pr-8 pl-6 text-sm hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 relative py-2 pl-6 pr-8 text-sm"
|
||||
>
|
||||
<div className="ml-3 font-medium">Minutes</div>
|
||||
</SelectItem>
|
||||
<SelectItem
|
||||
value="h"
|
||||
className="relative py-2 pr-8 pl-6 text-sm hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 relative py-2 pl-6 pr-8 text-sm"
|
||||
>
|
||||
<div className="ml-3 font-medium">Hours</div>
|
||||
</SelectItem>
|
||||
|
||||
+1
-1
@@ -232,7 +232,7 @@ export const AddOrgMemberModal = ({
|
||||
<FormControl label="Emails" isError={Boolean(error)} errorText={error?.message}>
|
||||
<TextArea
|
||||
{...field}
|
||||
className="ring-opacity-70 mt-1 h-20 w-full min-w-120 rounded-md border border-mineshaft-500 bg-mineshaft-900/70 px-2 py-1 text-sm text-bunker-300 ring-primary-800 outline-hidden transition-all placeholder:text-bunker-400 focus:ring-2"
|
||||
className="min-w-120 border-mineshaft-500 bg-mineshaft-900/70 text-bunker-300 ring-primary-800 outline-hidden placeholder:text-bunker-400 mt-1 h-20 w-full rounded-md border px-2 py-1 text-sm ring-opacity-70 transition-all focus:ring-2"
|
||||
placeholder="[email protected], [email protected]..."
|
||||
/>
|
||||
</FormControl>
|
||||
|
||||
+2
-2
@@ -27,10 +27,10 @@ export const OrgInviteLink = ({ invite }: Props) => {
|
||||
|
||||
return (
|
||||
<div key={`invite-${invite.email}`}>
|
||||
<p className="text-sm text-mineshaft-400">
|
||||
<p className="text-mineshaft-400 text-sm">
|
||||
Invite for <span className="font-medium">{invite.email}</span>
|
||||
</p>
|
||||
<div className="flex flex-col gap-1 rounded-md bg-white/4 p-2 text-base text-gray-400">
|
||||
<div className="bg-white/4 flex flex-col gap-1 rounded-md p-2 text-base text-gray-400">
|
||||
<p
|
||||
className={twMerge(
|
||||
"mr-4 line-clamp-1",
|
||||
|
||||
+7
-7
@@ -158,11 +158,11 @@ export const OrgMembersSection = () => {
|
||||
selectedMemberIds.length > 0 && "h-16"
|
||||
)}
|
||||
>
|
||||
<div className="flex items-center rounded-md border border-mineshaft-600 bg-mineshaft-800 px-4 py-2 text-bunker-300">
|
||||
<div className="border-mineshaft-600 bg-mineshaft-800 text-bunker-300 flex items-center rounded-md border px-4 py-2">
|
||||
<div className="mr-2 text-sm">{selectedMemberIds.length} Selected</div>
|
||||
<button
|
||||
type="button"
|
||||
className="mr-auto text-xs text-mineshaft-400 underline-offset-2 hover:text-mineshaft-200 hover:underline"
|
||||
className="text-mineshaft-400 hover:text-mineshaft-200 mr-auto text-xs underline-offset-2 hover:underline"
|
||||
onClick={() => setSelectedMemberIds([])}
|
||||
>
|
||||
Unselect All
|
||||
@@ -201,9 +201,9 @@ export const OrgMembersSection = () => {
|
||||
</OrgPermissionCan>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<div className="border-mineshaft-600 bg-mineshaft-900 mb-6 rounded-lg border p-4">
|
||||
<div className="mb-4 flex items-center justify-between">
|
||||
<p className="text-xl font-medium text-mineshaft-100">Users</p>
|
||||
<p className="text-mineshaft-100 text-xl font-medium">Users</p>
|
||||
<OrgPermissionCan I={OrgPermissionActions.Create} a={OrgPermissionSubjects.Member}>
|
||||
{(isAllowed) => (
|
||||
<Button
|
||||
@@ -267,10 +267,10 @@ export const OrgMembersSection = () => {
|
||||
}
|
||||
buttonText="Remove"
|
||||
>
|
||||
<div className="mt-4 text-sm text-mineshaft-400">
|
||||
<div className="text-mineshaft-400 mt-4 text-sm">
|
||||
The following members will be removed:
|
||||
</div>
|
||||
<div className="mt-2 max-h-80 overflow-y-auto rounded-sm border border-mineshaft-600 bg-red/10 p-4 pl-8 text-sm text-red-200">
|
||||
<div className="border-mineshaft-600 bg-red/10 mt-2 max-h-80 overflow-y-auto rounded-sm border p-4 pl-8 text-sm text-red-200">
|
||||
<ul className="list-disc">
|
||||
{(popUp.removeMembers.data?.selectedOrgMemberships as OrgUser[])?.map((member) => {
|
||||
const email = member.user.email ?? member.user.username ?? member.inviteEmail;
|
||||
@@ -292,7 +292,7 @@ export const OrgMembersSection = () => {
|
||||
<div className="inline-block">
|
||||
<Badge
|
||||
variant="danger"
|
||||
className="mt-[0.05rem] ml-1 inline-flex w-min items-center gap-1.5 whitespace-nowrap"
|
||||
className="ml-1 mt-[0.05rem] inline-flex w-min items-center gap-1.5 whitespace-nowrap"
|
||||
>
|
||||
<FontAwesomeIcon icon={faBan} />
|
||||
<span>Ignored</span>
|
||||
|
||||
+9
-9
@@ -332,7 +332,7 @@ export const OrgMembersTable = ({
|
||||
variant="plain"
|
||||
size="sm"
|
||||
className={twMerge(
|
||||
"flex h-9.5 w-[2.6rem] items-center justify-center overflow-hidden border border-mineshaft-600 bg-mineshaft-800 p-0 transition-all hover:border-primary/60 hover:bg-primary/10",
|
||||
"h-9.5 border-mineshaft-600 bg-mineshaft-800 hover:border-primary/60 hover:bg-primary/10 flex w-[2.6rem] items-center justify-center overflow-hidden border p-0 transition-all",
|
||||
isTableFiltered && "border-primary/50 text-primary"
|
||||
)}
|
||||
>
|
||||
@@ -348,8 +348,8 @@ export const OrgMembersTable = ({
|
||||
>
|
||||
Roles
|
||||
</DropdownSubMenuTrigger>
|
||||
<DropdownSubMenuContent className="max-h-80 thin-scrollbar overflow-y-auto rounded-l-none">
|
||||
<DropdownMenuLabel className="sticky top-0 bg-mineshaft-900">
|
||||
<DropdownSubMenuContent className="thin-scrollbar max-h-80 overflow-y-auto rounded-l-none">
|
||||
<DropdownMenuLabel className="bg-mineshaft-900 sticky top-0">
|
||||
Apply Roles to Filter Users
|
||||
</DropdownMenuLabel>
|
||||
{roles?.map(({ id, slug, name }) => (
|
||||
@@ -492,7 +492,7 @@ export const OrgMembersTable = ({
|
||||
return (
|
||||
<Tr
|
||||
key={`org-membership-${orgMembershipId}`}
|
||||
className="h-10 w-full cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 h-10 w-full cursor-pointer transition-colors duration-100"
|
||||
onClick={() =>
|
||||
navigate({
|
||||
to: "/organization/members/$membershipId" as const,
|
||||
@@ -525,7 +525,7 @@ export const OrgMembersTable = ({
|
||||
</p>
|
||||
{u.superAdmin && (
|
||||
<Badge variant="primary" className="ml-2 w-min whitespace-nowrap">
|
||||
<span className="hidden xl:inline">Server Admin</span>
|
||||
<span className="mr-1 hidden xl:inline">Server Admin</span>
|
||||
<Tooltip content="Server Admin">
|
||||
<FontAwesomeIcon className="xl:hidden" icon={faUserShield} />
|
||||
</Tooltip>
|
||||
@@ -533,7 +533,7 @@ export const OrgMembersTable = ({
|
||||
)}
|
||||
{lastLoginAuthMethod && lastLoginTime && (
|
||||
<Tooltip
|
||||
className="max-w-96 min-w-52 px-3"
|
||||
className="min-w-52 max-w-96 px-3"
|
||||
content={
|
||||
<LastLoginSection
|
||||
lastLoginAuthMethod={lastLoginAuthMethod}
|
||||
@@ -543,7 +543,7 @@ export const OrgMembersTable = ({
|
||||
>
|
||||
<FontAwesomeIcon
|
||||
icon={faInfoCircle}
|
||||
className="ml-2 text-mineshaft-400 opacity-0 transition-all group-hover:opacity-100"
|
||||
className="text-mineshaft-400 ml-2 opacity-0 transition-all group-hover:opacity-100"
|
||||
/>
|
||||
</Tooltip>
|
||||
)}
|
||||
@@ -561,7 +561,7 @@ export const OrgMembersTable = ({
|
||||
<Select
|
||||
value={role === "custom" ? findRoleFromId(roleId)?.slug : role}
|
||||
isDisabled={userId === u?.id || !isAllowed}
|
||||
className="h-8 w-48 bg-mineshaft-700"
|
||||
className="bg-mineshaft-700 h-8 w-48"
|
||||
position="popper"
|
||||
dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
|
||||
onValueChange={(selectedRole) =>
|
||||
@@ -594,7 +594,7 @@ export const OrgMembersTable = ({
|
||||
{(isAllowed) => (
|
||||
<Button
|
||||
isDisabled={!isAllowed || isResendInvitePending}
|
||||
className="h-8 border-mineshaft-600 bg-mineshaft-700 font-normal"
|
||||
className="border-mineshaft-600 bg-mineshaft-700 h-8 font-normal"
|
||||
colorSchema="primary"
|
||||
variant="outline_bg"
|
||||
isLoading={
|
||||
|
||||
+4
-4
@@ -198,9 +198,9 @@ export const OrgRoleTable = () => {
|
||||
orderDirection === OrderByDirection.DESC && orderBy === col ? faArrowUp : faArrowDown;
|
||||
|
||||
return (
|
||||
<div className="rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
|
||||
<div className="border-mineshaft-600 bg-mineshaft-900 rounded-lg border p-4">
|
||||
<div className="mb-4 flex items-center justify-between">
|
||||
<p className="text-xl font-medium text-mineshaft-100">Organization Roles</p>
|
||||
<p className="text-mineshaft-100 text-xl font-medium">Organization Roles</p>
|
||||
<OrgPermissionCan I={OrgPermissionActions.Create} a={OrgPermissionSubjects.Role}>
|
||||
{(isAllowed) => (
|
||||
<Button
|
||||
@@ -282,7 +282,7 @@ export const OrgRoleTable = () => {
|
||||
return (
|
||||
<Tr
|
||||
key={`role-list-${id}`}
|
||||
className="h-10 cursor-pointer transition-colors duration-100 hover:bg-mineshaft-700"
|
||||
className="hover:bg-mineshaft-700 h-10 cursor-pointer transition-colors duration-100"
|
||||
onClick={() =>
|
||||
navigate({
|
||||
to: "/organization/roles/$roleId",
|
||||
@@ -312,7 +312,7 @@ export const OrgRoleTable = () => {
|
||||
{slug}
|
||||
</Td>
|
||||
<Td>
|
||||
<Badge className="w-min bg-mineshaft-400/50 whitespace-nowrap text-bunker-200">
|
||||
<Badge className="bg-mineshaft-400/50 text-bunker-200 w-min whitespace-nowrap">
|
||||
{isCustomProjectRole(slug) ? "Custom" : "Default"}
|
||||
</Badge>
|
||||
</Td>
|
||||
|
||||
+16
-16
@@ -73,15 +73,15 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
<ModalContent title="Privilege Management System Upgrade" className="max-w-2xl">
|
||||
{step === "info" ? (
|
||||
<div className="mb-4">
|
||||
<p className="mb-4 text-sm text-mineshaft-300">
|
||||
<p className="text-mineshaft-300 mb-4 text-sm">
|
||||
We've developed an improved privilege management system that enhances how access
|
||||
controls work in your organization.
|
||||
</p>
|
||||
|
||||
<div className="mb-4 rounded-lg border border-mineshaft-600 bg-mineshaft-800 p-4">
|
||||
<div className="border-mineshaft-600 bg-mineshaft-800 mb-4 rounded-lg border p-4">
|
||||
<div className="mb-3">
|
||||
<div className="mb-3">
|
||||
<p className="mb-3 text-sm text-mineshaft-300">
|
||||
<p className="text-mineshaft-300 mb-3 text-sm">
|
||||
<strong>Current system: </strong>
|
||||
Users with higher privilege levels can modify access for anyone below them. This
|
||||
rigid hierarchy makes it difficult to implement precise access control policies,
|
||||
@@ -89,7 +89,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
specialized roles (like team leads) need to manage their team's access
|
||||
without receiving broader administrative powers.
|
||||
</p>
|
||||
<p className="text-sm text-mineshaft-300">
|
||||
<p className="text-mineshaft-300 text-sm">
|
||||
<strong>New system:</strong> Users need explicit permission to modify specific
|
||||
access levels, providing targeted control. After upgrading, you'll need to
|
||||
grant the new 'Grant Privileges' permission. At the organization
|
||||
@@ -98,7 +98,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
href="https://infisical.com/docs/internals/permissions/organization-permissions#subject%3A-groups"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="underline hover:text-bunker-200 hover:decoration-primary-700"
|
||||
className="hover:text-bunker-200 hover:decoration-primary-700 underline"
|
||||
>
|
||||
Group
|
||||
</a>{" "}
|
||||
@@ -107,7 +107,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
href="https://infisical.com/docs/internals/permissions/organization-permissions#subject%3A-identity"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="underline hover:text-bunker-200 hover:decoration-primary-700"
|
||||
className="hover:text-bunker-200 hover:decoration-primary-700 underline"
|
||||
>
|
||||
Identity
|
||||
</a>{" "}
|
||||
@@ -116,7 +116,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
href="https://infisical.com/docs/internals/permissions/project-permissions#subject%3A-member"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="underline hover:text-bunker-200 hover:decoration-primary-700"
|
||||
className="hover:text-bunker-200 hover:decoration-primary-700 underline"
|
||||
>
|
||||
Member,
|
||||
</a>{" "}
|
||||
@@ -124,7 +124,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
href="https://infisical.com/docs/internals/permissions/project-permissions#subject%3A-groups"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="underline hover:text-bunker-200 hover:decoration-primary-700"
|
||||
className="hover:text-bunker-200 hover:decoration-primary-700 underline"
|
||||
>
|
||||
Group,
|
||||
</a>{" "}
|
||||
@@ -133,7 +133,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
href="https://infisical.com/docs/internals/permissions/project-permissions#subject%3A-identity"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="underline hover:text-bunker-200 hover:decoration-primary-700"
|
||||
className="hover:text-bunker-200 hover:decoration-primary-700 underline"
|
||||
>
|
||||
Identity
|
||||
</a>{" "}
|
||||
@@ -149,7 +149,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
variant="solid"
|
||||
colorSchema="primary"
|
||||
size="md"
|
||||
className="w-[120px] bg-primary hover:bg-primary-600"
|
||||
className="bg-primary hover:bg-primary-600 w-[120px]"
|
||||
>
|
||||
Continue
|
||||
</Button>
|
||||
@@ -157,19 +157,19 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
</div>
|
||||
) : (
|
||||
<div className="mb-4">
|
||||
<p className="mb-4 text-sm text-mineshaft-300">
|
||||
<p className="text-mineshaft-300 mb-4 text-sm">
|
||||
Your existing access control workflows will continue to function. However, actions
|
||||
that involve modifying privileges or permissions will now use the new permission-based
|
||||
system, requiring users to have explicit permission to modify given resource.
|
||||
</p>
|
||||
|
||||
<p className="mb-4 text-sm text-mineshaft-300">
|
||||
<p className="text-mineshaft-300 mb-4 text-sm">
|
||||
This upgrade affects operations like updating roles, managing group memberships, and
|
||||
modifying privileges across your organization and projects.
|
||||
</p>
|
||||
|
||||
<div className="mb-4 rounded-lg border border-mineshaft-600 bg-mineshaft-800 p-4">
|
||||
<p className="mb-4 text-sm text-mineshaft-300">
|
||||
<div className="border-mineshaft-600 bg-mineshaft-800 mb-4 rounded-lg border p-4">
|
||||
<p className="text-mineshaft-300 mb-4 text-sm">
|
||||
Once upgraded, your organization <span className="font-bold">cannot</span> revert to
|
||||
the legacy privilege system. Please ensure you've completed all preparations
|
||||
before proceeding.
|
||||
@@ -268,7 +268,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setStep("info")}
|
||||
className="w-[120px] text-sm text-mineshaft-300 hover:text-mineshaft-200"
|
||||
className="text-mineshaft-300 hover:text-mineshaft-200 w-[120px] text-sm"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
@@ -285,7 +285,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
|
||||
variant="solid"
|
||||
colorSchema="primary"
|
||||
size="md"
|
||||
className="w-[120px] bg-primary hover:bg-primary-600"
|
||||
className="bg-primary hover:bg-primary-600 w-[120px]"
|
||||
isDisabled={!isAllChecksCompleted || !isAdmin}
|
||||
isLoading={isSubmitting}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user