refactor: atoms e2e setup

.github/actions/cache-db/action.yml

@@ -7,6 +7,14 @@ inputs:
   path:
     required: false
     default: "backups/backup.sql"
+  SEED_PLATFORM_OAUTH_CLIENT_ID:
+    required: false
+  SEED_PLATFORM_OAUTH_CLIENT_SECRET:
+    required: false
+  SEED_PLATFORM_OAUTH_CLIENT_ID_E2E:
+    required: false
+  SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E:
+    required: false
 runs:
   using: "composite"
   steps:
@@ -29,6 +37,11 @@ runs:
     - run: yarn db-seed
       if: steps.cache-db.outputs.cache-hit != 'true'
       shell: bash
+      env:
+        SEED_PLATFORM_OAUTH_CLIENT_ID: ${{ inputs.SEED_PLATFORM_OAUTH_CLIENT_ID }}
+        SEED_PLATFORM_OAUTH_CLIENT_SECRET: ${{ inputs.SEED_PLATFORM_OAUTH_CLIENT_SECRET }}
+        SEED_PLATFORM_OAUTH_CLIENT_ID_E2E: ${{ inputs.SEED_PLATFORM_OAUTH_CLIENT_ID_E2E }}
+        SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E: ${{ inputs.SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E }}
     - name: Postgres Dump Backup
       if: steps.cache-db.outputs.cache-hit != 'true'
       uses: tj-actions/pg-dump@v2.3

.github/workflows/e2e-api-v2.yml

@@ -27,6 +27,11 @@ env:
   VAPID_PRIVATE_KEY: ${{ secrets.VAPID_PRIVATE_KEY }}
   JWT_SECRET: ${{ secrets.CI_JWT_SECRET }}
   NODE_ENV: ${{ vars.CI_NODE_ENV }}
+  ## seed script env variables
+  SEED_PLATFORM_OAUTH_CLIENT_ID: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_ID }}
+  SEED_PLATFORM_OAUTH_CLIENT_SECRET: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_SECRET }}
+  SEED_PLATFORM_OAUTH_CLIENT_ID_E2E: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_ID_E2E }}
+  SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E }}
 jobs:
   e2e:
     timeout-minutes: 20
@@ -72,6 +77,11 @@ jobs:
       - uses: ./.github/actions/dangerous-git-checkout
       - uses: ./.github/actions/yarn-install
       - uses: ./.github/actions/cache-db
+        with:
+          SEED_PLATFORM_OAUTH_CLIENT_ID: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_ID }}
+          SEED_PLATFORM_OAUTH_CLIENT_SECRET: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_SECRET }}
+          SEED_PLATFORM_OAUTH_CLIENT_ID_E2E: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_ID_E2E }}
+          SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E }}
 
       - name: Generate Swagger
         working-directory: apps/api/v2

.github/workflows/e2e-atoms.yml

@@ -1,28 +1,105 @@
 name: E2E Atoms
 
 on:
-  workflow_call:
+  pull_request:
+    branches:
+      - main
+    paths:
+      - "packages/platform/atoms/**"
+      - "packages/platform/examples/base/**"
+      - "apps/api/v2/**"
+      - ".github/workflows/e2e-atoms.yml"
+
 permissions:
   actions: write
   contents: read
 
 env:
