awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-16 13:56:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: updated layout and fixed item not getting removed

Browse Source
This commit is contained in:
=
2024-10-02 00:39:44 +05:30
parent 62d6e3763b
commit 0f74a1a011
3 changed files with 141 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/Project/RolePage/components/RolePermissionsSection/RolePermissionsSection.tsx
+64 -57
View File
@@ -2,9 +2,10 @@ import { FormProvider, useForm } from "react-hook-form";
import { faCancel, faPlus, faSave } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod";
import { twMerge } from "tailwind-merge";
import { createNotification } from "@app/components/notifications";
import { Button, Modal, ModalContent, ModalTrigger, Spinner } from "@app/components/v2";
import { Button, IconButton, Modal, ModalContent, ModalTrigger, Tooltip } from "@app/components/v2";
import { ProjectPermissionSub, useWorkspace } from "@app/context";
import { usePopUp } from "@app/hooks";
import { useGetProjectRoleBySlug, useUpdateProjectRole } from "@app/hooks/api";
@@ -78,67 +79,73 @@ export const RolePermissionsSection = ({ roleSlug, isDisabled }: Props) => {
<div className="flex items-center space-x-4">
{isCustomRole && (
<>
<Button
colorSchema="primary"
type="submit"
isDisabled={isSubmitting || !isDirty}
isLoading={isSubmitting}
leftIcon={<FontAwesomeIcon icon={faSave} />}
>
Save
</Button>
<Button
className="ml-4 text-mineshaft-300"
variant="link"
isDisabled={isSubmitting || !isDirty}
isLoading={isSubmitting}
onClick={() => reset()}
leftIcon={<FontAwesomeIcon icon={faCancel} />}
>
Cancel
</Button>
{isDirty && (
<Button
className="ml-4 text-mineshaft-300"
variant="link"
isDisabled={isSubmitting}
isLoading={isSubmitting}
onClick={() => reset()}
leftIcon={<FontAwesomeIcon icon={faCancel} />}
>
Discard
</Button>
)}
<div className="flex items-center">
<Button
variant="outline_bg"
type="submit"
className={twMerge("h-10 rounded-r-none", isDirty && "bg-primary text-black")}
isDisabled={isSubmitting || !isDirty}
isLoading={isSubmitting}
leftIcon={<FontAwesomeIcon icon={faSave} />}
>
Save
</Button>
<Modal
isOpen={popUp.createPolicy.isOpen}
onOpenChange={(isOpen) => handlePopUpToggle("createPolicy", isOpen)}
>
<ModalTrigger asChild disabled={isDisabled}>
<IconButton
isDisabled={isDisabled}
ariaLabel="new-policy"
className="rounded-l-none bg-mineshaft-600 p-3"
variant="outline_bg"
>
<Tooltip content="New policy">
<FontAwesomeIcon icon={faPlus} />
</Tooltip>
</IconButton>
</ModalTrigger>
<ModalContent
title="New Policy"
subTitle="Policies grant additional permissions."
>
<NewPermissionRule onClose={() => handlePopUpToggle("createPolicy")} />
</ModalContent>
</Modal>
</div>
</>
)}
</div>
</div>
{isSubmitting ? (
<div className="flex items-center justify-center space-x-4 pt-16">
<Spinner size="lg" />
<p className="text-sm text-gray-400">Saving your policy.</p>
</div>
) : (
<>
<div className="py-4">
{!isLoading && <PermissionEmptyState />}
{(Object.keys(PROJECT_PERMISSION_OBJECT) as ProjectPermissionSub[]).map((subject) => (
<GeneralPermissionOptions
subject={subject}
actions={PROJECT_PERMISSION_OBJECT[subject].actions}
title={PROJECT_PERMISSION_OBJECT[subject].title}
key={`project-permission-${subject}`}
isDisabled={isDisabled}
>
{subject === ProjectPermissionSub.Secrets ? (
<SecretPermissionConditions isDisabled={isDisabled} />
) : undefined}
</GeneralPermissionOptions>
))}
</div>
<Modal
isOpen={popUp.createPolicy.isOpen}
onOpenChange={(isOpen) => handlePopUpToggle("createPolicy", isOpen)}
<div className="py-4">
{!isLoading && <PermissionEmptyState />}
{(Object.keys(PROJECT_PERMISSION_OBJECT) as ProjectPermissionSub[]).map((subject) => (
<GeneralPermissionOptions
subject={subject}
actions={PROJECT_PERMISSION_OBJECT[subject].actions}
title={PROJECT_PERMISSION_OBJECT[subject].title}
key={`project-permission-${subject}`}
isDisabled={isDisabled}
>
<ModalTrigger asChild disabled={isDisabled}>
<Button isDisabled={isDisabled} leftIcon={<FontAwesomeIcon icon={faPlus} />}>
Add Policy
</Button>
</ModalTrigger>
<ModalContent title="New Policy" subTitle="Policies grant additional permissions.">
<NewPermissionRule onClose={() => handlePopUpToggle("createPolicy")} />
</ModalContent>
</Modal>
</>
)}
{subject === ProjectPermissionSub.Secrets ? (
<SecretPermissionConditions isDisabled={isDisabled} />
) : undefined}
</GeneralPermissionOptions>
))}
</div>
</FormProvider>
</form>
);