diff --git a/frontend/src/pages/integrations/gitlab/authorize.tsx b/frontend/src/pages/integrations/gitlab/authorize.tsx new file mode 100644 index 000000000..d3ec0e255 --- /dev/null +++ b/frontend/src/pages/integrations/gitlab/authorize.tsx @@ -0,0 +1,53 @@ +import crypto from "crypto"; + +import { useState } from "react"; +import { faGoogle } from "@fortawesome/free-brands-svg-icons"; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; + +import { useGetCloudIntegrations } from "@app/hooks/api"; + +import { Button, Card, CardTitle, FormControl, Input } from "../../../components/v2"; + +export default function GitLabAuthorizeIntegrationPage() { + const { data: cloudIntegrations } = useGetCloudIntegrations(); + + const [gitLabURL, setGitLabURL] = useState(""); + + const handleIntegrateWithOAuth = () => { + if (!cloudIntegrations) return; + const integrationOption = cloudIntegrations.find((integration) => integration.slug === "gitlab"); + + if (!integrationOption) return; + + const baseURL = gitLabURL.trim() === "" ? "https://gitlab.com" : gitLabURL.trim(); + + const csrfToken = crypto.randomBytes(16).toString("hex"); + localStorage.setItem("latestCSRFToken", csrfToken); + + const link = `${baseURL}/oauth/authorize?client_id=${integrationOption.clientId}&redirect_uri=${window.location.origin}/integrations/gitlab/oauth2/callback&response_type=code&state=${state}`; + window.location.assign(link); + } + + return ( +
+ + GitLab Integration + + setGitLabURL(e.target.value)} + /> + + + +
+ ); +} + +GitLabAuthorizeIntegrationPage.requireAuth = true; diff --git a/frontend/src/pages/integrations/gitlab/oauth2/callback.tsx b/frontend/src/pages/integrations/gitlab/oauth2/callback.tsx index 4df89f072..df5c98ad1 100644 --- a/frontend/src/pages/integrations/gitlab/oauth2/callback.tsx +++ b/frontend/src/pages/integrations/gitlab/oauth2/callback.tsx @@ -18,6 +18,7 @@ export default function GitLabOAuth2CallbackPage() { if (state !== localStorage.getItem("latestCSRFToken")) return; localStorage.removeItem("latestCSRFToken"); + // TODO: self-hosted url somewhere here? const integrationAuth = await mutateAsync({ workspaceId: localStorage.getItem("projectData.id") as string, code: code as string, diff --git a/frontend/src/views/IntegrationsPage/IntegrationPage.utils.tsx b/frontend/src/views/IntegrationsPage/IntegrationPage.utils.tsx index 3c8ba3785..f45e16ab6 100644 --- a/frontend/src/views/IntegrationsPage/IntegrationPage.utils.tsx +++ b/frontend/src/views/IntegrationsPage/IntegrationPage.utils.tsx @@ -64,7 +64,7 @@ export const redirectForProviderAuth = (integrationOption: TCloudIntegration) => link = `https://github.com/login/oauth/authorize?client_id=${integrationOption.clientId}&response_type=code&scope=repo&redirect_uri=${window.location.origin}/integrations/github/oauth2/callback&state=${state}`; break; case "gitlab": - link = `https://gitlab.com/oauth/authorize?client_id=${integrationOption.clientId}&redirect_uri=${window.location.origin}/integrations/gitlab/oauth2/callback&response_type=code&state=${state}`; + link = `${window.location.origin}/integrations/gitlab/authorize`; break; case "render": link = `${window.location.origin}/integrations/render/authorize`;