Compare commits

...

2 Commits

9 changed files with 40 additions and 142 deletions

View File

@ -1,10 +1,5 @@
import { Controller, useForm } from "react-hook-form"; import { Controller, useForm } from "react-hook-form";
import { import { faCheckCircle, faWarning } from "@fortawesome/free-solid-svg-icons";
faArrowUpRightFromSquare,
faBookOpen,
faCheckCircle,
faWarning
} from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import ms from "ms"; import ms from "ms";
@ -206,20 +201,6 @@ export const AzureEntraIdInputForm = ({
<div> <div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200"> <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration Configuration
<a
target="_blank"
rel="noopener noreferrer"
href="https://infisical.com/docs/documentation/platform/dynamic-secrets/azure-entra-id"
>
<div className="mb-1 ml-2 inline-block cursor-default rounded-md bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
Docs
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1.5 text-xxs"
/>
</div>
</a>
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<div className="flex-grow"> <div className="flex-grow">

View File

@ -12,7 +12,12 @@ import {
} from "react-icons/si"; } from "react-icons/si";
import { VscAzure } from "react-icons/vsc"; import { VscAzure } from "react-icons/vsc";
import { faAws, faGithub, faGoogle } from "@fortawesome/free-brands-svg-icons"; import { faAws, faGithub, faGoogle } from "@fortawesome/free-brands-svg-icons";
import { faClock, faDatabase } from "@fortawesome/free-solid-svg-icons"; import {
faArrowUpRightFromSquare,
faBookOpen,
faClock,
faDatabase
} from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { AnimatePresence, motion } from "framer-motion"; import { AnimatePresence, motion } from "framer-motion";
@ -152,6 +157,15 @@ const DYNAMIC_SECRET_LIST = [
} }
]; ];
const DynamicSecretDetails = Object.fromEntries(
DYNAMIC_SECRET_LIST.map((ds) => [ds.provider, ds.title])
);
const UniqueLinks: Record<string, string> = {
[DynamicSecretProviders.SqlDatabase]: "postgresql", // gotta pick one...
[DynamicSecretProviders.MongoAtlas]: "mongo-atlas"
};
export const CreateDynamicSecretForm = ({ export const CreateDynamicSecretForm = ({
isOpen, isOpen,
onToggle, onToggle,
@ -169,10 +183,31 @@ export const CreateDynamicSecretForm = ({
setSelectedProvider(null); setSelectedProvider(null);
}; };
const modalTitle = selectedProvider ? DynamicSecretDetails[selectedProvider] : null;
return ( return (
<Modal isOpen={isOpen} onOpenChange={(state) => handleFormReset(state)}> <Modal isOpen={isOpen} onOpenChange={(state) => handleFormReset(state)}>
<ModalContent <ModalContent
title="Dynamic secret setup" title={
<div className="flex items-center">
<span>{modalTitle ? `${modalTitle} Dynamic Secret` : "Dynamic Secrets"} </span>
<a
href={`https://infisical.com/docs/documentation/platform/dynamic-secrets/${selectedProvider ? (UniqueLinks[selectedProvider] ?? selectedProvider) : "overview"}`}
target="_blank"
className="mb-0.5 ml-1.5"
rel="noopener noreferrer"
>
<div className="inline-block rounded-md bg-yellow/20 px-1.5 text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mb-[0.03rem] mr-1 text-[12px]" />
<span>Docs</span>
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1 text-[10px]"
/>
</div>
</a>
</div>
}
subTitle="Configure dynamic secret parameters" subTitle="Configure dynamic secret parameters"
className="my-4 max-w-3xl" className="my-4 max-w-3xl"
> >

View File

@ -1,10 +1,5 @@
import { Controller, FieldValues, useFieldArray, useForm } from "react-hook-form"; import { Controller, FieldValues, useFieldArray, useForm } from "react-hook-form";
import { import { faQuestionCircle, faTrash } from "@fortawesome/free-solid-svg-icons";
faArrowUpRightFromSquare,
faBookOpen,
faQuestionCircle,
faTrash
} from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import { useQuery } from "@tanstack/react-query"; import { useQuery } from "@tanstack/react-query";
@ -293,20 +288,6 @@ export const KubernetesInputForm = ({
<div> <div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200"> <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration Configuration
<a
href="https://infisical.com/docs/documentation/platform/dynamic-secrets/kubernetes"
target="_blank"
rel="noopener noreferrer"
>
<div className="mb-1 ml-2 inline-block cursor-default rounded-md bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
Docs
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1.5 text-xxs"
/>
</div>
</a>
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">

View File

@ -1,6 +1,4 @@
import { Controller, useForm } from "react-hook-form"; import { Controller, useForm } from "react-hook-form";
import { faArrowUpRightFromSquare, faBookOpen } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import ms from "ms"; import ms from "ms";
import { z } from "zod"; import { z } from "zod";
@ -220,20 +218,6 @@ export const LdapInputForm = ({
<div> <div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200"> <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration Configuration
<a
href="https://infisical.com/docs/documentation/platform/dynamic-secrets/ldap"
target="_blank"
rel="noopener noreferrer"
>
<div className="mb-1 ml-2 inline-block cursor-default rounded-md bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
Docs
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1.5 text-xxs"
/>
</div>
</a>
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">

View File

@ -1,6 +1,4 @@
import { Controller, useForm } from "react-hook-form"; import { Controller, useForm } from "react-hook-form";
import { faArrowUpRightFromSquare, faBookOpen } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import ms from "ms"; import ms from "ms";
import { z } from "zod"; import { z } from "zod";
@ -185,20 +183,6 @@ export const SnowflakeInputForm = ({
<div> <div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200"> <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration Configuration
<a
href="https://infisical.com/docs/documentation/platform/dynamic-secrets/snowflake"
target="_blank"
rel="noopener noreferrer"
>
<div className="mb-1 ml-2 inline-block rounded-md bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
Docs
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1.5 text-xxs"
/>
</div>
</a>
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">

View File

@ -1,6 +1,4 @@
import { Controller, useForm } from "react-hook-form"; import { Controller, useForm } from "react-hook-form";
import { faArrowUpRightFromSquare, faBookOpen } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import { z } from "zod"; import { z } from "zod";
@ -146,20 +144,6 @@ export const TotpInputForm = ({
<div> <div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200"> <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration Configuration
<a
href="https://infisical.com/docs/documentation/platform/dynamic-secrets/totp"
target="_blank"
rel="noopener noreferrer"
>
<div className="mb-1 ml-2 inline-block rounded-md bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
Docs
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1.5 text-xxs"
/>
</div>
</a>
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<Controller <Controller

View File

@ -1,10 +1,5 @@
import { Controller, FieldValues, useFieldArray, useForm } from "react-hook-form"; import { Controller, FieldValues, useFieldArray, useForm } from "react-hook-form";
import { import { faQuestionCircle, faTrash } from "@fortawesome/free-solid-svg-icons";
faArrowUpRightFromSquare,
faBookOpen,
faQuestionCircle,
faTrash
} from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import { useQuery } from "@tanstack/react-query"; import { useQuery } from "@tanstack/react-query";
@ -285,20 +280,6 @@ export const EditDynamicSecretKubernetesForm = ({
<div> <div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200"> <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration Configuration
<a
href="https://infisical.com/docs/documentation/platform/dynamic-secrets/kubernetes"
target="_blank"
rel="noopener noreferrer"
>
<div className="mb-1 ml-2 inline-block cursor-default rounded-md bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
Docs
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1.5 text-xxs"
/>
</div>
</a>
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">

View File

@ -1,6 +1,4 @@
import { Controller, useForm } from "react-hook-form"; import { Controller, useForm } from "react-hook-form";
import { faArrowUpRightFromSquare, faBookOpen } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import ms from "ms"; import ms from "ms";
import { z } from "zod"; import { z } from "zod";
@ -186,20 +184,6 @@ export const EditDynamicSecretSnowflakeForm = ({
<div> <div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200"> <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration Configuration
<a
href="https://infisical.com/docs/documentation/platform/dynamic-secrets/snowflake"
target="_blank"
rel="noopener noreferrer"
>
<div className="mb-1 ml-2 inline-block rounded-md bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
Docs
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1.5 text-xxs"
/>
</div>
</a>
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">

View File

@ -1,6 +1,4 @@
import { Controller, useForm } from "react-hook-form"; import { Controller, useForm } from "react-hook-form";
import { faArrowUpRightFromSquare, faBookOpen } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { zodResolver } from "@hookform/resolvers/zod"; import { zodResolver } from "@hookform/resolvers/zod";
import { z } from "zod"; import { z } from "zod";
@ -138,20 +136,6 @@ export const EditDynamicSecretTotpForm = ({
<div> <div>
<div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200"> <div className="mb-4 mt-4 border-b border-mineshaft-500 pb-2 pl-1 font-medium text-mineshaft-200">
Configuration Configuration
<a
href="https://infisical.com/docs/documentation/platform/dynamic-secrets/totp"
target="_blank"
rel="noopener noreferrer"
>
<div className="mb-1 ml-2 inline-block rounded-md bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] text-sm text-yellow opacity-80 hover:opacity-100">
<FontAwesomeIcon icon={faBookOpen} className="mr-1.5" />
Docs
<FontAwesomeIcon
icon={faArrowUpRightFromSquare}
className="mb-[0.07rem] ml-1.5 text-xxs"
/>
</div>
</a>
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<Controller <Controller