awatertrevi/infisical
1
0
Fork 0
mirror of https://github.com/awatertrevi/infisical.git synced 2026-09-22 13:39:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #486 from Infisical/vercel-preview-branches

Browse Source 
Add support for syncing to Vercel preview branches
This commit is contained in:
BlackMagiq
2023-04-08 16:08:21 +03:00
committed by GitHub
parent a3093de55b c175519d70
commit 56cc77e0e8
9 changed files with 211 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
backend/src/controllers/v1/integrationAuthController.ts
View File

@@ -12,6 +12,10 @@ import {
getTeams,
revokeAccess
} from '../../integrations';
import {
INTEGRATION_VERCEL_API_URL
} from '../../variables';
import request from '../../config/request';
/***
* Return integration authorization with id [integrationAuthId]
@@ -188,25 +192,60 @@ export const getIntegrationAuthApps = async (req: Request, res: Response) => {
* @returns
*/
export const getIntegrationAuthTeams = async (req: Request, res: Response) => {
let teams;
try {
teams = await getTeams({
integrationAuth: req.integrationAuth,
accessToken: req.accessToken
});
} catch (err) {
Sentry.setUser({ email: req.user.email });
Sentry.captureException(err);
return res.status(400).send({
message: "Failed to get integration authorization teams"
});
}
const teams = await getTeams({
integrationAuth: req.integrationAuth,
accessToken: req.accessToken
});
return res.status(200).send({
teams
});
}
/**
* Return list of available Vercel (preview) branches
* @param req
* @param res
*/
export const getIntegrationAuthVercelBranches = async (req: Request, res: Response) => {
const { integrationAuthId } = req.params;
const appId = req.query.appId as string;
interface VercelBranch {
ref: string;
lastCommit: string;
isProtected: boolean;
}
const params = new URLSearchParams({
projectId: appId,
...(req.integrationAuth.teamId ? {
teamId: req.integrationAuth.teamId
} : {})
});
let branches: string[] = [];
if (appId && appId !== '') {
const { data }: { data: VercelBranch[] } = await request.get(
`${INTEGRATION_VERCEL_API_URL}/v1/integrations/git-branches`,
{
params,
headers: {
Authorization: `Bearer ${req.accessToken}`,
'Accept-Encoding': 'application/json'
}
}
);
branches = data.map((b) => b.ref);
}
return res.status(200).send({
branches
});
}
/**
* Delete integration authorization with id [integrationAuthId]
* @param req

1
backend/src/integrations/apps.ts
View File

@@ -184,6 +184,7 @@ const getAppsVercel = async ({
apps = res.projects.map((a: any) => ({
name: a.name,
appId: a.id
}));
} catch (err) {
Sentry.setUser(null);

71
backend/src/integrations/sync.ts
View File

@@ -608,6 +608,7 @@ const syncSecretsVercel = async ({
key: string;
value: string;
target: string[];
gitBranch?: string;
}
try {
@@ -621,46 +622,7 @@ const syncSecretsVercel = async ({
}
: {}),
};
// const res = (
// await Promise.all(
// (
// await request.get(
// `${INTEGRATION_VERCEL_API_URL}/v9/projects/${integration.app}/env`,
// {
// params,
// headers: {
// Authorization: `Bearer ${accessToken}`,
// 'Accept-Encoding': 'application/json'
// }
// }
// ))
// .data
// .envs
// .filter((secret: VercelSecret) => secret.target.includes(integration.targetEnvironment))
// .map(async (secret: VercelSecret) => {
// if (secret.type === 'encrypted') {
// // case: secret is encrypted -> need to decrypt
// const decryptedSecret = (await request.get(
// `${INTEGRATION_VERCEL_API_URL}/v9/projects/${integration.app}/env/${secret.id}`,
// {
// params,
// headers: {
// Authorization: `Bearer ${accessToken}`,
// 'Accept-Encoding': 'application/json'
// }
// }
// )).data;
// return decryptedSecret;
// }
// return secret;
// }))).reduce((obj: any, secret: any) => ({
// ...obj,
// [secret.key]: secret
// }), {});
const vercelSecrets: VercelSecret[] = (await request.get(
`${INTEGRATION_VERCEL_API_URL}/v9/projects/${integration.app}/env`,
{
@@ -673,7 +635,21 @@ const syncSecretsVercel = async ({
))
.data
.envs
.filter((secret: VercelSecret) => secret.target.includes(integration.targetEnvironment));
.filter((secret: VercelSecret) => {
if (!secret.target.includes(integration.targetEnvironment)) {
// case: secret does not have the same target environment
return false;
}
if (integration.targetEnvironment === 'preview' && integration.path && integration.path !== secret.gitBranch) {
// case: secret on preview environment does not have same target git branch
return false;
}
return true;
});
// return secret.target.includes(integration.targetEnvironment);
const res: { [key: string]: VercelSecret } = {};
@@ -696,7 +672,7 @@ const syncSecretsVercel = async ({
res[vercelSecret.key] = vercelSecret;
}
}
const updateSecrets: VercelSecret[] = [];
const deleteSecrets: VercelSecret[] = [];
const newSecrets: VercelSecret[] = [];
@@ -710,6 +686,9 @@ const syncSecretsVercel = async ({
value: secrets[key],
type: "encrypted",
target: [integration.targetEnvironment],
...(integration.path ? {
gitBranch: integration.path
} : {})
});
}
});
@@ -726,7 +705,10 @@ const syncSecretsVercel = async ({
type: res[key].type,
target: res[key].target.includes(integration.targetEnvironment)
? [...res[key].target]
: [...res[key].target, integration.targetEnvironment]
: [...res[key].target, integration.targetEnvironment],
...(integration.path ? {
gitBranch: integration.path
} : {})
});
}
} else {
@@ -737,6 +719,9 @@ const syncSecretsVercel = async ({
value: res[key].value,
type: "encrypted", // value doesn't matter
target: [integration.targetEnvironment],
...(integration.path ? {
gitBranch: integration.path
} : {})
});
}
});

1
backend/src/models/integration.ts
View File

@@ -78,6 +78,7 @@ const integrationSchema = new Schema<IIntegration>(
},
path: {
// aws-parameter-store-specific path
// (also) vercel preview-branch
type: String,
default: null
},

15
backend/src/routes/v1/integrationAuth.ts
View File

@@ -91,6 +91,21 @@ router.get(
integrationAuthController.getIntegrationAuthTeams
);
router.get(
'/:integrationAuthId/vercel/branches',
requireAuth({
acceptedAuthModes: ['jwt']
}),
requireIntegrationAuthorizationAuth({
acceptedRoles: [ADMIN, MEMBER]
}),
param('integrationAuthId').exists().isString(),
query('appId').exists().isString(),
query('teamId').optional().isString(),
validateRequest,
integrationAuthController.getIntegrationAuthVercelBranches
);
router.delete(
'/:integrationAuthId',
requireAuth({

4
frontend/src/hooks/api/integrationAuth/index.tsx
View File

@@ -1,4 +1,6 @@
export {
useGetIntegrationAuthApps,
useGetIntegrationAuthById,
useGetIntegrationAuthTeams} from './queries';
useGetIntegrationAuthTeams,
useGetIntegrationAuthVercelBranches
} from './queries';

51
frontend/src/hooks/api/integrationAuth/queries.tsx
View File

@@ -5,12 +5,20 @@ import { apiRequest } from "@app/config/request";
import {
App,
IntegrationAuth,
Team} from './types';
Team
} from './types';
const integrationAuthKeys = {
getIntegrationAuthById: (integrationAuthId: string) => [{ integrationAuthId }, 'integrationAuth'] as const,
getIntegrationAuthApps: (integrationAuthId: string, teamId?: string) => [{ integrationAuthId, teamId }, 'integrationAuthApps'] as const,
getIntegrationAuthTeams: (integrationAuthId: string) => [{ integrationAuthId }, 'integrationAuthTeams'] as const
getIntegrationAuthTeams: (integrationAuthId: string) => [{ integrationAuthId }, 'integrationAuthTeams'] as const,
getIntegrationAuthVercelBranches: ({
integrationAuthId,
appId,
}: {
integrationAuthId: string;
appId: string;
}) => [{ integrationAuthId, appId }, 'integrationAuthVercelBranches']
}
const fetchIntegrationAuthById = async (integrationAuthId: string) => {
@@ -38,6 +46,22 @@ const fetchIntegrationAuthTeams = async (integrationAuthId: string) => {
return data.teams;
}
const fetchIntegrationAuthVercelBranches = async ({
integrationAuthId,
appId
}: {
integrationAuthId: string;
appId: string;
}) => {
const { data: { branches } } = await apiRequest.get<{ branches: string[] }>(`/api/v1/integration-auth/${integrationAuthId}/vercel/branches`, {
params: {
appId
}
});
return branches;
};
export const useGetIntegrationAuthById = (integrationAuthId: string) => {
return useQuery({
queryKey: integrationAuthKeys.getIntegrationAuthById(integrationAuthId),
@@ -46,7 +70,6 @@ export const useGetIntegrationAuthById = (integrationAuthId: string) => {
});
}
// TODO: fix to teamId
export const useGetIntegrationAuthApps = ({
integrationAuthId,
teamId
@@ -70,4 +93,24 @@ export const useGetIntegrationAuthTeams = (integrationAuthId: string) => {
queryFn: () => fetchIntegrationAuthTeams(integrationAuthId),
enabled: true
});
}
}
export const useGetIntegrationAuthVercelBranches = ({
integrationAuthId,
appId,
}: {
integrationAuthId: string;
appId: string;
}) => {
return useQuery({
queryKey: integrationAuthKeys.getIntegrationAuthVercelBranches({
integrationAuthId,
appId,
}),
queryFn: () => fetchIntegrationAuthVercelBranches({
integrationAuthId,
appId,
}),
enabled: true
});
}

4
frontend/src/pages/integrations/gitlab/create.tsx
View File

@@ -109,7 +109,6 @@ export default function GitLabCreateIntegrationPage() {
<CardTitle className='text-center'>GitLab Integration</CardTitle>
<FormControl
label="Project Environment"
className='mt-4'
>
<Select
value={selectedSourceEnvironment}
@@ -125,7 +124,6 @@ export default function GitLabCreateIntegrationPage() {
</FormControl>
<FormControl
label="GitLab Integration Type"
className='mt-4'
>
<Select
value={targetEntity}
@@ -144,7 +142,6 @@ export default function GitLabCreateIntegrationPage() {
{targetEntity === 'group' && targetTeamId && (
<FormControl
label="GitLab Group"
className='mt-4'
>
<Select
value={targetTeamId}
@@ -167,7 +164,6 @@ export default function GitLabCreateIntegrationPage() {
)}
<FormControl
label="GitLab Project"
className='mt-4'
>
<Select
value={targetAppId}

92
frontend/src/pages/integrations/vercel/create.tsx
View File

@@ -4,14 +4,18 @@ import queryString from 'query-string';
import { getTranslatedServerSideProps } from '../../../components/utilities/withTranslateProps';
import {
Button,
Card,
CardTitle,
FormControl,
Select,
SelectItem
Button,
Card,
CardTitle,
FormControl,
Select,
SelectItem
} from '../../../components/v2';
import { useGetIntegrationAuthApps,useGetIntegrationAuthById } from '../../../hooks/api/integrationAuth';
import {
useGetIntegrationAuthApps,
useGetIntegrationAuthById,
useGetIntegrationAuthVercelBranches
} from '../../../hooks/api/integrationAuth';
import { useGetWorkspaceById } from '../../../hooks/api/workspace';
import createIntegration from "../../api/integrations/createIntegration";
@@ -24,20 +28,28 @@ const vercelEnvironments = [
export default function VercelCreateIntegrationPage() {
const router = useRouter();
const { integrationAuthId } = queryString.parse(router.asPath.split('?')[1]);
const [selectedSourceEnvironment, setSelectedSourceEnvironment] = useState('');
const [targetAppId, setTargetAppId] = useState('');
const [targetEnvironment, setTargetEnvironment] = useState('');
const [targetBranch, setTargetBranch] = useState('');
const [isLoading, setIsLoading] = useState(false);
const { integrationAuthId } = queryString.parse(router.asPath.split('?')[1]);
const { data: workspace } = useGetWorkspaceById(localStorage.getItem('projectData.id') ?? '');
const { data: integrationAuth } = useGetIntegrationAuthById(integrationAuthId as string ?? '');
const { data: integrationAuthApps } = useGetIntegrationAuthApps({
integrationAuthId: integrationAuthId as string ?? ''
});
const [selectedSourceEnvironment, setSelectedSourceEnvironment] = useState('');
const [targetApp, setTargetApp] = useState('');
const [targetEnvironment, setTargetEnvironment] = useState('');
const [isLoading, setIsLoading] = useState(false);
const { data: branches } = useGetIntegrationAuthVercelBranches({
integrationAuthId: integrationAuthId as string,
appId: targetAppId,
});
const filteredBranches = branches
?.filter((branchName) => branchName !== 'main')
.concat('');
useEffect(() => {
if (workspace) {
setSelectedSourceEnvironment(workspace.environments[0].slug);
@@ -45,15 +57,15 @@ export default function VercelCreateIntegrationPage() {
}, [workspace]);
useEffect(() => {
if (integrationAuthApps) {
if (integrationAuthApps.length > 0) {
setTargetApp(integrationAuthApps[0].name);
setTargetEnvironment(vercelEnvironments[0].slug);
} else {
setTargetApp('none');
setTargetEnvironment(vercelEnvironments[0].slug);
}
if (integrationAuthApps) {
if (integrationAuthApps.length > 0) {
setTargetAppId(integrationAuthApps[0].appId as string);
setTargetEnvironment(vercelEnvironments[0].slug);
} else {
setTargetAppId('none');
setTargetEnvironment(vercelEnvironments[0].slug);
}
}
}, [integrationAuthApps]);
const handleButtonClick = async () => {
@@ -61,15 +73,22 @@ export default function VercelCreateIntegrationPage() {
if (!integrationAuth?._id) return;
setIsLoading(true);
const targetApp = integrationAuthApps?.find((integrationAuthApp) => integrationAuthApp.appId === targetAppId);
if (!targetApp || !targetApp.appId) return;
const path = (targetEnvironment === 'preview' && targetBranch !== '') ? targetBranch : null;
await createIntegration({
integrationAuthId: integrationAuth?._id,
isActive: true,
app: targetApp,
appId: null,
app: targetApp.name,
appId: targetApp.appId,
sourceEnvironment: selectedSourceEnvironment,
targetEnvironment,
owner: null,
path: null,
path,
region: null
});
@@ -82,7 +101,7 @@ export default function VercelCreateIntegrationPage() {
}
}
return (integrationAuth && workspace && selectedSourceEnvironment && integrationAuthApps && targetApp && targetEnvironment) ? (
return (integrationAuth && workspace && selectedSourceEnvironment && integrationAuthApps && targetAppId && targetEnvironment) ? (
<div className="h-full w-full flex justify-center items-center">
<Card className="max-w-md p-8 rounded-md">
<CardTitle className='text-center'>Vercel Integration</CardTitle>
@@ -106,14 +125,14 @@ export default function VercelCreateIntegrationPage() {
label="Vercel App"
>
<Select
value={targetApp}
onValueChange={(val) => setTargetApp(val)}
value={targetAppId}
onValueChange={(val) => setTargetAppId(val)}
className='w-full border border-mineshaft-500'
isDisabled={integrationAuthApps.length === 0}
>
{integrationAuthApps.length > 0 ? (
integrationAuthApps.map((integrationAuthApp) => (
<SelectItem value={integrationAuthApp.name} key={`target-app-${integrationAuthApp.name}`}>
<SelectItem value={integrationAuthApp.appId as string} key={`target-app-${integrationAuthApp.appId as string}`}>
{integrationAuthApp.name}
</SelectItem>
))
@@ -139,6 +158,23 @@ export default function VercelCreateIntegrationPage() {
))}
</Select>
</FormControl>
{targetEnvironment === 'preview' && filteredBranches && (
<FormControl
label="Vercel Preview Branch (Optional)"
>
<Select
value={targetBranch}
onValueChange={(val) => setTargetBranch(val)}
className='w-full border border-mineshaft-500'
>
{filteredBranches.map((branchName) => (
<SelectItem value={branchName} key={`target-branch-${branchName}`}>
{branchName}
</SelectItem>
))}
</Select>
</FormControl>
)}
<Button
onClick={handleButtonClick}
color="mineshaft"