-  NODE_OPTIONS: --max-old-space-size=8096
-  ATOMS_E2E_OAUTH_CLIENT_ID: ${{ secrets.ATOMS_E2E_OAUTH_CLIENT_ID }}
-  ATOMS_E2E_OAUTH_CLIENT_SECRET: ${{ secrets.ATOMS_E2E_OAUTH_CLIENT_SECRET }}
-  ATOMS_E2E_API_URL: ${{ secrets.ATOMS_E2E_API_URL }}
-  ATOMS_E2E_ORG_ID: ${{ secrets.ATOMS_E2E_ORG_ID }}
-  ATOMS_E2E_OAUTH_CLIENT_ID_BOOKER_EMBED: ${{ secrets.ATOMS_E2E_OAUTH_CLIENT_ID_BOOKER_EMBED }}
-  ATOMS_E2E_APPLE_ID: ${{ secrets.ATOMS_E2E_APPLE_ID }}
-  ATOMS_E2E_APPLE_CONNECT_APP_SPECIFIC_PASSCODE: ${{ secrets.ATOMS_E2E_APPLE_CONNECT_APP_SPECIFIC_PASSCODE }}
+  ## api v2 env
+  ALLOWED_HOSTNAMES: ${{ vars.CI_ALLOWED_HOSTNAMES }}
+  API_KEY_PREFIX: ${{ secrets.CI_API_KEY_PREFIX }}
+  API_PORT: ${{ vars.CI_API_V2_PORT }}
+  CALCOM_LICENSE_KEY: ${{ secrets.CI_CALCOM_LICENSE_KEY }}
+  DAILY_API_KEY: ${{ secrets.CI_DAILY_API_KEY }}
+  DATABASE_READ_URL: ${{ secrets.CI_DATABASE_URL }}
+  DATABASE_WRITE_URL: ${{ secrets.CI_DATABASE_URL }}
+  GOOGLE_API_CREDENTIALS: ${{ secrets.CI_GOOGLE_API_CREDENTIALS }}
+  IS_E2E: true
+  CI: true
+  NEXTAUTH_SECRET: ${{ secrets.CI_NEXTAUTH_SECRET }}
+  NEXTAUTH_URL: ${{ secrets.CI_NEXTAUTH_URL }}
+  REDIS_URL: "redis://localhost:6379"
+  LINGO_DOT_DEV_API_KEY: ${{ secrets.CI_LINGO_DOT_DEV_API_KEY }}
+  STRIPE_PRIVATE_KEY: ${{ secrets.CI_STRIPE_PRIVATE_KEY }}
+  STRIPE_API_KEY: ${{ secrets.CI_STRIPE_PRIVATE_KEY }}
+  STRIPE_CLIENT_ID: ${{ secrets.CI_STRIPE_CLIENT_ID }}
+  STRIPE_WEBHOOK_SECRET: ${{ secrets.CI_STRIPE_WEBHOOK_SECRET }}
+  SLOTS_CACHE_TTL: ${{ secrets.CI_SLOTS_CACHE_TTL }}
+  NEXT_PUBLIC_VAPID_PUBLIC_KEY: ${{ secrets.NEXT_PUBLIC_VAPID_PUBLIC_KEY }}
+  VAPID_PRIVATE_KEY: ${{ secrets.VAPID_PRIVATE_KEY }}
+  JWT_SECRET: ${{ secrets.CI_JWT_SECRET }}
+  NODE_ENV: ${{ vars.CI_NODE_ENV }}
+
+  ## atoms e2e examples app env
+  ATOMS_E2E_OAUTH_CLIENT_ID_2025_12: ${{ secrets.ATOMS_E2E_OAUTH_CLIENT_ID_2025_12 }}
+  ATOMS_E2E_OAUTH_CLIENT_SECRET_2025_12: ${{ secrets.ATOMS_E2E_OAUTH_CLIENT_SECRET_2025_12 }}
+  ATOMS_E2E_API_URL_2025_12: ${{ secrets.ATOMS_E2E_API_URL_2025_12 }}
+  ATOMS_E2E_ORG_ID_2025_12: ${{ secrets.ATOMS_E2E_ORG_ID_2025_12 }}
+  ATOMS_E2E_OAUTH_CLIENT_ID_BOOKER_EMBED_2025_12: ${{ secrets.ATOMS_E2E_OAUTH_CLIENT_ID_BOOKER_EMBED_2025_12 }}
+  ATOMS_E2E_APPLE_ID_2025_12: ${{ secrets.ATOMS_E2E_APPLE_ID_2025_12 }}
+  ATOMS_E2E_APPLE_CONNECT_APP_SPECIFIC_PASSCODE_2025_12: ${{ secrets.ATOMS_E2E_APPLE_CONNECT_APP_SPECIFIC_PASSCODE_2025_12 }}
+
+  ## atoms e2e examples app env aliases for playwright
+  NEXT_PUBLIC_X_CAL_ID: ${{ secrets.ATOMS_E2E_OAUTH_CLIENT_ID_2025_12 }}
+  X_CAL_SECRET_KEY: ${{ secrets.ATOMS_E2E_OAUTH_CLIENT_SECRET_2025_12 }}
+  NEXT_PUBLIC_CALCOM_API_URL: ${{ secrets.ATOMS_E2E_API_URL_2025_12 }}
+
+  ## env variables needed for both api v2 and examples app
   DATABASE_DIRECT_URL: ${{ secrets.CI_DATABASE_URL }}
   DATABASE_URL: ${{ secrets.CI_DATABASE_URL }}
