Wire post-OAuth pickers and 2-auto callback handling → Track e2e gap for new access-review connectors

- Wire post-OAuth pickers and 2-auto callback handling
- Add 13 vendor logo components for new connectors
- Wire access-review connectors into bootstrap config
- Track e2e gap for new access-review connectors

Signed-off-by: Aurélien Sibiril <81782+aureliensibiril@users.noreply.github.com>

packages/ui/src/Atoms/ThirdParties/Asana.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Asana(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M18.78 12.653a5.22 5.22 0 1 0 0 10.44 5.22 5.22 0 0 0 0-10.44zm-13.56 0a5.22 5.22 0 1 0 .001 10.44 5.22 5.22 0 0 0-.001-10.44zM17.22 5.22a5.22 5.22 0 1 1-10.44 0 5.22 5.22 0 0 1 10.44 0z"
+        fill="#F06A6A"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/Bitbucket.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Bitbucket(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M.778 1.213a.768.768 0 0 0-.768.892l3.263 19.81c.084.5.515.868 1.022.873H19.95a.772.772 0 0 0 .77-.646l3.27-20.03a.768.768 0 0 0-.768-.891zM14.52 15.53H9.522L8.17 8.466h7.561z"
+        fill="#0052CC"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/ClickUp.tsx

@@ -0,0 +1,16 @@
+import type { ComponentProps } from "react";
+
+export function ClickUp(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="m2 18.439 3.69-2.828c1.961 2.56 4.044 3.739 6.363 3.739 2.307 0 4.33-1.166 6.203-3.708L22 18.405C19.298 22.067 15.941 24 12.053 24 8.178 24 4.788 22.08 2 18.439Z"
+        fill="#7B68EE"
+      />
+      <path
+        d="m12.04 7.476-6.566 5.66-3.035-3.519L12.054 1.36l9.543 8.265-3.05 3.508z"
+        fill="#7B68EE"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/Deel.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Deel(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M3 3h7.5c4.97 0 9 4.03 9 9s-4.03 9-9 9H3V3zm3.5 3.2v11.6h4c3.2 0 5.8-2.6 5.8-5.8S13.7 6.2 10.5 6.2h-4z"
+        fill="#15847B"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/GitLab.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function GitLab(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="m23.6004 9.5927-.0337-.0862L20.3.9814a.851.851 0 0 0-.3362-.405.8748.8748 0 0 0-.9997.0539.8748.8748 0 0 0-.29.4399l-2.2055 6.748H7.5375l-2.2057-6.748a.8573.8573 0 0 0-.29-.4412.8748.8748 0 0 0-.9997-.0537.8585.8585 0 0 0-.3362.4049L.4332 9.5015l-.0325.0862a6.0657 6.0657 0 0 0 2.0119 7.0105l.0113.0087.03.0213 4.976 3.7264 2.462 1.8633 1.4995 1.1321a1.0085 1.0085 0 0 0 1.2197 0l1.4995-1.1321 2.4619-1.8633 5.006-3.7489.0125-.01a6.0682 6.0682 0 0 0 2.0094-7.003z"
+        fill="#FC6D26"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/Heroku.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Heroku(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M20.61 0H3.39C2.189 0 1.23.96 1.23 2.16V21.84c0 1.2.99 2.16 2.16 2.16H20.61c1.2 0 2.16-.96 2.16-2.16V2.16C22.74.96 21.78 0 20.61 0zm.54 21.84a.555.555 0 0 1-.54.54H3.39a.555.555 0 0 1-.54-.54V2.16c0-.301.24-.541.54-.541H20.61c.3 0 .54.24.54.541V21.84zM6.9 19.86V14.4s6.42-3.061 6.42 0v5.46h3.18v-5.7c0-1.71-.72-3.66-3.78-3.66-2.85 0-5.82 1.32-5.82 1.32V4.14H3.72V19.86H6.9zm9.69-11.7h-3.21c1.351-1.62 2.041-3.21 2.34-4.02h3.18c-.45 1.59-1.5 2.94-2.31 4.02zM6.9 19.86l3.359-3.18-3.36-3.18v6.36z"
+        fill="#430098"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/Lever.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Lever(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M3 3h3.6v14.8H21V21H3V3zm6.4 0h3.6v11.2h7V17.5H9.4V3z"
+        fill="#16323F"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/Monday.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Monday(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M2.25 16.5L6.75 6a2.25 2.25 0 014.13 1.78L6.38 18.28A2.25 2.25 0 012.25 16.5zm7.5 0L14.25 6a2.25 2.25 0 014.13 1.78L13.88 18.28A2.25 2.25 0 019.75 16.5zM18 18.75a2.25 2.25 0 110-4.5 2.25 2.25 0 010 4.5z"
+        fill="#FF3D57"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/Netlify.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Netlify(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M6.49 19.04h-.23L5.13 17.91v-.23l3.46-3.46h1.92l.25.25v1.92zM5.13 6.31V6.08l1.13-1.13h.23l3.46 3.46v1.92l-.25.25H7.78zm9.96 9.09h-2.65l-.22-.22V8.83c0-.39-.15-.74-.5-.85-.36-.11-.74.03-.95.34l-.27.27h-1.93l-.25-.25V6.41l.22-.22h6.55l.22.22v8.77zm0-13.78v2.21l-.22.22h-1.49l-.22-.22V1.62l.22-.22h1.49zm0 17.55v2.21l-.22.22h-1.49l-.22-.22v-2.21l.22-.22h1.49zM20.5 12.93h-2.21l-.22-.22v-1.49l.22-.22h2.21l.22.22v1.49zm-13.34 0H1.5l-.22-.22v-1.49l.22-.22h5.66l.22.22v1.49z"
+        fill="#00C7B7"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/PagerDuty.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function PagerDuty(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M5 2h7.5c4.14 0 7.5 3.36 7.5 7.5S16.64 17 12.5 17H8.5v5H5V2zm3.5 3.2v8.6h4c2.37 0 4.3-1.93 4.3-4.3S14.87 5.2 12.5 5.2h-4z"
+        fill="#06AC38"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/Ramp.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Ramp(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M3 3h11.5c2.76 0 5 2.24 5 5 0 2.05-1.23 3.81-2.99 4.59L20 21h-3.7l-3.16-7.5H6.5V21H3V3zm3.5 3.2v4.1h7.6c1.13 0 2.05-.92 2.05-2.05S15.23 6.2 14.1 6.2H6.5z"
+        fill="#FFCC33"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/Snyk.tsx

@@ -0,0 +1,12 @@
+import type { ComponentProps } from "react";
+
+export function Snyk(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M22.226 7.563c-.876-1.518-3.351-1.519-4.227 0l-1.252 2.169-2.633-4.561c-.876-1.518-3.351-1.518-4.227 0L8.012 9.928 6.137 6.68c-.624-1.083-2.394-1.085-3.02 0L.328 11.32c-.626 1.085.26 2.612 1.51 2.612h3.748l-1.872 3.243c-.626 1.085.26 2.612 1.51 2.612h13.553c1.25 0 2.135-1.527 1.51-2.612l-1.873-3.243h2.103c1.25 0 2.137-1.527 1.51-2.612z"
+        fill="#4C4A73"
+      />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/ThirdPartyLogo.tsx

@@ -14,47 +14,73 @@
 
 import type { ComponentProps, FC } from "react";
 
+import { Asana } from "./Asana";
+import { Bitbucket } from "./Bitbucket";
 import { Brex } from "./Brex";
+import { ClickUp } from "./ClickUp";
 import { Cloudflare } from "./Cloudflare";
+import { Deel } from "./Deel";
 import { DocuSign } from "./DocuSign";
 import { Figma } from "./Figma";
 import { GitHub } from "./GitHub";
+import { GitLab } from "./GitLab";
 import { Google } from "./Google";
+import { Heroku } from "./Heroku";
 import { HubSpot } from "./HubSpot";
 import { Intercom } from "./Intercom";
+import { Lever } from "./Lever";
 import { Linear } from "./Linear";
 import { Microsoft } from "./Microsoft";
+import { Monday } from "./Monday";
+import { Netlify } from "./Netlify";
 import { Notion } from "./Notion";
 import { OnePassword } from "./OnePassword";
 import { OpenAI } from "./OpenAI";
+import { PagerDuty } from "./PagerDuty";
+import { Ramp } from "./Ramp";
 import { Resend } from "./Resend";
 import { Sentry } from "./Sentry";
 import { Slack } from "./Slack";
+import { Snyk } from "./Snyk";
 import { Supabase } from "./Supabase";
 import { Tally } from "./Tally";
+import { Vercel } from "./Vercel";
 
 const thirdParties: Record<string, FC<ComponentProps<"svg">>> = {
+  ASANA: Asana,
+  BITBUCKET: Bitbucket,
   BREX: Brex,
+  CLICKUP: ClickUp,
   CLOUDFLARE: Cloudflare,
+  DEEL: Deel,
   DOCUSIGN: DocuSign,
   FIGMA: Figma,
   GITHUB: GitHub,
+  GITLAB: GitLab,
   GOOGLE: Google,
   GOOGLE_WORKSPACE: Google,
+  HEROKU: Heroku,
   HUBSPOT: HubSpot,
   INTERCOM: Intercom,
+  LEVER: Lever,
   LINEAR: Linear,
   MICROSOFT: Microsoft,
   MICROSOFT_365: Microsoft,
+  MONDAY: Monday,
+  NETLIFY: Netlify,
   NOTION: Notion,
   ONE_PASSWORD: OnePassword,
   ONEPASSWORD: OnePassword,
   OPENAI: OpenAI,
+  PAGERDUTY: PagerDuty,
+  RAMP: Ramp,
   RESEND: Resend,
   SENTRY: Sentry,
   SLACK: Slack,
+  SNYK: Snyk,
   SUPABASE: Supabase,
   TALLY: Tally,
+  VERCEL: Vercel,
 };
 
 type ThirdPartyLogoProps = ComponentProps<"svg"> & {
@@ -72,7 +98,9 @@ export function ThirdPartyLogo({ thirdParty, tint, ...props }: ThirdPartyLogoPro
     return (
       <Component
         {...props}
-        className={["grayscale brightness-0 dark:invert", props.className].filter(Boolean).join(" ")}
+        className={["grayscale brightness-0 dark:invert", props.className]
+          .filter(Boolean)
+          .join(" ")}
       />
     );
   }

packages/ui/src/Atoms/ThirdParties/Vercel.tsx

@@ -0,0 +1,9 @@
+import type { ComponentProps } from "react";
+
+export function Vercel(props: ComponentProps<"svg">) {
+  return (
+    <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path d="M24 22.525H0l12-21.05 12 21.05z" fill="#000000" />
+    </svg>
+  );
+}

packages/ui/src/Atoms/ThirdParties/index.ts

@@ -1,19 +1,32 @@
+export { Asana } from "./Asana";
+export { Bitbucket } from "./Bitbucket";
 export { Brex } from "./Brex";
+export { ClickUp } from "./ClickUp";
 export { Cloudflare } from "./Cloudflare";
+export { Deel } from "./Deel";
 export { DocuSign } from "./DocuSign";
 export { Figma } from "./Figma";
 export { GitHub } from "./GitHub";
+export { GitLab } from "./GitLab";
 export { Google } from "./Google";
+export { Heroku } from "./Heroku";
 export { HubSpot } from "./HubSpot";
 export { Intercom } from "./Intercom";
+export { Lever } from "./Lever";
 export { Linear } from "./Linear";
 export { Microsoft } from "./Microsoft";
+export { Monday } from "./Monday";
+export { Netlify } from "./Netlify";
 export { Notion } from "./Notion";
 export { OnePassword } from "./OnePassword";
 export { OpenAI } from "./OpenAI";
+export { PagerDuty } from "./PagerDuty";
+export { Ramp } from "./Ramp";
 export { Resend } from "./Resend";
 export { Sentry } from "./Sentry";
 export { Slack } from "./Slack";
+export { Snyk } from "./Snyk";
 export { Supabase } from "./Supabase";
 export { Tally } from "./Tally";
 export { ThirdPartyLogo } from "./ThirdPartyLogo";
+export { Vercel } from "./Vercel";