fix: improvements

This commit is contained in:
Daniel Hougaard
2024-10-01 03:51:55 +04:00
parent 22b6e0afcd
commit 0485b56e8d
5 changed files with 180 additions and 180 deletions
@@ -24,8 +24,7 @@ type TForm = z.infer<typeof formSchema>;
export const ImportTab = () => {
const fileUploadRef = useRef<HTMLInputElement>(null);
const { mutateAsync: importEnvKey
} = useImportEnvKey();
const { mutateAsync: importEnvKey } = useImportEnvKey();
const {
handleSubmit,
@@ -50,11 +49,14 @@ export const ImportTab = () => {
const parseJson = (src: ArrayBuffer) => {
const file = src.toString();
const formatedData: Record<string, string> = JSON.parse(file);
if (Object.keys(formatedData).includes("nonce") && Object.keys(formatedData).includes("data")) {
const formattedData: Record<string, string> = JSON.parse(file);
if (
Object.keys(formattedData).includes("nonce") &&
Object.keys(formattedData).includes("data")
) {
const data = {
nonce: formatedData.nonce,
data: formatedData.data
nonce: formattedData.nonce,
data: formattedData.data
};
setValue("encryptedJson", data);
trigger("encryptedJson");
@@ -86,9 +88,9 @@ export const ImportTab = () => {
if (!event?.target?.result) return;
// parse function's argument looks like to be ArrayBuffer
parseJson(event.target.result as ArrayBuffer);
}
};
reader.readAsText(file);
}
};
const submitExport = async (data: TForm) => {
if (!data.encryptedJson) {
@@ -99,7 +101,7 @@ export const ImportTab = () => {
return;
}
try{
try {
await importEnvKey({ encryptedJson: data.encryptedJson, decryptionKey: data.encryptionKey });
createNotification({
text: "Data imported successfully.",
@@ -109,11 +111,10 @@ export const ImportTab = () => {
if (fileUploadRef.current) {
fileUploadRef.current.value = "";
}
} catch (error) {
} catch {
reset();
}
}
};
const watchEncryptedJsonFile: any = watch("file");
useEffect(() => {
@@ -124,13 +125,13 @@ export const ImportTab = () => {
return (
<div className="rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-6">
<h2 className="text-lg font-medium text-white mb-4">Import from external source</h2>
<h2 className="mb-4 text-lg font-medium text-white">Import from external source</h2>
<p className="text-sm text-mineshaft-400">
Import data from another secret manager to Infisical.
</p>
<div className="border-b border-mineshaft-800 my-6" />
<div className="flex justify-left">
<h3 className="text-lg font-medium text-white mb-4">Import from EnvKey</h3>
<div className="my-6 border-b border-mineshaft-800" />
<div className="justify-left flex">
<h3 className="mb-4 text-lg font-medium text-white">Import from EnvKey</h3>
<Link href="https://infisical.com/docs/documentation/guides/migrating-from-envkey" passHref>
<a target="_blank" rel="noopener noreferrer">
<div className="ml-2 mb-1 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">
@@ -148,12 +149,16 @@ export const ImportTab = () => {
<form onSubmit={handleSubmit(submitExport)}>
<Controller
render={({ field: { onChange, ...field }, fieldState: { error } }) => (
<FormControl errorText={error?.message} isError={Boolean(error)} label="Encryption Key">
<FormControl
errorText={error?.message}
isError={Boolean(error)}
label="Encryption Key"
>
<input
{...field}
onChange={onChange}
type="password"
className="w-full bg-mineshaft-800 text-white rounded-lg py-2 px-4"
className="w-full rounded-lg bg-mineshaft-800 py-2 px-4 text-white"
placeholder="Enter encryption key"
/>
</FormControl>
@@ -161,14 +166,18 @@ export const ImportTab = () => {
name="encryptionKey"
control={control}
/>
<div className="flex justify-left">
<div className="justify-left flex">
<Controller
name="file"
control={control}
defaultValue={null}
rules={{ required: "File is required" }}
render={({ field, fieldState: { error } }) => (
<FormControl errorText={error?.message} isError={Boolean(error)} label="Export file from EnvKey">
<FormControl
errorText={error?.message}
isError={Boolean(error)}
label="Export file from EnvKey"
>
<>
<input
id="fileSelect"
@@ -185,22 +194,22 @@ export const ImportTab = () => {
onClick={() => {
fileUploadRef?.current?.click();
}}
>
>
{fileUploadRef?.current?.value ? (
<span className="text-green text-sm">
<span className="text-sm text-green">
{fileUploadRef?.current?.value.split("\\").pop()}
</span>
) : (
<>
Upload export file&nbsp;
<FontAwesomeIcon icon={faUpload} size="xs" />
</>
Upload export file&nbsp;
<FontAwesomeIcon icon={faUpload} size="xs" />
</>
)}
</IconButton>
</>
</FormControl>
)} />
)}
/>
</div>
<div className="mt-6">
<Button