diff --git a/frontend/public/locales/en/settings-project.json b/frontend/public/locales/en/settings-project.json index 03e4b1459..3f3401f2e 100644 --- a/frontend/public/locales/en/settings-project.json +++ b/frontend/public/locales/en/settings-project.json @@ -9,5 +9,7 @@ "project-id-description": "To integrate Infisical into your code base and get automatic injection of environmental variables, you should use the following Project ID.", "project-id-description2": "For more guidance, including code snipets for various languages and frameworks, see ", "auto-generated": "This is your project's auto-generated unique identifier. It can't be changed.", - "docs": "Infisical Docs" + "docs": "Infisical Docs", + "auto-capitalization": "Auto Capitalization", + "auto-capitalization-description": "According to standards, Infisical will automatically capitalize your keys. If you want to disable this feature, you can do so here." } diff --git a/frontend/src/components/dashboard/DashboardInputField.tsx b/frontend/src/components/dashboard/DashboardInputField.tsx index 0e292d65d..6969b04d8 100644 --- a/frontend/src/components/dashboard/DashboardInputField.tsx +++ b/frontend/src/components/dashboard/DashboardInputField.tsx @@ -14,6 +14,7 @@ interface DashboardInputFieldProps { blurred?: boolean; isDuplicate?: boolean; override?: boolean; + isCapitalized?: boolean; } /** @@ -36,7 +37,8 @@ const DashboardInputField = ({ value, blurred, isDuplicate, - override + override, + isCapitalized }: DashboardInputFieldProps) => { const ref = useRef(null); const syncScroll = (e: SyntheticEvent) => { @@ -58,7 +60,7 @@ const DashboardInputField = ({ } rounded-md`} > onChangeHandler(e.target.value.toUpperCase(), position)} + onChange={(e) => onChangeHandler(isCapitalized ? e.target.value.toUpperCase() : e.target.value, position)} type={type} value={value} className={`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 ${ @@ -164,7 +166,8 @@ function inputPropsAreEqual(prev: DashboardInputFieldProps, next: DashboardInput prev.position === next.position && prev.blurred === next.blurred && prev.override === next.override && - prev.isDuplicate === next.isDuplicate + prev.isDuplicate === next.isDuplicate && + prev.isCapitalized === next.isCapitalized ); } diff --git a/frontend/src/components/dashboard/KeyPair.tsx b/frontend/src/components/dashboard/KeyPair.tsx index 7de4edf82..c7aece86f 100644 --- a/frontend/src/components/dashboard/KeyPair.tsx +++ b/frontend/src/components/dashboard/KeyPair.tsx @@ -14,6 +14,7 @@ interface KeyPairProps { toggleSidebar: (id: string) => void; sidebarSecretId: string; isSnapshot: boolean; + isCapitalized: boolean; } /** @@ -39,7 +40,8 @@ const KeyPair = ({ isDuplicate, toggleSidebar, sidebarSecretId, - isSnapshot + isSnapshot, + isCapitalized }: KeyPairProps) => (
; } diff --git a/frontend/src/pages/api/workspace/toggleAutoCapitalization.ts b/frontend/src/pages/api/workspace/toggleAutoCapitalization.ts new file mode 100644 index 000000000..fa459d67a --- /dev/null +++ b/frontend/src/pages/api/workspace/toggleAutoCapitalization.ts @@ -0,0 +1,26 @@ +import SecurityClient from '@app/components/utilities/SecurityClient'; + +/** + * This route lets us change the auto capitalization settings in a project. + * @param {*} req + * @param {*} res + * @returns + */ +const toggleAutoCapitalization = (workspaceId: string, state: boolean) => + SecurityClient.fetchCall(`/api/v2/workspace/${workspaceId}/settings`, { + method: 'POST', + headers: { + 'Content-Type': 'application/json' + }, + body: JSON.stringify({ + autoCapitalization: state + }) + }).then(async (res) => { + if (res && res.status === 200) { + return res; + } + console.log('Failed to toggle auto capitalization state'); + return undefined; + }); + +export default toggleAutoCapitalization; diff --git a/frontend/src/pages/dashboard/[id].tsx b/frontend/src/pages/dashboard/[id].tsx index c7f15ca70..25fd7fecd 100644 --- a/frontend/src/pages/dashboard/[id].tsx +++ b/frontend/src/pages/dashboard/[id].tsx @@ -123,6 +123,7 @@ export default function Dashboard() { const [snapshotData, setSnapshotData] = useState(); const [numSnapshots, setNumSnapshots] = useState(); const [saveLoading, setSaveLoading] = useState(false); + const [autoCapitalization, setAutoCapitalization] = useState(false); const { t } = useTranslation(); const { createNotification } = useNotificationContext(); @@ -213,6 +214,7 @@ export default function Dashboard() { if (!workspace) { router.push(`/dashboard/${userWorkspaces?.[0]?._id}`); } + setAutoCapitalization(workspace?.autoCapitalization ?? true); setWorkspaceEnvs(workspace?.environments || []); // set env @@ -758,6 +760,7 @@ export default function Dashboard() { .filter((row) => !sharedToHide.includes(row.id)) .map((keyPair) => ( ( ([]); const [environments, setEnvironments] = useState>([]); const [workspaceToBeDeletedName, setWorkspaceToBeDeletedName] = useState(''); @@ -63,6 +67,7 @@ export default function SettingsBasic() { userWorkspaces.forEach((userWorkspace) => { if (userWorkspace._id === workspaceId) { setWorkspaceName(userWorkspace.name); + setAutoCapitalization(userWorkspace.autoCapitalization ?? true); setEnvironments(userWorkspace.environments); } }); @@ -80,11 +85,22 @@ export default function SettingsBasic() { setWorkspaceName(newName); }; + const toggleAutoCapitalizationCheckBox = (state: boolean) => { + setAutoCapitalizationButtonReady(true); + setAutoCapitalization(state); + }; + const submitChanges = (newWorkspaceName: string) => { renameWorkspace(workspaceId, newWorkspaceName); setButtonReady(false); }; + const submitAutoCapitalizationChanges = () => { + toggleAutoCapitalization(workspaceId, autoCapitalization); + setAutoCapitalizationButtonReady(false); + }; + + const closeAddServiceTokenModal = () => { setIsAddServiceTokenDialogOpen(false); }; @@ -196,6 +212,28 @@ export default function SettingsBasic() {
+
+

{t('settings-project:auto-capitalization')}

+ toggleAutoCapitalizationCheckBox(state as boolean)} + > {t('settings-project:auto-capitalization-description')} +
+
+
+
+

{t('common:project-id')}