update ui

This commit is contained in:
Vladyslav Matsiiako
2024-03-24 22:00:30 -07:00
parent cd0e1a87cf
commit b592f4cb6d
4 changed files with 13 additions and 12 deletions
@@ -338,14 +338,14 @@ export const ActionBar = ({
> >
{(isAllowed) => ( {(isAllowed) => (
<Button <Button
leftIcon={<FontAwesomeIcon icon={faFolderPlus} />} leftIcon={<FontAwesomeIcon icon={faFolderPlus} className="pr-2" />}
onClick={() => { onClick={() => {
handlePopUpOpen("addFolder"); handlePopUpOpen("addFolder");
handlePopUpClose("misc"); handlePopUpClose("misc");
}} }}
isDisabled={!isAllowed} isDisabled={!isAllowed}
variant="outline_bg" variant="outline_bg"
className="h-10" className="h-10 text-left"
isFullWidth isFullWidth
> >
Add Folder Add Folder
@@ -358,14 +358,14 @@ export const ActionBar = ({
> >
{(isAllowed) => ( {(isAllowed) => (
<Button <Button
leftIcon={<FontAwesomeIcon icon={faFingerprint} />} leftIcon={<FontAwesomeIcon icon={faFingerprint} className="pr-2" />}
onClick={() => { onClick={() => {
handlePopUpOpen("addDynamicSecret"); handlePopUpOpen("addDynamicSecret");
handlePopUpClose("misc"); handlePopUpClose("misc");
}} }}
isDisabled={!isAllowed} isDisabled={!isAllowed}
variant="outline_bg" variant="outline_bg"
className="h-10" className="h-10 text-left"
isFullWidth isFullWidth
> >
Add Dynamic Secret Add Dynamic Secret
@@ -378,13 +378,13 @@ export const ActionBar = ({
> >
{(isAllowed) => ( {(isAllowed) => (
<Button <Button
leftIcon={<FontAwesomeIcon icon={faFileImport} />} leftIcon={<FontAwesomeIcon icon={faFileImport} className="pr-2" />}
onClick={() => { onClick={() => {
handlePopUpOpen("addSecretImport"); handlePopUpOpen("addSecretImport");
handlePopUpClose("misc"); handlePopUpClose("misc");
}} }}
variant="outline_bg" variant="outline_bg"
className="h-10" className="h-10 text-left"
isFullWidth isFullWidth
isDisabled={!isAllowed} isDisabled={!isAllowed}
> >
@@ -41,7 +41,7 @@ export const CreateDynamicSecretForm = ({
<Modal isOpen={isOpen} onOpenChange={(state) => handleFormReset(state)}> <Modal isOpen={isOpen} onOpenChange={(state) => handleFormReset(state)}>
<ModalContent <ModalContent
title="Dynamic secret setup" title="Dynamic secret setup"
subTitle="Secrets provisioned dynamically with a TTL" subTitle="Set up secrets provisioned dynamically with a TTL."
className="my-4 max-h-screen max-w-3xl overflow-scroll" className="my-4 max-h-screen max-w-3xl overflow-scroll"
> >
<AnimatePresence exitBeforeEnter> <AnimatePresence exitBeforeEnter>
@@ -53,10 +53,10 @@ export const CreateDynamicSecretForm = ({
animate={{ opacity: 1, translateX: 0 }} animate={{ opacity: 1, translateX: 0 }}
exit={{ opacity: 0, translateX: -30 }} exit={{ opacity: 0, translateX: -30 }}
> >
<div className="mb-4 ">Pick a service to connect</div> <div className="mb-4 text-mineshaft-300">Select a service to connect to:</div>
<div className="flex items-center space-x-4"> <div className="flex items-center space-x-4">
<div <div
className="flex h-32 w-32 cursor-pointer flex-col items-center space-y-4 rounded border border-mineshaft-500 bg-bunker-700 p-6 transition-all hover:bg-bunker-600" className="flex h-32 w-32 cursor-pointer flex-col items-center space-y-4 rounded border border-mineshaft-500 bg-bunker-600 p-6 transition-all hover:bg-primary/10 hover:border-primary/70 hover:text-white"
role="button" role="button"
tabIndex={0} tabIndex={0}
onClick={() => { onClick={() => {
@@ -168,8 +168,9 @@ export const SqlDatabaseInputForm = ({
</div> </div>
</div> </div>
<div> <div>
<div className="mb-4 border-b border-b-mineshaft-600 pb-2">Configuration</div> <div className="mb-4 border-b border-mineshaft-500 pb-2 text-mineshaft-200 pl-1 mt-4 font-medium">Configuration</div>
<div className="flex flex-col"> <div className="flex flex-col">
<div className="text-sm text-mineshaft-400 pl-1 pb-0.5">Service</div>
<Controller <Controller
control={control} control={control}
name="provider.client" name="provider.client"
@@ -281,7 +282,7 @@ export const SqlDatabaseInputForm = ({
<Accordion <Accordion
type="single" type="single"
collapsible collapsible
className="w-full bg-mineshaft-700" className="w-full bg-mineshaft-700 mb-2"
> >
<AccordionItem value="advance-statements"> <AccordionItem value="advance-statements">
<AccordionTrigger>Modify SQL Statements</AccordionTrigger> <AccordionTrigger>Modify SQL Statements</AccordionTrigger>
@@ -62,7 +62,7 @@ const renderOutputForm = (provider: DynamicSecretProviders, data: unknown) => {
<OutputDisplay <OutputDisplay
label="Database Password" label="Database Password"
value={DB_PASSWORD} value={DB_PASSWORD}
helperText="Important: Copy this information now. It will disappear after this.opy this values as you won't be able to see it again." helperText="Important: Copy these credentials now. You will not be able to see them again after you close the modal."
/> />
</div> </div>
); );