Skip to content

Commit

Permalink
refactor(platform): Updated the secret table and changed edit variabl…
Browse files Browse the repository at this point in the history 
…e dialog to a sheet (#690)

Co-authored-by: Rajdip Bhattacharya <agentR47@gmail.com>
  • Loading branch information
@poswalsameer @rajdip-b
poswalsameer and rajdip-b authored Feb 7, 2025
1 parent 2a7cba6 commit f51ad34
Show file tree
Hide file tree
Showing 5 changed files with 89 additions and 76 deletions.
6 changes: 3 additions & 3 deletions apps/platform/src/app/(main)/project/[project]/@variable/page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ import {
} from '@/store'
import VariableCard from '@/components/dashboard/variable/variableCard'
import ConfirmDeleteVariable from '@/components/dashboard/variable/confirmDeleteVariable'
import EditVariableDialog from '@/components/dashboard/variable/editVariableDialogue'
import EditVariablSheet from '@/components/dashboard/variable/editVariableSheet'
import ControllerInstance from '@/lib/controller-instance'
import { Button } from '@/components/ui/button'
import { Accordion } from '@/components/ui/accordion'
Expand Down Expand Up @@ -121,9 +121,9 @@ function VariablePage(): React.JSX.Element {
<ConfirmDeleteVariable />
) : null}

{/* Edit variable dialog */}
{/* Edit variable sheet */}
{isEditVariableOpen && selectedVariable ? (
<EditVariableDialog />
<EditVariablSheet />
) : null}
</div>
)}
Expand Down
3 changes: 2 additions & 1 deletion apps/platform/src/components/dashboard/secret/editSecretSheet/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@ import {
selectedSecretAtom
} from '@/store'
import ControllerInstance from '@/lib/controller-instance'
import { Textarea } from '@/components/ui/textarea'