+  NODE_OPTIONS: --max-old-space-size=29000
+
+  ## seed script env variables
+  SEED_PLATFORM_OAUTH_CLIENT_ID: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_ID }}
+  SEED_PLATFORM_OAUTH_CLIENT_SECRET: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_SECRET }}
+  SEED_PLATFORM_OAUTH_CLIENT_ID_E2E: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_ID_E2E }}
+  SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E }}
 
 jobs:
   e2e-atoms:
+    if: ${{ github.event.pull_request.head.repo.full_name == github.repository }}
     timeout-minutes: 15
     name: E2E Atoms
-    runs-on: buildjet-4vcpu-ubuntu-2204
+    runs-on: buildjet-16vcpu-ubuntu-2204
+    services:
+      postgres:
+        image: postgres:13
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+        env:
+          POSTGRES_USER: postgres
+          POSTGRES_PASSWORD: postgres
+          POSTGRES_DB: calendso
+        options: >-
+          --health-cmd pg_isready
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
+        ports:
+          - 5432:5432
+      redis:
+        image: redis:latest
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+        ports:
+          - 6379:6379
+        options: >-
+          --health-cmd "redis-cli ping"
+          --health-interval 10s
+          --health-timeout 5s
+          --health-retries 5
     steps:
       - uses: docker/login-action@v3
         with:
@@ -31,10 +108,42 @@ jobs:
       - uses: actions/checkout@v4
       - uses: ./.github/actions/dangerous-git-checkout
       - uses: ./.github/actions/yarn-install
+      - uses: ./.github/actions/cache-db
+        with:
+          SEED_PLATFORM_OAUTH_CLIENT_ID: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_ID }}
+          SEED_PLATFORM_OAUTH_CLIENT_SECRET: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_SECRET }}
+          SEED_PLATFORM_OAUTH_CLIENT_ID_E2E: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_ID_E2E }}
+          SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E: ${{ secrets.SEED_PLATFORM_OAUTH_CLIENT_SECRET_E2E }}
       - uses: ./.github/actions/yarn-playwright-install
+      - name: Start API v2
+        working-directory: apps/api/v2
+        run: |
+          yarn dev:no-docker &
+          API_PID=$!
+          echo "API_PID=$API_PID" >> $GITHUB_ENV
+
+          # Wait for API to be ready
+          echo "Waiting for API v2 to be ready on port ${{ vars.CI_API_V2_PORT }}..."
+          timeout 300 bash -c 'until curl -f http://localhost:${{ vars.CI_API_V2_PORT }}/health > /dev/null 2>&1; do sleep 2; done'
+          echo "API v2 is ready!"
       - name: Run E2E Atoms Tests
         working-directory: packages/platform/examples/base
         run: yarn test:e2e
+      - name: Upload Atoms dist (entire folder)
+        uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: atoms-dist-${{ github.sha }}
+          path: packages/platform/atoms/dist
+          retention-days: 7
+          if-no-files-found: warn
+
+      - name: Stop API v2
+        if: always()
+        run: |
+          if [ ! -z "$API_PID" ]; then
+            kill $API_PID || true
+          fi
       - name: Upload Test Results
         uses: actions/upload-artifact@v4
         if: always()

