Merge remote-tracking branch 'origin' into railway

This commit is contained in:
Tuan Dang
2023-04-08 22:17:58 +03:00
13 changed files with 1070 additions and 344 deletions

View File

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

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
});
}

View File

@@ -27,8 +27,7 @@ export default function GitHubCreateIntegrationPage() {
});
const [selectedSourceEnvironment, setSelectedSourceEnvironment] = useState('');
const [owner, setOwner] = useState<string | null>(null);
const [targetApp, setTargetApp] = useState('');
const [targetAppId, setTargetAppId] = useState('');
const [isLoading, setIsLoading] = useState(false);
@@ -41,10 +40,9 @@ export default function GitHubCreateIntegrationPage() {
useEffect(() => {
if (integrationAuthApps) {
if (integrationAuthApps.length > 0) {
setTargetApp(integrationAuthApps[0].name);
setOwner(integrationAuthApps[0]?.owner ?? null);
setTargetAppId(integrationAuthApps[0].appId as string);
} else {
setTargetApp('none');
setTargetAppId('none');
}
}
}, [integrationAuthApps]);
@@ -55,14 +53,18 @@ export default function GitHubCreateIntegrationPage() {
if (!integrationAuth?._id) return;
const targetApp = integrationAuthApps?.find((integrationAuthApp) => integrationAuthApp.appId === targetAppId);
if (!targetApp || !targetApp.owner) return;
await createIntegration({
integrationAuthId: integrationAuth?._id,
isActive: true,
app: targetApp,
app: targetApp.name,
appId: null,
sourceEnvironment: selectedSourceEnvironment,
targetEnvironment: null,
owner,
owner: targetApp.owner,
path: null,
region: null
});
@@ -76,7 +78,7 @@ export default function GitHubCreateIntegrationPage() {
}
}
return (integrationAuth && workspace && selectedSourceEnvironment && integrationAuthApps && targetApp) ? (
return (integrationAuth && workspace && selectedSourceEnvironment && integrationAuthApps && targetAppId) ? (
<div className="h-full w-full flex justify-center items-center">
<Card className="max-w-md p-8 rounded-md">
<CardTitle className='text-center'>GitHub Integration</CardTitle>
@@ -101,14 +103,14 @@ export default function GitHubCreateIntegrationPage() {
className='mt-4'
>
<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={`github-environment-${integrationAuthApp.name}`}>
<SelectItem value={integrationAuthApp.appId as string} key={`github-repo-${integrationAuthApp.appId}`}>
{integrationAuthApp.name}
</SelectItem>
))

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}

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"