export default function EditSecretSheet(): JSX.Element {
const [isEditSecretSheetOpen, setIsEditSecretSheetOpen] =
Expand Down Expand Up @@ -150,7 +151,7 @@ export default function EditSecretSheet(): JSX.Element {
<Label className="text-right" htmlFor="name">
Extra Note
</Label>
<Input
<Textarea
className="col-span-3 h-[2.75rem]"
id="name"
onChange={(e) => {
Expand Down
18 changes: 12 additions & 6 deletions apps/platform/src/components/dashboard/secret/secretCard/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,30 +98,36 @@ export default function SecretCard({
<AccordionContent>
<Table className="h-full w-full">
<TableHeader className="h-[3.125rem] w-full">
<TableRow className="h-[3.125rem] w-full hover:bg-[#232424]">
<TableHead className="h-full w-[10.25rem] border-2 border-white/30 text-base font-bold text-white">
<TableRow className="h-[3.125rem] w-full bg-white/10">
<TableHead className="h-full w-[10.25rem] rounded-tl-xl text-base font-normal text-white/50">
Environment
</TableHead>
<TableHead className="h-full border-2 border-white/30 text-base font-normal text-white">
<TableHead className="h-full text-base font-normal text-white/50">
Value
</TableHead>
<TableHead className="h-full rounded-tr-xl text-base font-normal text-white/50">
Version
</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{values.map((value) => {
return (
<TableRow
className="h-[3.125rem] w-full hover:cursor-pointer hover:bg-[#232424]"
className="h-[3.125rem] w-full hover:bg-white/5"
key={value.environment.id}
>
<TableCell className="h-full w-[10.25rem] border-2 border-white/30 text-base font-bold text-white">
<TableCell className="h-full w-[10.25rem] text-base">
{value.environment.name}
</TableCell>
<TableCell className="h-full border-2 border-white/30 text-base font-normal text-white">
<TableCell className="h-full text-base">
{isDecrypted
? value.value
: value.value.replace(/./g, '*').substring(0, 20)}
</TableCell>
<TableCell className="h-full px-8 py-4 text-base">
{value.version}
</TableCell>
</TableRow>
)
})}
Expand Down
136 changes: 71 additions & 65 deletions ...d/variable/editVariableDialogue/index.tsx → ...oard/variable/editVariableSheet/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,20 +9,22 @@ import { Input } from '@/components/ui/input'
import { Textarea } from '@/components/ui/textarea'
import { Label } from '@/components/ui/label'
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogDescription
} from '@/components/ui/dialog'
Sheet,
SheetClose,
SheetContent,
SheetDescription,
SheetFooter,
SheetHeader,
SheetTitle
} from '@/components/ui/sheet'
import ControllerInstance from '@/lib/controller-instance'
import {
editVariableOpenAtom,
selectedVariableAtom,
variablesOfProjectAtom
} from '@/store'

export default function EditVariableDialog() {
export default function EditVariablSheet() {
const [isEditVariableOpen, setIsEditVariableOpen] =
useAtom(editVariableOpenAtom)
const selectedVariableData = useAtomValue(selectedVariableAtom)
Expand Down Expand Up @@ -122,64 +124,68 @@ export default function EditVariableDialog() {
}, [selectedVariableData, requestData, handleClose, setVariables])

return (
<div className="p-4">
<Dialog onOpenChange={handleClose} open={isEditVariableOpen}>
<DialogContent className="bg-[#18181B] p-6 text-white sm:max-w-[506px]">
<DialogHeader>
<DialogTitle className="text-base font-bold text-white">
Edit this variable
</DialogTitle>
<DialogDescription className="text-sm font-normal text-white/60">
Edit the variable name or the note
</DialogDescription>
</DialogHeader>
<div className="space-y-6 pt-4">
<div className="flex w-full items-center justify-between gap-6">
<Label
className="w-[7.125rem] text-base font-semibold text-white"
htmlFor="variable-name"
>
Variable Name
</Label>
<Input
className="w-[20rem] bg-[#262626] text-base font-normal text-white"
id="variable-name"
name="name"
onChange={(e) =>
updateRequestData(e.target.name, e.target.value)
}
value={requestData.name}
/>
</div>
<div className="flex w-full items-center justify-between gap-6">
<Label
className="w-[7.125rem] text-base font-semibold text-white"
htmlFor="extra-note"
>
Extra Note
</Label>
<Textarea
className="w-[20rem] bg-[#262626] text-base font-normal text-white"
id="extra-note"
name="note"
onChange={(e) =>
updateRequestData(e.target.name, e.target.value)
}
value={requestData.note}
/>
</div>
<div className="flex justify-end">
<Button
className="rounded-lg border-white/10 bg-[#E0E0E0] text-xs font-semibold text-black hover:bg-gray-200"
onClick={updateVariable}
variant="secondary"
>
Save Variable
</Button>
</div>
<Sheet
onOpenChange={(open) => {
setIsEditVariableOpen(open)
}}
open={isEditVariableOpen}
>
<SheetContent className="border-white/15 bg-[#222425]">
<SheetHeader>
<SheetTitle className="text-white">Edit this variable</SheetTitle>
<SheetDescription className="text-white/60">
Edit the variable name or the note
</SheetDescription>
</SheetHeader>
<div className="grid gap-x-4 gap-y-6 py-8">
<div className="flex flex-col items-start gap-x-4 gap-y-3">
<Label className="text-right" htmlFor="name">
Variable Name
</Label>
<Input
className="col-span-3 h-[2.75rem]"
id="name"
onChange={(e) => {
setRequestData((prev) => ({
...prev,
name: e.target.value
}))
}}
placeholder="Enter the name of the variable"
value={requestData.name}
/>
</div>
</DialogContent>
</Dialog>
</div>

<div className="flex flex-col items-start gap-x-4 gap-y-3">
<Label className="text-right" htmlFor="name">
Extra Note
</Label>
<Textarea
className="col-span-3 h-[2.75rem]"
id="name"
onChange={(e) => {
setRequestData((prev) => ({
...prev,
note: e.target.value
}))
}}
placeholder="Enter the note of the variable"
value={requestData.note}
/>
</div>
</div>
<SheetFooter className="py-3">
<SheetClose asChild>
<Button
className="font-semibold"
onClick={updateVariable}
variant="secondary"
>
Edit Variable
</Button>
</SheetClose>
</SheetFooter>
</SheetContent>
</Sheet>
)
}
2 changes: 1 addition & 1 deletion apps/platform/src/components/dashboard/variable/variableCard/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ export default function VariableCard(
<Table className="h-full w-full">
<TableHeader className="h-[3.125rem] w-full ">
<TableRow className="h-full w-full bg-white/10 ">
<TableHead className="h-full w-[10.25rem] rounded-tl-xl text-base font-bold text-white/50">
<TableHead className="h-full w-[10.25rem] rounded-tl-xl text-base font-normal text-white/50">
Environment
</TableHead>
<TableHead className="h-full text-base font-normal text-white/50">
Expand Down

0 comments on commit f51ad34

Please sign in to comment.