🪟 🧪 [Experiment] Show speedy connection banner only to corporate emails

airbyte-webapp/src/packages/cloud/components/experiments/SpeedyConnection/CountDownTimer/CountDownTimer.module.scss

@@ -7,7 +7,7 @@
 }
 
 .countDownTimerItem {
-  color: colors.$orange;
+  color: colors.$blue-400;
   font-size: 16px;
   line-height: 28px;
   font-weight: 700;

airbyte-webapp/src/packages/cloud/components/experiments/SpeedyConnection/SpeedyConnectionBanner/SpeedyConnectionBanner.module.scss

@@ -12,8 +12,8 @@
   padding: 8px;
   display: flex;
   align-items: center;
-  background-color: colors.$blue;
-  color: colors.$white;
+  background-color: colors.$blue-100;
+  color: colors.$dark-blue;
 
   @media (min-width: 1280px) {
     height: 50px;
@@ -33,7 +33,3 @@
 .linkCta {
   color: colors.$dark-blue;
 }
-
-.textDecorationNone {
-  text-decoration: none;
-}

airbyte-webapp/src/packages/cloud/components/experiments/SpeedyConnection/SpeedyConnectionBanner/SpeedyConnectionBanner.tsx

@@ -1,39 +1,30 @@
 import classnames from "classnames";
-import classNames from "classnames";
 import { FormattedMessage } from "react-intl";
-import { Link, useLocation } from "react-router-dom";
+import { Link } from "react-router-dom";
 
 import { Text } from "components/ui/Text";
 
-import { useExperiment } from "hooks/services/Experiment";
 import { CountDownTimer } from "packages/cloud/components/experiments/SpeedyConnection/CountDownTimer";
 import { StepType } from "pages/OnboardingPage/types";
 import { RoutePaths } from "pages/routePaths";
 
 import { useExperimentSpeedyConnection } from "../hooks/useExperimentSpeedyConnection";
-import credits from "./credits.svg";
 import styles from "./SpeedyConnectionBanner.module.scss";
 
 export const SpeedyConnectionBanner = () => {
   const { expiredOfferDate } = useExperimentSpeedyConnection();
-  const location = useLocation();
-  const hideOnboardingExperiment = useExperiment("onboarding.hideOnboarding", false);
 
   return (
     <div className={classnames(styles.container)}>
       <div className={styles.innerContainer}>
-        <img src={credits} alt="" />
-
         <FormattedMessage
           id="experiment.speedyConnection"
           defaultMessage="<link>Set up your first connection</link> in the next <timer></timer> and get <b>100 additonal credits</b> for your trial"
           values={{
             link: (link: React.ReactNode[]) => (
               <Link
-                className={classNames(styles.linkCta, {
-                  [styles.textDecorationNone]: location.pathname.includes("onboarding"),
-                })}
-                to={hideOnboardingExperiment ? RoutePaths.Connections : RoutePaths.Onboarding}
+                className={styles.linkCta}
+                to={`${RoutePaths.Connections}/${RoutePaths.ConnectionNew}`}
                 state={{
                   step: StepType.CREATE_SOURCE,
                 }}
@@ -44,7 +35,6 @@ export const SpeedyConnectionBanner = () => {
             timer: () => <CountDownTimer expiredOfferDate={expiredOfferDate} />,
           }}
         />
-        <img src={credits} alt="" />
       </div>
     </div>
   );

airbyte-webapp/src/packages/cloud/services/auth/AuthService.tsx

@@ -16,6 +16,7 @@ import { useAuth } from "packages/firebaseReact";
 import { useInitService } from "services/useInitService";
 import { getUtmFromStorage } from "utils/utmStorage";
 
+import { FREE_EMAIL_SERVICE_PROVIDERS } from "./freeEmailProviders";
 import { actions, AuthServiceState, authStateReducer, initialState } from "./reducer";
 import { EmailLinkErrorCodes } from "./types";
 
@@ -51,6 +52,7 @@ interface AuthContextApi {
   loggedOut: boolean;
   providers: string[] | null;
   hasPasswordLogin: () => boolean;
+  hasCorporateEmail: () => boolean;
   login: AuthLogin;
   loginWithOAuth: (provider: OAuthProviders) => Observable<OAuthLoginState>;
   signUpWithEmailLink: (form: { name: string; email: string; password: string; news: boolean }) => Promise<void>;
@@ -170,6 +172,9 @@ export const AuthenticationProvider: React.FC<React.PropsWithChildren<unknown>>
       hasPasswordLogin(): boolean {
         return !!state.providers?.includes("password");
       },
+      hasCorporateEmail(): boolean {
+        return !FREE_EMAIL_SERVICE_PROVIDERS.some((provider) => state.currentUser?.email.includes(provider));
+      },
       async login(values: { email: string; password: string }): Promise<void> {
         await authService.login(values.email, values.password);