apps/api/v2/src/modules/oauth-clients/controllers/oauth-client-users/oauth-client-users.controller.e2e-spec.ts

@@ -824,6 +824,11 @@ describe("OAuth Client Users Endpoints", () => {
       } catch (e) {
         console.log(e);
       }
+      try {
+        await userRepositoryFixture.delete(postResponseDataTwo.user.id);
+      } catch (e) {
+        // User might have been deleted by the test
+      }
       try {
         await userRepositoryFixture.delete(platformAdmin.id);
       } catch (e) {

packages/features/shell/SideBar.tsx

@@ -43,21 +43,31 @@ export type SideBarProps = {
 export function SideBarContainer({ bannersHeight, isPlatformUser = false }: SideBarContainerProps) {
   const { status, data } = useSession();
 
-  // Make sure that Sidebar is rendered optimistically so that a refresh of pages when logged in have SideBar from the beginning.
-  // This improves the experience of refresh on app store pages(when logged in) which are SSG.
-  // Though when logged out, app store pages would temporarily show SideBar until session status is confirmed.
+  // Render nothing once we know the user isn't authenticated.
   if (status !== "loading" && status !== "authenticated") return null;
   return <SideBar isPlatformUser={isPlatformUser} bannersHeight={bannersHeight} user={data?.user} />;
 }
 
+// Build a safe absolute public page URL, or empty string if we can't.
+const buildPublicPageUrl = (user?: UserAuth | null): string => {
+  const base =
+    getBookerBaseUrlSync(user?.org?.slug ?? null) ||
+    process.env.NEXT_PUBLIC_WEBAPP_URL ||
+    process.env.NEXTAUTH_URL ||
+    "";
+  const username = user?.orgAwareUsername;
+  if (!base || !username) return "";
+  return `${String(base).replace(/\/+$/, "")}/${username}`;
+};
+
 export function SideBar({ bannersHeight, user }: SideBarProps) {
   const session = useSession();
   const { t, isLocaleReady } = useLocale();
   const pathname = usePathname();
   const isPlatformPages = pathname?.startsWith("/settings/platform");
   const isAdmin = session.data?.user.role === UserPermissionRole.ADMIN;
 
-  const publicPageUrl = `${getBookerBaseUrlSync(user?.org?.slug ?? null)}/${user?.orgAwareUsername}`;
+  const publicPageUrl = buildPublicPageUrl(user);
 
   const bottomNavItems = useBottomNavItems({
     publicPageUrl,
@@ -112,19 +122,13 @@ export function SideBar({ bannersHeight, user }: SideBarProps) {
                 color="minimal"
                 onClick={() => window.history.back()}
                 className="todesktop:block hover:text-emphasis text-subtle group hidden text-sm font-medium">
-                <Icon
-                  name="arrow-left"
-                  className="group-hover:text-emphasis text-subtle h-4 w-4 shrink-0"
-                />
+                <Icon name="arrow-left" className="group-hover:text-emphasis text-subtle h-4 w-4 shrink-0" />
               </button>
               <button
                 color="minimal"
                 onClick={() => window.history.forward()}
                 className="todesktop:block hover:text-emphasis text-subtle group hidden text-sm font-medium">
-                <Icon
-                  name="arrow-right"
-                  className="group-hover:text-emphasis text-subtle h-4 w-4 shrink-0"
-                />
+                <Icon name="arrow-right" className="group-hover:text-emphasis text-subtle h-4 w-4 shrink-0" />
               </button>
               {!!user?.org && (
                 <div data-testid="user-dropdown-trigger" className="flex items-center">
@@ -134,10 +138,12 @@ export function SideBar({ bannersHeight, user }: SideBarProps) {
               <KBarTrigger />
             </div>
           </header>
+
           {/* logo icon for tablet */}
           <Link href="/event-types" className="text-center md:inline lg:hidden">
             <Logo small icon />
           </Link>
+
           <Navigation isPlatformNavigation={isPlatformPages} />
         </div>
 
@@ -146,21 +152,13 @@ export function SideBar({ bannersHeight, user }: SideBarProps) {
             <div className="overflow-hidden">
               <Tips />
             </div>
-            {bottomNavItems.map((item, index) => (
-              <Tooltip side="right" content={t(item.name)} className="lg:hidden" key={item.name}>
-                <ButtonOrLink
-                  id={item.name}
-                  href={item.href || undefined}
-                  aria-label={t(item.name)}
-                  target={item.target}
-                  className={classNames(
-                    "text-left",
-                    "[&[aria-current='page']]:bg-emphasis text-default justify-right group flex items-center rounded-md px-2 py-1.5 text-sm font-medium transition",
-                    "[&[aria-current='page']]:text-emphasis mt-0.5 w-full text-sm",
-                    isLocaleReady ? "hover:bg-emphasis hover:text-emphasis" : "",
-                    index === 0 && "mt-3"
-                  )}
-                  onClick={item.onClick}>
+
+            {bottomNavItems.map((item, index) => {
+              const isActionOnly = !item.href;
+              const isInternal = !!item.href && item.href.startsWith("/");
+
+              const content = (
+                <>
                   {!!item.icon && (
                     <Icon
                       name={item.isLoading ? "rotate-cw" : item.icon}
@@ -179,9 +177,52 @@ export function SideBar({ bannersHeight, user }: SideBarProps) {
                   ) : (
                     <SkeletonText className="h-[20px] w-full" />
                   )}
-                </ButtonOrLink>
-              </Tooltip>
-            ))}
+                </>
+              );
+
+              const commonClassName = classNames(
+                "text-left",
+                "[&[aria-current='page']]:bg-emphasis text-default justify-right group flex items-center rounded-md px-2 py-1.5 text-sm font-medium transition",
+                "[&[aria-current='page']]:text-emphasis mt-0.5 w-full text-sm",
+                isLocaleReady ? "hover:bg-emphasis hover:text-emphasis" : "",
+                index === 0 && "mt-3"
+              );
+
+              return (
+                <Tooltip side="right" content={t(item.name)} className="lg:hidden" key={item.name}>
+                  {isActionOnly ? (
+                    <button
+                      id={item.name}
+                      type="button"
+                      onClick={item.onClick}
+                      className={commonClassName}
+                      aria-label={t(item.name)}
+                      disabled={item.isLoading}>
+                      {content}
+                    </button>
+                  ) : isInternal ? (
+                    <Link
+                      href={item.href!}
+                      className={commonClassName}
+                      aria-label={t(item.name)}
+                      onClick={item.onClick}>
+                      {content}
+                    </Link>
+                  ) : (
+                    <ButtonOrLink
+                      id={item.name}
+                      href={item.href!} // external/absolute only
+                      target={item.target === "__blank" ? "_blank" : item.target}
+                      onClick={item.onClick}
+                      className={commonClassName}
+                      aria-label={t(item.name)}>
+                      {content}
+                    </ButtonOrLink>
+                  )}
+                </Tooltip>
+              );
+            })}
+
             {!IS_VISUAL_REGRESSION_TESTING && <Credits />}
           </div>
         )}

packages/platform/examples/base/.env.e2e.example

@@ -0,0 +1,10 @@
+NEXT_PUBLIC_X_CAL_ID=
+X_CAL_SECRET_KEY=
+NEXT_PUBLIC_CALCOM_API_URL=
+VITE_BOOKER_EMBED_OAUTH_CLIENT_ID=
+VITE_BOOKER_EMBED_API_URL=
+ORGANIZATION_ID=
+ATOMS_E2E_APPLE_ID=
+ATOMS_E2E_APPLE_CONNECT_APP_SPECIFIC_PASSCODE=
+NEXT_PUBLIC_IS_E2E="1"
+NODE_ENV="test"