awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-10-14 04:29:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added frontend checks for secret names (#35)

Browse Source
This commit is contained in:
Vladyslav Matsiiako
2022-11-27 19:10:49 -05:00
parent 634d5fe5c3
commit 2fe45ec898
2 changed files with 69 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/components/dashboard/DashboardInputField.js
+22 -6
View File
@@ -1,4 +1,4 @@
import React, { Fragment } from "react";
import React from "react";
import { faCircle } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -31,6 +31,7 @@ const findReferences = (text) => {
* @param {string} obj.type - whether the input field is for a Key Name or for a Key Value
* @param {string} obj.value - value of the InputField
* @param {boolean} obj.blurred - whether the input field should be blurred (behind the gray dots) or not; this can be turned on/off in the dashboard
* @param {string[]} obj.duplicates - list of all the suplicated key names on the dashboard
* @returns
*/
const DashboardInputField = ({
@@ -39,21 +40,36 @@ const DashboardInputField = ({
type,
value,
blurred,
duplicates
}) => {
if (type === "varName") {
const startsWithNumber = !isNaN(value.charAt(0)) && value != "";
const hasDuplicates = duplicates?.includes(value);
const error = startsWithNumber || hasDuplicates;
return (
<div className="flex-col w-full">
<div
className={`group relative flex flex-col justify-center w-full max-w-2xl border border-mineshaft-500 rounded-md`}
className={`group relative flex flex-col justify-center w-full max-w-2xl border ${error ? "border-red" : "border-mineshaft-500"} rounded-md`}
>
<input
onChange={(e) => onChangeHandler(e.target.value, index)}
onChange={(e) => onChangeHandler(e.target.value.toUpperCase(), index)}
type={type}
value={value}
className="asolute z-10 peer font-mono ph-no-capture bg-bunker-800 rounded-md caret-white text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-4 focus:ring-primary/50 duration-200"
className={`asolute z-10 peer font-mono ph-no-capture bg-bunker-800 rounded-md caret-white text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-2 ${error ? "focus:ring-red/50" : "focus:ring-primary/50"} duration-200`}
spellCheck="false"
/>
</div>
{startsWithNumber &&
<p className="text-red text-xs mt-0.5 mx-1 mb-2 max-w-xs">
Can't start with a number
</p>
}
{hasDuplicates && !startsWithNumber &&
<p className="text-red text-xs mt-0.5 mx-1 mb-2 max-w-xs">
Secret names should be unique
</p>
}
</div>
);
} else if (type === "value") {
@@ -70,7 +86,7 @@ const DashboardInputField = ({
blurred
? "text-transparent group-hover:text-transparent focus:text-transparent active:text-transparent"
: ""
} asolute z-10 peer font-mono ph-no-capture bg-transparent rounded-md caret-white text-transparent text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-4 focus:ring-primary/50 duration-200`}
} asolute z-10 peer font-mono ph-no-capture bg-transparent rounded-md caret-white text-transparent text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-2 focus:ring-primary/50 duration-200`}
spellCheck="false"
/>
<div
@@ -78,7 +94,7 @@ const DashboardInputField = ({
blurred
? "text-bunker-800 group-hover:text-gray-400 peer-focus:text-gray-400 peer-active:text-gray-400"
: ""
} flex flex-row font-mono absolute z-0 ph-no-capture bg-bunker-800 h-9 rounded-md text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-4 focus:ring-primary/50 duration-100`}
} flex flex-row font-mono absolute z-0 ph-no-capture bg-bunker-800 h-9 rounded-md text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-2 focus:ring-primary/50 duration-100`}
>
{findReferences(value).map((texts, id) => {
if (id % 2 == 0 || texts.length <= 2) {