diff --git a/frontend/src/components/integrations/Integration.tsx b/frontend/src/components/integrations/Integration.tsx index 6a657c1a0..7bfd0d0c0 100644 --- a/frontend/src/components/integrations/Integration.tsx +++ b/frontend/src/components/integrations/Integration.tsx @@ -4,7 +4,11 @@ import { useRouter } from 'next/router'; import { faArrowRight, faCheck, faXmark } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; // TODO: This needs to be moved from public folder -import { contextNetlifyMapping, integrationSlugNameMapping, reverseContextNetlifyMapping } from 'public/data/frequentConstants'; +import { + contextNetlifyMapping, + integrationSlugNameMapping, + reverseContextNetlifyMapping +} from 'public/data/frequentConstants'; import Button from '@app/components/basic/buttons/Button'; import ListBox from '@app/components/basic/Listbox'; @@ -27,6 +31,7 @@ interface Integration { targetEnvironment: string; workspace: string; integrationAuth: string; + secretPath: string; } interface IntegrationApp { @@ -55,7 +60,6 @@ const IntegrationTile = ({ environments = [], handleDeleteIntegration }: Props) => { - const [integrationEnvironment, setIntegrationEnvironment] = useState( environments.find(({ slug }) => slug === integration?.environment) || { name: '', @@ -74,16 +78,16 @@ const IntegrationTile = ({ }); setApps(tempApps); - + if (integration?.app) { setIntegrationApp(integration.app); } else if (integration?.path && integration?.region) { setIntegrationApp(`${integration.path} (${integration.region})`); } else if (tempApps.length > 0) { - setIntegrationApp(tempApps[0].name) - } else { - setIntegrationApp(''); - } + setIntegrationApp(tempApps[0].name); + } else { + setIntegrationApp(''); + } switch (integration.integration) { case 'vercel': @@ -212,12 +216,15 @@ const IntegrationTile = ({ return
; }; - if (!integrationApp && integration.integration !== "checkly") return
; - - const isSelected = integration.integration === 'hashicorp-vault' ? `${integration.app} - path: ${integration.path}` : integrationApp; + if (!integrationApp && integration.integration !== 'checkly') return
; + + const isSelected = + integration.integration === 'hashicorp-vault' + ? `${integration.app} - path: ${integration.path}` + : integrationApp; return ( -
+

ENVIRONMENT

@@ -235,33 +242,46 @@ const IntegrationTile = ({ isFull />
+
+

SECRET PATH

+
+ {/* {integration.integration.charAt(0).toUpperCase() + integration.integration.slice(1)} */} + {integration.secretPath} +
+
-

INTEGRATION

-
+

INTEGRATION

+
{/* {integration.integration.charAt(0).toUpperCase() + integration.integration.slice(1)} */} {integrationSlugNameMapping[integration.integration]}
APP
- {integrationApp ?
- app.name) : null} - isSelected={isSelected} - onChange={(app) => { - setIntegrationApp(app); - }} - /> -
:
-
} + {integrationApp ? ( +
+ app.name) : null} + isSelected={isSelected} + onChange={(app) => { + setIntegrationApp(app); + }} + /> +
+ ) : ( +
+ - +
+ )}
{renderIntegrationSpecificParams(integration)}
-
+
{integration.isActive ? ( -
+
In Sync
diff --git a/frontend/src/components/integrations/IntegrationSection.tsx b/frontend/src/components/integrations/IntegrationSection.tsx index 9b8799b6a..cf1d7e9c4 100644 --- a/frontend/src/components/integrations/IntegrationSection.tsx +++ b/frontend/src/components/integrations/IntegrationSection.tsx @@ -23,6 +23,7 @@ interface Integration { targetEnvironment: string; workspace: string; integrationAuth: string; + secretPath: string; } const ProjectIntegrationSection = ({ diff --git a/frontend/src/pages/api/integrations/createIntegration.ts b/frontend/src/pages/api/integrations/createIntegration.ts index e3e7c010a..331adff51 100644 --- a/frontend/src/pages/api/integrations/createIntegration.ts +++ b/frontend/src/pages/api/integrations/createIntegration.ts @@ -3,6 +3,7 @@ import SecurityClient from '@app/components/utilities/SecurityClient'; interface Props { integrationAuthId: string; isActive: boolean; + secretPath: string; app: string | null; appId: string | null; sourceEnvironment: string; @@ -20,19 +21,20 @@ interface Props { * @param {String} obj.accessToken - id of integration authorization for which to create the integration * @returns */ -const createIntegration = ({ - integrationAuthId, - isActive, - app, - appId, - sourceEnvironment, - targetEnvironment, - targetEnvironmentId, - targetService, - targetServiceId, - owner, - path, - region +const createIntegration = ({ + integrationAuthId, + isActive, + app, + appId, + sourceEnvironment, + targetEnvironment, + targetEnvironmentId, + targetService, + targetServiceId, + owner, + path, + region, + secretPath }: Props) => SecurityClient.fetchCall('/api/v1/integration', { method: 'POST', @@ -40,18 +42,19 @@ const createIntegration = ({ 'Content-Type': 'application/json' }, body: JSON.stringify({ - integrationAuthId, - isActive, - app, - appId, - sourceEnvironment, - targetEnvironment, - targetEnvironmentId, - targetService, - targetServiceId, - owner, - path, - region + integrationAuthId, + isActive, + app, + appId, + sourceEnvironment, + targetEnvironment, + targetEnvironmentId, + targetService, + targetServiceId, + owner, + path, + region, + secretPath }) }).then(async (res) => { if (res && res.status === 200) { @@ -61,4 +64,4 @@ const createIntegration = ({ return undefined; }); -export default createIntegration; \ No newline at end of file +export default createIntegration; diff --git a/frontend/src/pages/integrations/[id].tsx b/frontend/src/pages/integrations/[id].tsx index 435c904f5..1f7050c42 100644 --- a/frontend/src/pages/integrations/[id].tsx +++ b/frontend/src/pages/integrations/[id].tsx @@ -44,6 +44,7 @@ interface Integration { integration: string; targetEnvironment: string; workspace: string; + secretPath:string; integrationAuth: string; } diff --git a/frontend/src/pages/integrations/aws-parameter-store/create.tsx b/frontend/src/pages/integrations/aws-parameter-store/create.tsx index d06ac0061..4f84ff476 100644 --- a/frontend/src/pages/integrations/aws-parameter-store/create.tsx +++ b/frontend/src/pages/integrations/aws-parameter-store/create.tsx @@ -56,6 +56,7 @@ export default function AWSParameterStoreCreateIntegrationPage() { const { data: integrationAuth } = useGetIntegrationAuthById((integrationAuthId as string) ?? ''); const [selectedSourceEnvironment, setSelectedSourceEnvironment] = useState(''); + const [secretPath, setSecretPath] = useState('/'); const [selectedAWSRegion, setSelectedAWSRegion] = useState(''); const [path, setPath] = useState(''); const [pathErrorText, setPathErrorText] = useState(''); @@ -69,9 +70,9 @@ export default function AWSParameterStoreCreateIntegrationPage() { } }, [workspace]); - const isValidAWSParameterStorePath = (secretPath: string) => { + const isValidAWSParameterStorePath = (awsStorePath: string) => { const pattern = /^\/([\w-]+\/)*[\w-]+\/$/; - return pattern.test(secretPath) && secretPath.length <= 2048; + return pattern.test(awsStorePath) && awsStorePath.length <= 2048; }; const handleButtonClick = async () => { @@ -101,7 +102,8 @@ export default function AWSParameterStoreCreateIntegrationPage() { targetServiceId: null, owner: null, path, - region: selectedAWSRegion + region: selectedAWSRegion, + secretPath }); setIsLoading(false); @@ -133,6 +135,13 @@ export default function AWSParameterStoreCreateIntegrationPage() { ))} + + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + - - Checkly Integration + + + Checkly Integration + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setTargetEnvironment(e.target.value)} + + setTargetEnvironment(e.target.value)} /> diff --git a/frontend/src/pages/integrations/heroku/create.tsx b/frontend/src/pages/integrations/heroku/create.tsx index 53f9b3666..639f774d7 100644 --- a/frontend/src/pages/integrations/heroku/create.tsx +++ b/frontend/src/pages/integrations/heroku/create.tsx @@ -2,7 +2,15 @@ import { useEffect, useState } from 'react'; import { useRouter } from 'next/router'; import queryString from 'query-string'; -import { Button, Card, CardTitle, FormControl, Select, SelectItem } from '../../../components/v2'; +import { + Button, + Card, + CardTitle, + FormControl, + Input, + Select, + SelectItem +} from '../../../components/v2'; import { useGetIntegrationAuthApps, useGetIntegrationAuthById @@ -23,6 +31,7 @@ export default function HerokuCreateIntegrationPage() { const [selectedSourceEnvironment, setSelectedSourceEnvironment] = useState(''); const [targetApp, setTargetApp] = useState(''); + const [secretPath, setSecretPath] = useState('/'); const [isLoading, setIsLoading] = useState(false); @@ -60,7 +69,8 @@ export default function HerokuCreateIntegrationPage() { targetServiceId: null, owner: null, path: null, - region: null + region: null, + secretPath }); setIsLoading(false); @@ -94,6 +104,13 @@ export default function HerokuCreateIntegrationPage() { ))} + + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + + + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + + + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + + + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> + setSecretPath(evt.target.value)} + placeholder="Provide a path, default is /" + /> +