v3.8.2

* chore: Add extra logging for no available users error

* Changed warn to info

.env.example

@@ -23,6 +23,9 @@ CALCOM_LICENSE_KEY=
 
 # - DATABASE ************************************************************************************************
 DATABASE_URL="postgresql://postgres:@localhost:5450/calendso"
+# Needed to run migrations while using a connection pooler like PgBouncer
+# Use the same one as DATABASE_URL if you're not using a connection pooler
+DATABASE_DIRECT_URL="postgresql://postgres:@localhost:5450/calendso"
 UPSTASH_REDIS_REST_URL=
 UPSTASH_REDIS_REST_TOKEN=
 INSIGHTS_DATABASE_URL=
@@ -134,8 +137,8 @@ NEXT_PUBLIC_SENDGRID_SENDER_NAME=
 NEXT_PUBLIC_SENTRY_DSN=
 
 # Formbricks Experience Management Integration
-FORMBRICKS_HOST_URL=https://app.formbricks.com
-FORMBRICKS_ENVIRONMENT_ID=
+NEXT_PUBLIC_FORMBRICKS_HOST_URL=https://app.formbricks.com
+NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID=
 FORMBRICKS_FEEDBACK_SURVEY_ID=
 
 # AvatarAPI

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

@@ -18,6 +18,7 @@ runs:
         key-1: ${{ hashFiles('packages/prisma/schema.prisma', 'packages/prisma/migrations/**/**.sql', 'packages/prisma/*.ts') }}
         key-2: ${{ github.event.pull_request.number || github.ref }}
         DATABASE_URL: ${{ inputs.DATABASE_URL }}
+        DATABASE_DIRECT_URL: ${{ inputs.DATABASE_URL }}
         E2E_TEST_CALCOM_QA_EMAIL: ${{ inputs.E2E_TEST_CALCOM_QA_EMAIL }}
         E2E_TEST_CALCOM_QA_PASSWORD: ${{ inputs.E2E_TEST_CALCOM_QA_PASSWORD }}
         E2E_TEST_CALCOM_QA_GCAL_CREDENTIALS: ${{ inputs.E2E_TEST_CALCOM_QA_GCAL_CREDENTIALS }}

.github/workflows/e2e-app-store.yml

@@ -11,6 +11,9 @@ jobs:
     services:
       postgres:
         image: postgres:12.1
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
         env:
           POSTGRES_USER: postgres
           POSTGRES_DB: calendso
@@ -18,6 +21,9 @@ jobs:
           - 5432:5432
       mailhog:
         image: mailhog/mailhog:v1.0.1
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
         ports:
           - 8025:8025
           - 1025:1025
@@ -39,6 +45,7 @@ jobs:
       - uses: ./.github/actions/cache-db
         env:
           DATABASE_URL: ${{ secrets.CI_DATABASE_URL }}
+          DATABASE_DIRECT_URL: ${{ secrets.CI_DATABASE_URL }}
           E2E_TEST_CALCOM_QA_EMAIL: ${{ secrets.E2E_TEST_CALCOM_QA_EMAIL }}
           E2E_TEST_CALCOM_QA_PASSWORD: ${{ secrets.E2E_TEST_CALCOM_QA_PASSWORD }}
           E2E_TEST_CALCOM_QA_GCAL_CREDENTIALS: ${{ secrets.E2E_TEST_CALCOM_QA_GCAL_CREDENTIALS }}
@@ -50,6 +57,7 @@ jobs:
           ALLOWED_HOSTNAMES: ${{ vars.CI_ALLOWED_HOSTNAMES }}
           CALENDSO_ENCRYPTION_KEY: ${{ secrets.CI_CALENDSO_ENCRYPTION_KEY }}
           DATABASE_URL: ${{ secrets.CI_DATABASE_URL }}
+          DATABASE_DIRECT_URL: ${{ secrets.CI_DATABASE_URL }}
           DEPLOYSENTINEL_API_KEY: ${{ secrets.DEPLOYSENTINEL_API_KEY }}
           E2E_TEST_APPLE_CALENDAR_EMAIL: ${{ secrets.E2E_TEST_APPLE_CALENDAR_EMAIL }}
           E2E_TEST_APPLE_CALENDAR_PASSWORD: ${{ secrets.E2E_TEST_APPLE_CALENDAR_PASSWORD }}

.github/workflows/e2e-embed-react.yml

@@ -11,6 +11,9 @@ jobs:
     services:
       postgres:
         image: postgres:12.1
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
         env:
           POSTGRES_USER: postgres
           POSTGRES_DB: calendso
@@ -41,6 +44,7 @@ jobs:
           ALLOWED_HOSTNAMES: ${{ vars.CI_ALLOWED_HOSTNAMES }}
           CALENDSO_ENCRYPTION_KEY: ${{ secrets.CI_CALENDSO_ENCRYPTION_KEY }}
           DATABASE_URL: ${{ secrets.CI_DATABASE_URL }}
+          DATABASE_DIRECT_URL: ${{ secrets.CI_DATABASE_URL }}
           DEPLOYSENTINEL_API_KEY: ${{ secrets.DEPLOYSENTINEL_API_KEY }}
           E2E_TEST_APPLE_CALENDAR_EMAIL: ${{ secrets.E2E_TEST_APPLE_CALENDAR_EMAIL }}
           E2E_TEST_APPLE_CALENDAR_PASSWORD: ${{ secrets.E2E_TEST_APPLE_CALENDAR_PASSWORD }}

.github/workflows/e2e-embed.yml

@@ -11,6 +11,9 @@ jobs:
     services:
       postgres:
         image: postgres:12.1
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
         env:
           POSTGRES_USER: postgres
           POSTGRES_DB: calendso
@@ -18,6 +21,9 @@ jobs:
           - 5432:5432
       mailhog:
         image: mailhog/mailhog:v1.0.1
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
         ports:
           - 8025:8025
           - 1025:1025
@@ -44,6 +50,7 @@ jobs:
           ALLOWED_HOSTNAMES: ${{ vars.CI_ALLOWED_HOSTNAMES }}
           CALENDSO_ENCRYPTION_KEY: ${{ secrets.CI_CALENDSO_ENCRYPTION_KEY }}
           DATABASE_URL: ${{ secrets.CI_DATABASE_URL }}
+          DATABASE_DIRECT_URL: ${{ secrets.CI_DATABASE_URL }}
           DEPLOYSENTINEL_API_KEY: ${{ secrets.DEPLOYSENTINEL_API_KEY }}
           E2E_TEST_APPLE_CALENDAR_EMAIL: ${{ secrets.E2E_TEST_APPLE_CALENDAR_EMAIL }}
           E2E_TEST_APPLE_CALENDAR_PASSWORD: ${{ secrets.E2E_TEST_APPLE_CALENDAR_PASSWORD }}

.github/workflows/e2e.yml

@@ -11,6 +11,9 @@ jobs:
     services:
       postgres:
         image: postgres:12.1
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
         env:
           POSTGRES_USER: postgres
           POSTGRES_DB: calendso
@@ -18,6 +21,9 @@ jobs:
           - 5432:5432
       mailhog:
         image: mailhog/mailhog:v1.0.1
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
         ports:
           - 8025:8025
           - 1025:1025
@@ -42,6 +48,7 @@ jobs:
           ALLOWED_HOSTNAMES: ${{ vars.CI_ALLOWED_HOSTNAMES }}
           CALENDSO_ENCRYPTION_KEY: ${{ secrets.CI_CALENDSO_ENCRYPTION_KEY }}
           DATABASE_URL: ${{ secrets.CI_DATABASE_URL }}
+          DATABASE_DIRECT_URL: ${{ secrets.CI_DATABASE_URL }}
           DEPLOYSENTINEL_API_KEY: ${{ secrets.DEPLOYSENTINEL_API_KEY }}
           E2E_TEST_APPLE_CALENDAR_EMAIL: ${{ secrets.E2E_TEST_APPLE_CALENDAR_EMAIL }}
           E2E_TEST_APPLE_CALENDAR_PASSWORD: ${{ secrets.E2E_TEST_APPLE_CALENDAR_PASSWORD }}

.github/workflows/labeler.yml

@@ -28,7 +28,7 @@ jobs:
         with:
           repo-token: ${{ secrets.EQUITY_BEE_TEAM_LABELER_ACTION_TOKEN }}
           organization-name: calcom
-          ignore-labels: "admin, app-store, ai, authentication, automated-testing, devops, platform, billing, bookings, caldav, calendar-apps, ci, console, crm-apps, docs, documentation, emails, embeds, event-types, i18n, impersonation, manual-testing, ui, performance, ops-stack, organizations, public-api, routing-forms, seats, teams, webhooks, workflows, zapier"
+          ignore-labels: "admin, app-store, ai, authentication, automated-testing, devops, billing, bookings, caldav, calendar-apps, ci, console, crm-apps, docs, documentation, emails, embeds, event-types, i18n, impersonation, manual-testing, ui, performance, ops-stack, organizations, public-api, routing-forms, seats, teams, webhooks, workflows, zapier"
   apply-labels-from-issue:
     runs-on: ubuntu-latest
 

.github/workflows/production-build-without-database.yml

@@ -7,6 +7,7 @@ env:
   ALLOWED_HOSTNAMES: ${{ vars.CI_ALLOWED_HOSTNAMES }}
   CALENDSO_ENCRYPTION_KEY: ${{ secrets.CI_CALENDSO_ENCRYPTION_KEY }}
   DATABASE_URL: ${{ secrets.CI_DATABASE_URL }}
+  DATABASE_DIRECT_URL: ${{ secrets.CI_DATABASE_URL }}
   E2E_TEST_APPLE_CALENDAR_EMAIL: ${{ secrets.E2E_TEST_APPLE_CALENDAR_EMAIL }}
   E2E_TEST_APPLE_CALENDAR_PASSWORD: ${{ secrets.E2E_TEST_APPLE_CALENDAR_PASSWORD }}
   GOOGLE_API_CREDENTIALS: ${{ secrets.CI_GOOGLE_API_CREDENTIALS }}

.github/workflows/production-build.yml

@@ -7,6 +7,7 @@ env:
   ALLOWED_HOSTNAMES: ${{ vars.CI_ALLOWED_HOSTNAMES }}
   CALENDSO_ENCRYPTION_KEY: ${{ secrets.CI_CALENDSO_ENCRYPTION_KEY }}
   DATABASE_URL: ${{ secrets.CI_DATABASE_URL }}
+  DATABASE_DIRECT_URL: ${{ secrets.CI_DATABASE_URL }}
   E2E_TEST_APPLE_CALENDAR_EMAIL: ${{ secrets.E2E_TEST_APPLE_CALENDAR_EMAIL }}
   E2E_TEST_APPLE_CALENDAR_PASSWORD: ${{ secrets.E2E_TEST_APPLE_CALENDAR_PASSWORD }}
   E2E_TEST_CALCOM_QA_EMAIL: ${{ secrets.E2E_TEST_CALCOM_QA_EMAIL }}
@@ -41,6 +42,9 @@ jobs:
     services:
       postgres:
         image: postgres:12.1
+        credentials:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
         env:
           POSTGRES_USER: postgres
           POSTGRES_DB: calendso

.snaplet/transform.ts

@@ -1,9 +1,10 @@
-// This transform config was generated by Snaplet.
-// Snaplet found fields that may contain personally identifiable information (PII)
-// and used that to populate this file.
+// eslint-disable-next-line @typescript-eslint/triple-slash-reference
+/// <reference path=".snaplet/snaplet.d.ts" />
+// This config was generated by Snaplet make sure to check it over before using it.
 import { copycat as c } from "@snaplet/copycat";
+import { defineConfig } from "snaplet";
 
-import type { Transform } from "./structure";
+// c.setHashKey(REPLACE_ME_WITH_YOUR_HASH_KEY);
 
 function hasStringProp<T extends string>(x: unknown, key: T): x is { [key in T]: string } {
   return !!x && typeof x === "object" && key in x;
@@ -41,57 +42,226 @@ function replaceSensitiveKeys(record: object) {
 
 const generateUsername = (x: string) => `${c.firstName(x)}-${c.lastName(x)}${c.int(x, { min: 2, max: 99 })}`;
 
-const config: Transform = () => ({
-  public: {
-    ApiKey: ({ row }) => ({
-      hashedKey: c.uuid(row.hashedKey),
-    }),
-    App: ({ row }) => ({
-      keys: replaceSensitiveKeys(row.keys),
-    }),
-    Attendee: ({ row }) => ({
-      email: c.email(row.email),
-      name: c.fullName(row.name),
-      timeZone: c.timezone(row.timeZone),
-    }),
-    Credential: ({ row }) => ({
-      key: typeof row.key === "string" ? c.uuid(row.key) : replaceSensitiveKeys(row.key),
-    }),
-    EventType: ({ row }) => ({
-      slug: generateSlug(row.slug),
-      timeZone: c.timezone(row.timeZone),
-      eventName: c.words(row.eventName, { max: 3 }),
-    }),
-    ResetPasswordRequest: ({ row }) => ({
-      email: c.email(row.email),
-    }),
-    Schedule: ({ row }) => ({
-      timeZone: c.timezone(row.timeZone),
-    }),
-    Team: ({ row }) => ({
-      bio: c.sentence(row.bio),
-      name: c.words(row.name, { max: 2 }),
-      slug: generateSlug(row.slug),
-    }),
-    users: ({ row }) =>
-      row.role !== "ADMIN"
-        ? {
-            bio: c.sentence(row.bio),
-            email: c.email(row.email),
-            name: c.fullName(row.name),
-            password: c.password(row.password),
-            timeZone: c.timezone(row.timeZone),
-            username: generateUsername(row.username),
-          }
-        : row,
-    VerificationToken: ({ row }) => ({
-      token: c.uuid(row.token),
-    }),
-    Account: ({ row }) => ({
-      access_token: c.uuid(row.access_token),
-      refresh_token: c.uuid(row.refresh_token),
-    }),
+export default defineConfig({
+  transform: {
+    $mode: "unsafe",
+    public: {
+      Account({ row }) {
+        return {
+          refresh_token: c.uuid(row.refresh_token),
+          access_token: c.uuid(row.access_token),
+          expires_at: c.int(row.expires_at, {
+            min: 0,
+            max: Math.pow(4, 8) - 1,
+          }),
+          token_type: c.uuid(row.token_type),
+          id_token: c.uuid(row.id_token),
+        };
+      },
+      ApiKey: ({ row }) => ({
+        hashedKey: c.uuid(row.hashedKey),
+        note: c.fullName(row.note),
+        createdAt: c.dateString(row.createdAt, {
+          minYear: 2020,
+        }),
+      }),
+      App: ({ row }) => ({
+        keys: replaceSensitiveKeys(row.keys),
+      }),
+      App_RoutingForms_Form({ row }) {
+        return {
+          name: c.fullName(row.name),
+        };
+      },
+      Attendee: ({ row }) => ({
+        email: c.email(row.email),
+        name: c.fullName(row.name),
+        timeZone: c.timezone(row.timeZone),
+        locale: c.fullName(row.locale),
+      }),
+      Availability({ row }) {
+        return {
+          startTime: c
+            .dateString(row.startTime, {
+              minYear: 2020,
+            })
+            .slice(11, 19),
+          endTime: c
+            .dateString(row.endTime, {
+              minYear: 2020,
+            })
+            .slice(11, 19),
+        };
+      },
+      Booking({ row }) {
+        return {
+          title: c.fullName(row.title),
+          startTime: c.dateString(row.startTime, {
+            minYear: 2020,
+          }),
+          endTime: c.dateString(row.endTime, {
+            minYear: 2020,
+          }),
+          location: c.sentence(row.location),
+          metadata: {
+            [c.word(row.metadata)]: c.words(row.metadata),
+          },
+        };
+      },
+      Credential: ({ row }) => ({
+        key: typeof row.key === "string" ? c.uuid(row.key) : replaceSensitiveKeys(row.key),
+      }),
+      EventType: ({ row }) => ({
+        slug: generateSlug(row.slug),
+        timeZone: c.timezone(row.timeZone),
+        eventName: c.words(row.eventName, { max: 3 }),
+        currency: c.sentence(row.currency),
+      }),
+      EventTypeCustomInput({ row }) {
+        return {
+          label: c.fullName(row.label),
+        };
+      },
+      Feature({ row }) {
+        return {
+          slug: c.uuid(row.slug),
+        };
+      },
+      InstantMeetingToken({ row }) {
+        return {
+          token: c.uuid(row.token),
+        };
+      },
+      OAuthClient({ row }) {
+        return {
+          name: c.fullName(row.name),
+        };
+      },
+      OutOfOfficeEntry({ row }) {
+        return {
+          start: c.dateString(row.start, {
+            minYear: 2020,
+          }),
+        };
+      },
+      Payment({ row }) {
+        return {
+          amount: c.int(row.amount, {
+            min: 0,
+            max: Math.pow(4, 8) - 1,
+          }),
+          currency: c.sentence(row.currency),
+          data: {
+            [c.word(row.data)]: c.words(row.data),
+          },
+        };
+      },
+      ResetPasswordRequest: ({ row }) => ({
+        email: c.email(row.email),
+      }),
+      Schedule: ({ row }) => ({
+        name: c.fullName(row.name),
+        timeZone: c.timezone(row.timeZone),
+      }),
+      Session({ row }) {
+        return {
+          sessionToken: c.uuid(row.sessionToken),
+        };
+      },
+      Team: ({ row }) => ({
+        bio: c.sentence(row.bio),
+        name: c.words(row.name, { max: 2 }),
+        slug: generateSlug(row.slug),
+        timeZone: c.timezone(row.timeZone),
+        logoUrl: c.username(row.logoUrl),
+      }),
+      TempOrgRedirect({ row }) {
+        return {
+          from: c.dateString(row.from, {
+            maxYear: 1999,
+          }),
+          toUrl: c.city(row.toUrl),
+        };
+      },
+      VerificationToken({ row }) {
+        return {
+          id: c
+            .int(row.id, {
+              min: 1,
+              max: Math.pow(4, 8) - 1,
+            })
+            .toString(),
+          identifier: c.uuid(row.identifier),
+          token: c.uuid(row.token),
+          expires: c.dateString(row.expires, {
+            minYear: 2020,
+          }),
+        };
+      },
+      VerifiedNumber({ row }) {
+        return {
+          phoneNumber: c.phoneNumber(row.phoneNumber),
+        };
+      },
+      Webhook({ row }) {
+        return {
+          subscriberUrl: c.url(row.subscriberUrl),
+          secret: c.streetAddress(row.secret),
+        };
+      },
+      WebhookScheduledTriggers({ row }) {
+        return {
+          jobName: c.fullName(row.jobName),
+          payload: c.password(row.payload),
+        };
+      },
+      WorkflowStep({ row }) {
+        return {
+          sendTo: c.oneOf(row.sendTo, [
+            "Man",
+            "Woman",
+            "Transgender",
+            "Non-binary/non-conforming",
+            "Not specified",
+          ]),
+          sender: c.oneOf(row.sender, [
+            "Man",
+            "Woman",
+            "Transgender",
+            "Non-binary/non-conforming",
+            "Not specified",
+          ]),
+        };
+      },
+      users: ({ row }) =>
+        row.role !== "ADMIN"
+          ? {
+              bio: c.sentence(row.bio),
+              email: c.email(row.email),
+              name: c.fullName(row.name),
+              password: c.password(row.password),
+              timeZone: c.timezone(row.timeZone),
+              username: generateUsername(row.username),
+              metadata: {
+                [c.word(row.metadata)]: c.words(row.metadata),
+              },
+            }
+          : row,
+    },
+  },
+  subset: {
+    enabled: true,
+    version: "3",
+    targets: [
+      {
+        table: "public.users",
+        rowLimit: 100,
+      },
+    ],
+    keepDisconnectedTables: false,
+    followNullableRelations: true,
+    maxCyclesLoop: 0,
+    eager: false,
+    taskSortAlgorithm: "children",
   },
 });
-
-export default config;

.well-known/security.txt

@@ -0,0 +1,4 @@
+Contact: security@cal.com
+Preferred-Languages: en
+Canonical: https://cal.com/.well-known/security.txt
+Policy: https://github.com/calcom/cal.com/security/policy

.yarn/patches/dayjs-npm-1.11.2-644b12fe04.patch

@@ -0,0 +1,8 @@
+diff --git a/plugin/timezone.js b/plugin/timezone.js
+index fb6112a96f03f53ba78162ac323dce17f635161d..991e4e5410a32f5a69cb6e0e9476a9c529657aae 100644
+--- a/plugin/timezone.js
++++ b/plugin/timezone.js
+@@ -1 +1 @@
+-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs_plugin_timezone=e()}(this,(function(){"use strict";var t={year:0,month:1,day:2,hour:3,minute:4,second:5},e={};return function(n,i,o){var r,a=function(t,n,i){void 0===i&&(i={});var o=new Date(t),r=function(t,n){void 0===n&&(n={});var i=n.timeZoneName||"short",o=t+"|"+i,r=e[o];return r||(r=new Intl.DateTimeFormat("en-US",{hour12:!1,timeZone:t,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit",timeZoneName:i}),e[o]=r),r}(n,i);return r.formatToParts(o)},u=function(e,n){for(var i=a(e,n),r=[],u=0;u<i.length;u+=1){var f=i[u],s=f.type,m=f.value,c=t[s];c>=0&&(r[c]=parseInt(m,10))}var d=r[3],l=24===d?0:d,v=r[0]+"-"+r[1]+"-"+r[2]+" "+l+":"+r[4]+":"+r[5]+":000",h=+e;return(o.utc(v).valueOf()-(h-=h%1e3))/6e4},f=i.prototype;f.tz=function(t,e){void 0===t&&(t=r);var n=this.utcOffset(),i=this.toDate(),a=i.toLocaleString("en-US",{timeZone:t}),u=Math.round((i-new Date(a))/1e3/60),f=o(a).$set("millisecond",this.$ms).utcOffset(15*-Math.round(i.getTimezoneOffset()/15)-u,!0);if(e){var s=f.utcOffset();f=f.add(n-s,"minute")}return f.$x.$timezone=t,f},f.offsetName=function(t){var e=this.$x.$timezone||o.tz.guess(),n=a(this.valueOf(),e,{timeZoneName:t}).find((function(t){return"timezonename"===t.type.toLowerCase()}));return n&&n.value};var s=f.startOf;f.startOf=function(t,e){if(!this.$x||!this.$x.$timezone)return s.call(this,t,e);var n=o(this.format("YYYY-MM-DD HH:mm:ss:SSS"));return s.call(n,t,e).tz(this.$x.$timezone,!0)},o.tz=function(t,e,n){var i=n&&e,a=n||e||r,f=u(+o(),a);if("string"!=typeof t)return o(t).tz(a);var s=function(t,e,n){var i=t-60*e*1e3,o=u(i,n);if(e===o)return[i,e];var r=u(i-=60*(o-e)*1e3,n);return o===r?[i,o]:[t-60*Math.min(o,r)*1e3,Math.max(o,r)]}(o.utc(t,i).valueOf(),f,a),m=s[0],c=s[1],d=o(m).utcOffset(c);return d.$x.$timezone=a,d},o.tz.guess=function(){return Intl.DateTimeFormat().resolvedOptions().timeZone},o.tz.setDefault=function(t){r=t}}}));
+\ No newline at end of file
++!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs_plugin_timezone=e()}(this,(function(){"use strict";function t(){return t=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},t.apply(this,arguments)}var e={year:0,month:1,day:2,hour:3,minute:4,second:5},n={year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"},i={},r={};return function(o,a,u){var f,s=function(e,r,o){void 0===o&&(o={});var a=new Date(e),u=function(e,r){void 0===r&&(r={});var o=r.timeZoneName||"short",a=e+"|"+o,u=i[a];return u||(u=new Intl.DateTimeFormat("en-US",t({},n,{hour12:!1,timeZone:e,timeZoneName:o})),i[a]=u),u}(r,o);return u.formatToParts(a)},m=function(t,n){for(var i=s(t,n),r=[],o=0;o<i.length;o+=1){var a=i[o],f=a.type,m=a.value,c=e[f];c>=0&&(r[c]=parseInt(m,10))}var l=r[3],d=24===l?0:l,h=r[0]+"-"+r[1]+"-"+r[2]+" "+d+":"+r[4]+":"+r[5]+":000",v=+t;return(u.utc(h).valueOf()-(v-=v%1e3))/6e4},c=a.prototype;c.tz=function(e,i){void 0===e&&(e=f);var o=this.utcOffset(),a=this.toDate(),s=function(e){var i=r[e];return i||(i=new Intl.DateTimeFormat("en-US",t({},n,{timeZone:e})),r[e]=i),i}(e).format(a),m=Math.round((a-new Date(s))/1e3/60),c=u(s,{locale:this.$L}).$set("millisecond",this.$ms).utcOffset(15*-Math.round(a.getTimezoneOffset()/15)-m,!0);if(i){var l=c.utcOffset();c=c.add(o-l,"minute")}return c.$x.$timezone=e,c},c.offsetName=function(t){var e=this.$x.$timezone||u.tz.guess(),n=s(this.valueOf(),e,{timeZoneName:t}).find((function(t){return"timezonename"===t.type.toLowerCase()}));return n&&n.value};var l=c.startOf;c.startOf=function(t,e){if(!this.$x||!this.$x.$timezone)return l.call(this,t,e);var n=u(this.format("YYYY-MM-DD HH:mm:ss:SSS"),{locale:this.$L});return l.call(n,t,e).tz(this.$x.$timezone,!0)},u.tz=function(t,e,n){var i=n&&e,r=n||e||f,o=m(+u(),r);if("string"!=typeof t)return u(t).tz(r);var a=function(t,e,n){var i=t-60*e*1e3,r=m(i,n);if(e===r)return[i,e];var o=m(i-=60*(r-e)*1e3,n);return r===o?[i,r]:[t-60*Math.min(r,o)*1e3,Math.max(r,o)]}(u.utc(t,i).valueOf(),o,r),s=a[0],c=a[1],l=u(s).utcOffset(c);return l.$x.$timezone=r,l},u.tz.guess=function(){return Intl.DateTimeFormat().resolvedOptions().timeZone},u.tz.setDefault=function(t){f=t}}}));

.yarn/patches/dayjs-npm-1.11.4-97921cd375.patch

@@ -0,0 +1,8 @@
+diff --git a/plugin/timezone.js b/plugin/timezone.js
+index fb6112a96f03f53ba78162ac323dce17f635161d..991e4e5410a32f5a69cb6e0e9476a9c529657aae 100644
+--- a/plugin/timezone.js
++++ b/plugin/timezone.js
+@@ -1 +1 @@
+-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs_plugin_timezone=e()}(this,(function(){"use strict";var t={year:0,month:1,day:2,hour:3,minute:4,second:5},e={};return function(n,i,o){var r,a=function(t,n,i){void 0===i&&(i={});var o=new Date(t),r=function(t,n){void 0===n&&(n={});var i=n.timeZoneName||"short",o=t+"|"+i,r=e[o];return r||(r=new Intl.DateTimeFormat("en-US",{hour12:!1,timeZone:t,year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit",timeZoneName:i}),e[o]=r),r}(n,i);return r.formatToParts(o)},u=function(e,n){for(var i=a(e,n),r=[],u=0;u<i.length;u+=1){var f=i[u],s=f.type,m=f.value,c=t[s];c>=0&&(r[c]=parseInt(m,10))}var d=r[3],l=24===d?0:d,v=r[0]+"-"+r[1]+"-"+r[2]+" "+l+":"+r[4]+":"+r[5]+":000",h=+e;return(o.utc(v).valueOf()-(h-=h%1e3))/6e4},f=i.prototype;f.tz=function(t,e){void 0===t&&(t=r);var n=this.utcOffset(),i=this.toDate(),a=i.toLocaleString("en-US",{timeZone:t}),u=Math.round((i-new Date(a))/1e3/60),f=o(a).$set("millisecond",this.$ms).utcOffset(15*-Math.round(i.getTimezoneOffset()/15)-u,!0);if(e){var s=f.utcOffset();f=f.add(n-s,"minute")}return f.$x.$timezone=t,f},f.offsetName=function(t){var e=this.$x.$timezone||o.tz.guess(),n=a(this.valueOf(),e,{timeZoneName:t}).find((function(t){return"timezonename"===t.type.toLowerCase()}));return n&&n.value};var s=f.startOf;f.startOf=function(t,e){if(!this.$x||!this.$x.$timezone)return s.call(this,t,e);var n=o(this.format("YYYY-MM-DD HH:mm:ss:SSS"));return s.call(n,t,e).tz(this.$x.$timezone,!0)},o.tz=function(t,e,n){var i=n&&e,a=n||e||r,f=u(+o(),a);if("string"!=typeof t)return o(t).tz(a);var s=function(t,e,n){var i=t-60*e*1e3,o=u(i,n);if(e===o)return[i,e];var r=u(i-=60*(o-e)*1e3,n);return o===r?[i,o]:[t-60*Math.min(o,r)*1e3,Math.max(o,r)]}(o.utc(t,i).valueOf(),f,a),m=s[0],c=s[1],d=o(m).utcOffset(c);return d.$x.$timezone=a,d},o.tz.guess=function(){return Intl.DateTimeFormat().resolvedOptions().timeZone},o.tz.setDefault=function(t){r=t}}}));
+\ No newline at end of file
++!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs_plugin_timezone=e()}(this,(function(){"use strict";function t(){return t=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var i in n)Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i])}return t},t.apply(this,arguments)}var e={year:0,month:1,day:2,hour:3,minute:4,second:5},n={year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"},i={},r={};return function(o,a,u){var f,s=function(e,r,o){void 0===o&&(o={});var a=new Date(e),u=function(e,r){void 0===r&&(r={});var o=r.timeZoneName||"short",a=e+"|"+o,u=i[a];return u||(u=new Intl.DateTimeFormat("en-US",t({},n,{hour12:!1,timeZone:e,timeZoneName:o})),i[a]=u),u}(r,o);return u.formatToParts(a)},m=function(t,n){for(var i=s(t,n),r=[],o=0;o<i.length;o+=1){var a=i[o],f=a.type,m=a.value,c=e[f];c>=0&&(r[c]=parseInt(m,10))}var l=r[3],d=24===l?0:l,h=r[0]+"-"+r[1]+"-"+r[2]+" "+d+":"+r[4]+":"+r[5]+":000",v=+t;return(u.utc(h).valueOf()-(v-=v%1e3))/6e4},c=a.prototype;c.tz=function(e,i){void 0===e&&(e=f);var o=this.utcOffset(),a=this.toDate(),s=function(e){var i=r[e];return i||(i=new Intl.DateTimeFormat("en-US",t({},n,{timeZone:e})),r[e]=i),i}(e).format(a),m=Math.round((a-new Date(s))/1e3/60),c=u(s,{locale:this.$L}).$set("millisecond",this.$ms).utcOffset(15*-Math.round(a.getTimezoneOffset()/15)-m,!0);if(i){var l=c.utcOffset();c=c.add(o-l,"minute")}return c.$x.$timezone=e,c},c.offsetName=function(t){var e=this.$x.$timezone||u.tz.guess(),n=s(this.valueOf(),e,{timeZoneName:t}).find((function(t){return"timezonename"===t.type.toLowerCase()}));return n&&n.value};var l=c.startOf;c.startOf=function(t,e){if(!this.$x||!this.$x.$timezone)return l.call(this,t,e);var n=u(this.format("YYYY-MM-DD HH:mm:ss:SSS"),{locale:this.$L});return l.call(n,t,e).tz(this.$x.$timezone,!0)},u.tz=function(t,e,n){var i=n&&e,r=n||e||f,o=m(+u(),r);if("string"!=typeof t)return u(t).tz(r);var a=function(t,e,n){var i=t-60*e*1e3,r=m(i,n);if(e===r)return[i,e];var o=m(i-=60*(r-e)*1e3,n);return r===o?[i,r]:[t-60*Math.min(r,o)*1e3,Math.max(r,o)]}(u.utc(t,i).valueOf(),o,r),s=a[0],c=a[1],l=u(s).utcOffset(c);return l.$x.$timezone=r,l},u.tz.guess=function(){return Intl.DateTimeFormat().resolvedOptions().timeZone},u.tz.setDefault=function(t){f=t}}}));

__checks__/organization.spec.ts

@@ -8,14 +8,14 @@ test.describe("Org", () => {
       const response = await page.goto("https://i.cal.com/embed");
       expect(response?.status()).toBe(200);
       await page.screenshot({ path: "screenshot.jpg" });
-      await expectPageToBeServerSideRendered(page);
+      await expectPageToBeRenderedWithEmbedSsr(page);
     });
 
     test("Org User(Peer) Page should be embeddable", async ({ page }) => {
       const response = await page.goto("https://i.cal.com/peer/embed");
       expect(response?.status()).toBe(200);
       await expect(page.locator("text=Peer Richelsen")).toBeVisible();
-      await expectPageToBeServerSideRendered(page);
+      await expectPageToBeRenderedWithEmbedSsr(page);
     });
 
     test("Org User Event(peer/meet) Page should be embeddable", async ({ page }) => {
@@ -23,14 +23,14 @@ test.describe("Org", () => {
       expect(response?.status()).toBe(200);
       await expect(page.locator('[data-testid="decrementMonth"]')).toBeVisible();
       await expect(page.locator('[data-testid="incrementMonth"]')).toBeVisible();
-      await expectPageToBeServerSideRendered(page);
+      await expectPageToBeRenderedWithEmbedSsr(page);
     });
 
     test("Org Team Profile(/sales) page should be embeddable", async ({ page }) => {
       const response = await page.goto("https://i.cal.com/sales/embed");
       expect(response?.status()).toBe(200);
       await expect(page.locator("text=Cal.com Sales")).toBeVisible();
-      await expectPageToBeServerSideRendered(page);
+      await expectPageToBeRenderedWithEmbedSsr(page);
     });
 
     test("Org Team Event page(/sales/hippa) should be embeddable", async ({ page }) => {
@@ -38,9 +38,10 @@ test.describe("Org", () => {
       expect(response?.status()).toBe(200);
       await expect(page.locator('[data-testid="decrementMonth"]')).toBeVisible();
       await expect(page.locator('[data-testid="incrementMonth"]')).toBeVisible();
-      await expectPageToBeServerSideRendered(page);
+      await expectPageToBeRenderedWithEmbedSsr(page);
     });
   });
+
   test.describe("Dynamic Group Booking", () => {
     test("Dynamic Group booking link should load", async ({ page }) => {
       const users = [
@@ -63,12 +64,39 @@ test.describe("Org", () => {
       expect((await page.locator('[data-testid="event-meta"] [data-testid="avatar"]').all()).length).toBe(3);
     });
   });
+
+  test("Organization Homepage - Has Engineering and Marketing Teams", async ({ page }) => {
+    const response = await page.goto("https://i.cal.com");
+    expect(response?.status()).toBe(200);
+    await expect(page.locator("text=Cal.com")).toBeVisible();
+    await expect(page.locator("text=Engineering")).toBeVisible();
+    await expect(page.locator("text=Marketing")).toBeVisible();
+  });
+
+  test.describe("Browse the Engineering Team", async () => {
+    test("By User Navigation", async ({ page }) => {
+      await page.goto("https://i.cal.com");
+      await page.click('text="Engineering"');
+      await expect(page.locator("text=Cal.com Engineering")).toBeVisible();
+    });
+
+    test("By /team/engineering", async ({ page }) => {
+      await page.goto("https://i.cal.com/team/engineering");
+      await expect(page.locator("text=Cal.com Engineering")).toBeVisible();
+    });
+
+    test("By /engineering", async ({ page }) => {
+      await page.goto("https://i.cal.com/engineering");
+      await expect(page.locator("text=Cal.com Engineering")).toBeVisible();
+    });
+  });
 });
 
 // This ensures that the route is actually mapped to a page that is using withEmbedSsr
-async function expectPageToBeServerSideRendered(page: Page) {
+async function expectPageToBeRenderedWithEmbedSsr(page: Page) {
   expect(
     await page.evaluate(() => {
+      //@ts-expect-error - __NEXT_DATA__ is a global variable defined by Next.js
       return window.__NEXT_DATA__.props.pageProps.isEmbed;
     })
   ).toBe(true);

apps/ai/package.json

@@ -5,12 +5,14 @@
   "author": "Cal.com Inc.",
   "dependencies": {
     "@calcom/prisma": "*",
+    "@langchain/core": "^0.1.26",
+    "@langchain/openai": "^0.0.14",
     "@t3-oss/env-nextjs": "^0.6.1",
-    "langchain": "^0.0.131",
+    "langchain": "^0.1.17",
     "mailparser": "^3.6.5",
     "next": "^13.5.4",
     "supports-color": "8.1.1",
-    "zod": "^3.22.2"
+    "zod": "^3.22.4"
   },
   "devDependencies": {
     "@types/mailparser": "^3.4.0"

apps/ai/src/tools/createBooking.ts

@@ -1,4 +1,4 @@
-import { DynamicStructuredTool } from "langchain/tools";
+import { DynamicStructuredTool } from "@langchain/core/tools";
 import { z } from "zod";
 
 import type { UserList } from "~/src/types/user";

apps/ai/src/tools/deleteBooking.ts

@@ -1,4 +1,4 @@
-import { DynamicStructuredTool } from "langchain/tools";
+import { DynamicStructuredTool } from "@langchain/core/tools";
 import { z } from "zod";
 
 import { env } from "../env.mjs";

apps/ai/src/tools/getAvailability.ts

@@ -1,4 +1,4 @@
-import { DynamicStructuredTool } from "langchain/tools";
+import { DynamicStructuredTool } from "@langchain/core/tools";
 import { z } from "zod";
 
 import { env } from "../env.mjs";

apps/ai/src/tools/getBookings.ts

@@ -1,4 +1,4 @@
-import { DynamicStructuredTool } from "langchain/tools";
+import { DynamicStructuredTool } from "@langchain/core/tools";
 import { z } from "zod";
 
 import { env } from "../env.mjs";

apps/ai/src/tools/getEventTypes.ts

@@ -1,4 +1,4 @@
-import { DynamicStructuredTool } from "langchain/tools";
+import { DynamicStructuredTool } from "@langchain/core/tools";
 import { z } from "zod";
 
 import { env } from "../env.mjs";

apps/ai/src/tools/sendBookingEmail.ts

@@ -1,4 +1,4 @@
-import { DynamicStructuredTool } from "langchain/tools";
+import { DynamicStructuredTool } from "@langchain/core/tools";
 import { z } from "zod";
 
 import { env } from "~/src/env.mjs";

apps/ai/src/tools/updateBooking.ts

@@ -1,4 +1,4 @@
-import { DynamicStructuredTool } from "langchain/tools";
+import { DynamicStructuredTool } from "@langchain/core/tools";
 import { z } from "zod";
 
 import { env } from "../env.mjs";

apps/ai/src/utils/agent.ts

@@ -1,5 +1,5 @@
+import { ChatOpenAI } from "@langchain/openai";
 import { initializeAgentExecutorWithOptions } from "langchain/agents";
-import { ChatOpenAI } from "langchain/chat_models/openai";
 
 import { env } from "../env.mjs";
 import createBookingIfAvailable from "../tools/createBooking";
@@ -13,7 +13,7 @@ import type { User, UserList } from "../types/user";
 import type { WorkingHours } from "../types/workingHours";
 import now from "./now";
 
-const gptModel = "gpt-4-0613";
+const gptModel = "gpt-4-0125-preview";
 
 /**
  * Core of the Cal.ai booking agent: a LangChain Agent Executor.

apps/api/lib/helpers/captureErrors.ts

@@ -1,4 +1,4 @@
-import * as Sentry from "@sentry/nextjs";
+import { captureException as SentryCaptureException } from "@sentry/nextjs";
 import type { NextMiddleware } from "next-api-middleware";
 
 import { redactError } from "@calcom/lib/redactError";
@@ -9,7 +9,7 @@ export const captureErrors: NextMiddleware = async (_req, res, next) => {
     // middleware and the API route handler
     await next();
   } catch (error) {
-    Sentry.captureException(error);
+    SentryCaptureException(error);
     const redactedError = redactError(error);
     if (redactedError instanceof Error) {
       res.status(400).json({ message: redactedError.message, error: redactedError });

apps/api/lib/validations/shared/querySlug.ts

@@ -0,0 +1,7 @@
+import { z } from "zod";
+
+import { baseApiParams } from "./baseApiParams";
+
+export const schemaQuerySlug = baseApiParams.extend({
+  slug: z.string().optional(),
+});

apps/api/lib/validations/shared/timeZone.ts

@@ -1,5 +1,5 @@
 import tzdata from "tzdata";
-import * as z from "zod";
+import { z } from "zod";
 
 // @note: This is a custom validation that checks if the timezone is valid and exists in the tzdb library
 export const timeZone = z.string().refine((tz: string) => Object.keys(tzdata.zones).includes(tz), {

apps/api/package.json

@@ -41,6 +41,6 @@
     "typescript": "^4.9.4",
     "tzdata": "^1.0.30",
     "uuid": "^8.3.2",
-    "zod": "^3.22.2"
+    "zod": "^3.22.4"
   }
 }

apps/api/pages/api/availability/_get.ts

@@ -197,6 +197,7 @@ async function handler(req: NextApiRequest) {
       dateTo,
       eventTypeId,
       userId,
+      returnDateOverrides: true,
     });
   const team = await prisma.team.findUnique({
     where: { id: teamId },
@@ -232,6 +233,7 @@ async function handler(req: NextApiRequest) {
         dateFrom,
         dateTo,
         eventTypeId,
+        returnDateOverrides: true,
       }),
     };
   });

apps/api/pages/api/bookings/_post.ts

@@ -1,5 +1,6 @@
 import type { NextApiRequest } from "next";
 
+import getBookingDataSchemaForApi from "@calcom/features/bookings/lib/getBookingDataSchemaForApi";
 import handleNewBooking from "@calcom/features/bookings/lib/handleNewBooking";
 import { defaultResponder } from "@calcom/lib/server";
 
@@ -206,7 +207,7 @@ async function handler(req: NextApiRequest) {
   const { userId, isAdmin } = req;
   if (isAdmin) req.userId = req.body.userId || userId;
 
-  return await handleNewBooking(req);
+  return await handleNewBooking(req, getBookingDataSchemaForApi);
 }
 
 export default defaultResponder(handler);

apps/api/pages/api/event-types/[id]/_get.ts

@@ -51,7 +51,6 @@ export async function getHandler(req: NextApiRequest) {
     include: {
       customInputs: true,
       team: { select: { slug: true } },
-      users: true,
       hosts: { select: { userId: true, isFixed: true } },
       owner: { select: { username: true, id: true } },
       children: { select: { id: true, userId: true } },

apps/api/pages/api/event-types/_get.ts

@@ -5,6 +5,7 @@ import { defaultResponder } from "@calcom/lib/server";
 import type { PrismaClient } from "@calcom/prisma";
 
 import { schemaEventTypeReadPublic } from "~/lib/validations/event-type";
+import { schemaQuerySlug } from "~/lib/validations/shared/querySlug";
 import { schemaQuerySingleOrMultipleUserIds } from "~/lib/validations/shared/queryUserId";
 
 import getCalLink from "./_utils/getCalLink";
@@ -22,6 +23,12 @@ import getCalLink from "./_utils/getCalLink";
  *          type: string
  *        required: true
  *        description: Your API Key
+ *      - in: query
+ *        name: slug
+ *        schema:
+ *          type: string
+ *        required: false
+ *        description: Slug to filter event types by
  *     tags:
  *     - event-types
  *     externalDocs:
@@ -35,16 +42,20 @@ import getCalLink from "./_utils/getCalLink";
  *         description: No event types were found
  */
 async function getHandler(req: NextApiRequest) {
-  const { userId, prisma } = req;
+  const { userId, prisma, isAdmin } = req;
   const userIds = req.query.userId ? extractUserIdsFromQuery(req) : [userId];
+  const { slug } = schemaQuerySlug.parse(req.query);
+  const shouldUseUserId = !isAdmin || !slug || !!req.query.userId;
+  // When user is admin and no query params are provided we should return all event types.
+  // But currently we return only the event types of the user. Not changing this for backwards compatibility.
   const data = await prisma.eventType.findMany({
     where: {
-      userId: { in: userIds },
+      userId: shouldUseUserId ? { in: userIds } : undefined,
+      slug: slug, // slug will be undefined if not provided in query
     },
     include: {
       customInputs: true,
       team: { select: { slug: true } },
-      users: true,
       hosts: { select: { userId: true, isFixed: true } },
       owner: { select: { username: true, id: true } },
       children: { select: { id: true, userId: true } },

apps/api/pages/api/event-types/_utils/getCalLink.ts

@@ -1,4 +1,4 @@
-import { CAL_URL } from "@calcom/lib/constants";
+import { WEBSITE_URL } from "@calcom/lib/constants";
 
 export default function getCalLink(eventType: {
   team?: { slug: string | null } | null;
@@ -6,7 +6,7 @@ export default function getCalLink(eventType: {
   users?: { username: string | null }[];
   slug: string;
 }) {
-  return `${CAL_URL}/${
+  return `${WEBSITE_URL}/${
     eventType?.team
       ? `team/${eventType?.team?.slug}`
       : eventType?.owner

apps/api/pages/api/invites/_post.ts

@@ -0,0 +1,72 @@
+import type { NextApiRequest, NextApiResponse } from "next";
+
+import { HttpError } from "@calcom/lib/http-error";
+import { defaultResponder } from "@calcom/lib/server";
+import { createContext } from "@calcom/trpc/server/createContext";
+import { viewerTeamsRouter } from "@calcom/trpc/server/routers/viewer/teams/_router";
+import type { TInviteMemberInputSchema } from "@calcom/trpc/server/routers/viewer/teams/inviteMember/inviteMember.schema";
+import { ZInviteMemberInputSchema } from "@calcom/trpc/server/routers/viewer/teams/inviteMember/inviteMember.schema";
+import type { UserProfile } from "@calcom/types/UserProfile";
+
+import { TRPCError } from "@trpc/server";
+import { getHTTPStatusCodeFromError } from "@trpc/server/http";
+
+async function postHandler(req: NextApiRequest, res: NextApiResponse) {
+  const data = ZInviteMemberInputSchema.parse(req.body);
+  await checkPermissions(req, data);
+
+  async function sessionGetter() {
+    return {
+      user: {
+        id: req.userId,
+        username: "",
+        profile: {
+          id: null,
+          organizationId: null,
+          organization: null,
+          username: "",
+          upId: "",
+        } satisfies UserProfile,
+      },
+      hasValidLicense: true,
+      expires: "",
+      upId: "",
+    };
+  }
+
+  const ctx = await createContext({ req, res }, sessionGetter);
+  try {
+    const caller = viewerTeamsRouter.createCaller(ctx);
+    await caller.inviteMember({
+      role: data.role,
+      language: data.language,
+      teamId: data.teamId,
+      usernameOrEmail: data.usernameOrEmail,
+      isOrg: data.isOrg,
+    });
+
+    return { success: true, message: `${data.usernameOrEmail} has been invited.` };
+  } catch (cause) {
+    if (cause instanceof TRPCError) {
+      const statusCode = getHTTPStatusCodeFromError(cause);
+      throw new HttpError({ statusCode, message: cause.message });
+    }
+
+    throw cause;
+  }
+}
+
+async function checkPermissions(req: NextApiRequest, body: TInviteMemberInputSchema) {
+  const { userId, isAdmin, prisma } = req;
+  if (isAdmin) return;
+  // To prevent auto-accepted invites, limit it to ADMIN users
+  if (!isAdmin && "accepted" in body)
+    throw new HttpError({ statusCode: 403, message: "ADMIN needed for `accepted`" });
+  // Only team OWNERS and ADMINS can add other members
+  const membership = await prisma.membership.findFirst({
+    where: { userId, teamId: body.teamId, role: { in: ["ADMIN", "OWNER"] } },
+  });
+  if (!membership) throw new HttpError({ statusCode: 403, message: "You can't add members to this team" });
+}
+
+export default defaultResponder(postHandler);

apps/api/pages/api/invites/index.ts

@@ -0,0 +1,9 @@
+import { defaultHandler } from "@calcom/lib/server";
+
+import { withMiddleware } from "~/lib/helpers/withMiddleware";
+
+export default withMiddleware()(
+  defaultHandler({
+    POST: import("./_post"),
+  })
+);

apps/api/pages/api/teams/[teamId]/event-types/_get.ts

@@ -59,7 +59,6 @@ async function getHandler(req: NextApiRequest) {
     include: {
       customInputs: true,
       team: { select: { slug: true } },
-      users: true,
       hosts: { select: { userId: true, isFixed: true } },
       owner: { select: { username: true, id: true } },
       children: { select: { id: true, userId: true } },

apps/api/pages/api/teams/[teamId]/publish.ts

@@ -5,6 +5,7 @@ import { defaultHandler, defaultResponder } from "@calcom/lib/server";
 import { MembershipRole, UserPermissionRole } from "@calcom/prisma/enums";
 import { createContext } from "@calcom/trpc/server/createContext";
 import { viewerTeamsRouter } from "@calcom/trpc/server/routers/viewer/teams/_router";
+import type { UserProfile } from "@calcom/types/UserProfile";
 
 import { TRPCError } from "@trpc/server";
 import { getHTTPStatusCodeFromError } from "@trpc/server/http";
@@ -21,9 +22,17 @@ const patchHandler = async (req: NextApiRequest, res: NextApiResponse) => {
         id: req.userId,
         username: "" /* Not used in this context */,
         role: req.isAdmin ? UserPermissionRole.ADMIN : UserPermissionRole.USER,
+        profile: {
+          id: null,
+          organizationId: null,
+          organization: null,
+          username: "",
+          upId: "",
+        } satisfies UserProfile,
       },
       hasValidLicense: true /* To comply with TS signature */,
       expires: "" /* Not used in this context */,
+      upId: "",
     };
   }
   /** @see https://trpc.io/docs/server-side-calls */

apps/api/sentry.edge.config.ts

@@ -1,5 +1,5 @@
-import * as Sentry from "@sentry/nextjs";
+import { init as SentryInit } from "@sentry/nextjs";
 
-Sentry.init({
+SentryInit({
   dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
 });

apps/api/sentry.server.config.ts

@@ -1,6 +1,6 @@
-import * as Sentry from "@sentry/nextjs";
+import { init as SentryInit } from "@sentry/nextjs";
 
-Sentry.init({
+SentryInit({
   dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
   tracesSampleRate: 1.0,
 });

apps/swagger/package.json

@@ -24,6 +24,7 @@
     "@types/node": "16.9.1",
     "@types/react": "18.0.26",
     "@types/react-dom": "^18.0.9",
+    "@types/swagger-ui-react": "^4.18.3",
     "typescript": "^4.9.4"
   }
 }

apps/swagger/pages/_app.tsx

@@ -1,9 +1,10 @@
 import "highlight.js/styles/default.css";
+import { type AppProps } from "next/app";
 import "swagger-ui-react/swagger-ui.css";
 
 import "../styles/globals.css";
 
-function MyApp({ Component, pageProps }) {
+function MyApp({ Component, pageProps }: AppProps) {
   return <Component {...pageProps} />;
 }
 

apps/swagger/pages/index.tsx

@@ -1,9 +1,8 @@
 import dynamic from "next/dynamic";
-import type { SwaggerUI } from "swagger-ui-react";
 
 import { SnippedGenerator, requestSnippets } from "@lib/snippets";
 
-const SwaggerUIDynamic: SwaggerUI & { url: string } = dynamic(() => import("swagger-ui-react"), {
+const SwaggerUIDynamic = dynamic(() => import("swagger-ui-react"), {
   ssr: false,
 });
 
@@ -17,8 +16,6 @@ export default function APIDocs() {
       requestSnippets={requestSnippets}
       plugins={[SnippedGenerator]}
       tryItOutEnabled={true}
-      syntaxHighlight={true}
-      enableCORS={false} // Doesn't seem to work either
       docExpansion="list"
       filter={true}
     />

apps/web/app/future/bookings/[status]/page.tsx

@@ -3,7 +3,6 @@ import { _generateMetadata } from "app/_utils";
 import { WithLayout } from "app/layoutHOC";
 import type { InferGetStaticPropsType } from "next";
 
-import { getLayout } from "@calcom/features/MainLayoutAppDir";
 import { APP_NAME } from "@calcom/lib/constants";
 
 import { validStatuses } from "~/bookings/lib/validStatuses";
@@ -23,6 +22,6 @@ export const generateStaticParams = async () => {
   return validStatuses.map((status) => ({ status }));
 };
 
-export default WithLayout({ getLayout, getData, Page })<"P">;
+export default WithLayout({ getLayout: null, getData, Page })<"P">;
 
 export const dynamic = "force-static";

apps/web/app/future/event-types/page.tsx

@@ -1,8 +1,6 @@
 import { _generateMetadata } from "app/_utils";
 import { WithLayout } from "app/layoutHOC";
 
-import { getLayout } from "@calcom/features/MainLayoutAppDir";
-
 import EventTypes from "~/event-types/views/event-types-listing-view";
 
 export const generateMetadata = async () =>
@@ -11,4 +9,4 @@ export const generateMetadata = async () =>
     (t) => t("event_types_page_subtitle")
   );
 
-export default WithLayout({ getLayout, Page: EventTypes })<"P">;
+export default WithLayout({ getLayout: null, Page: EventTypes })<"P">;

apps/web/app/future/insights/page.tsx

@@ -3,8 +3,6 @@ import { withAppDirSsr } from "app/WithAppDirSsr";
 import { _generateMetadata } from "app/_utils";
 import { WithLayout } from "app/layoutHOC";
 
-import { getLayout } from "@calcom/features/MainLayoutAppDir";
-
 import { getServerSideProps } from "@lib/insights/getServerSideProps";
 import { type inferSSRProps } from "@lib/types/inferSSRProps";
 
@@ -16,4 +14,4 @@ export const generateMetadata = async () =>
 
 const getData = withAppDirSsr<inferSSRProps<typeof getServerSideProps>>(getServerSideProps);
 
-export default WithLayout({ getLayout, getData, Page: LegacyPage });
+export default WithLayout({ getLayout: null, getData, Page: LegacyPage });

apps/web/app/future/org/[orgSlug]/team/[slug]/[type]/page.tsx

@@ -18,7 +18,8 @@ export const generateMetadata = async ({
 }) => {
   const legacyCtx = buildLegacyCtx(headers(), cookies(), params, searchParams);
   const props = await getData(legacyCtx as unknown as GetServerSidePropsContext);
-  const { entity, user, slug, booking } = props;
+  const { eventData, user, slug, booking } = props;
+  const entity = eventData.entity;
   const { trpc } = await import("@calcom/trpc");
   const { data: event } = trpc.viewer.public.event.useQuery(
     { username: user, eventSlug: slug, isTeamEvent: false, org: entity.orgSlug ?? null },

apps/web/app/future/team/[slug]/[type]/page.tsx

@@ -16,7 +16,8 @@ export const generateMetadata = async ({
 }) => {
   const legacyCtx = buildLegacyCtx(headers(), cookies(), params, searchParams);
   const props = await getData(legacyCtx as unknown as GetServerSidePropsContext);
-  const { entity, user, slug, booking } = props;
+  const { eventData, user, slug, booking } = props;
+  const entity = eventData.entity;
   const { trpc } = await import("@calcom/trpc");
   const { data: event } = trpc.viewer.public.event.useQuery(
     { username: user, eventSlug: slug, isTeamEvent: false, org: entity.orgSlug ?? null },

apps/web/app/future/teams/page.tsx

@@ -3,8 +3,6 @@ import { withAppDirSsr } from "app/WithAppDirSsr";
 import { _generateMetadata } from "app/_utils";
 import { WithLayout } from "app/layoutHOC";
 
-import { getLayout } from "@calcom/features/MainLayoutAppDir";
-
 import { getServerSideProps } from "@lib/teams/getServerSideProps";
 
 export const generateMetadata = async () =>
@@ -13,4 +11,4 @@ export const generateMetadata = async () =>
     (t) => t("create_manage_teams_collaborative")
   );
 
-export default WithLayout({ getData: withAppDirSsr(getServerSideProps), getLayout, Page })<"P">;
+export default WithLayout({ getData: withAppDirSsr(getServerSideProps), getLayout: null, Page })<"P">;

apps/web/app/future/workflows/page.tsx

@@ -1,7 +1,6 @@
 import { _generateMetadata } from "app/_utils";
 import { WithLayout } from "app/layoutHOC";
 
-import { getLayout } from "@calcom/features/MainLayoutAppDir";
 import LegacyPage from "@calcom/features/ee/workflows/pages/index";
 
 export const generateMetadata = async () =>
@@ -10,4 +9,4 @@ export const generateMetadata = async () =>
     (t) => t("workflows_to_automate_notifications")
   );
 
-export default WithLayout({ getLayout, Page: LegacyPage })<"P">;
+export default WithLayout({ getLayout: null, Page: LegacyPage })<"P">;

apps/web/components/apps/CalendarListContainer.tsx

@@ -1,5 +1,5 @@
 import Link from "next/link";
-import { Fragment } from "react";
+import { Fragment, useEffect } from "react";
 
 import { InstallAppButton } from "@calcom/app-store/components";
 import DisconnectIntegration from "@calcom/features/apps/components/DisconnectIntegration";
@@ -15,10 +15,12 @@ import {
   AppSkeletonLoader as SkeletonLoader,
   ShellSubHeading,
   Label,
+  showToast,
 } from "@calcom/ui";
 import { Calendar } from "@calcom/ui/components/icon";
 
 import { QueryCell } from "@lib/QueryCell";
+import useRouterQuery from "@lib/hooks/useRouterQuery";
 
 import AppListCard from "@components/AppListCard";
 import AdditionalCalendarSelector from "@components/apps/AdditionalCalendarSelector";
@@ -182,6 +184,15 @@ function ConnectedCalendarsList(props: Props) {
 export function CalendarListContainer(props: { heading?: boolean; fromOnboarding?: boolean }) {
   const { t } = useLocale();
   const { heading = true, fromOnboarding } = props;
+  const { error, setQuery: setError } = useRouterQuery("error");
+
+  useEffect(() => {
+    if (error === "account_already_linked") {
+      showToast(t(error), "error", { id: error });
+      setError(undefined);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
   const utils = trpc.useContext();
   const onChanged = () =>
     Promise.allSettled([

apps/web/components/apps/InstallAppButtonChild.tsx

@@ -2,7 +2,7 @@ import useAddAppMutation from "@calcom/app-store/_utils/useAddAppMutation";
 import { doesAppSupportTeamInstall } from "@calcom/app-store/utils";
 import { Spinner } from "@calcom/features/calendars/weeklyview/components/spinner/Spinner";
 import type { UserAdminTeams } from "@calcom/features/ee/teams/lib/getUserAdminTeams";
-import { CAL_URL } from "@calcom/lib/constants";
+import { WEBAPP_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import type { RouterOutputs } from "@calcom/trpc/react";
 import type { AppFrontendPayload } from "@calcom/types/App";
@@ -125,7 +125,7 @@ export const InstallAppButtonChild = ({
                 StartIcon={(props) => (
                   <Avatar
                     alt={team.logo || ""}
-                    imageSrc={team.logo || `${CAL_URL}/${team.logo}/avatar.png`} // if no image, use default avatar
+                    imageSrc={team.logo || `${WEBAPP_URL}/${team.logo}/avatar.png`} // if no image, use default avatar
                     size="sm"
                     {...props}
                   />

apps/web/components/apps/layouts/InstalledAppsLayout.tsx

@@ -9,7 +9,11 @@ export default function InstalledAppsLayout({
   ...rest
 }: { children: React.ReactNode } & ComponentProps<typeof Shell>) {
   return (
-    <Shell {...rest} hideHeadingOnMobile>
+    <Shell
+      {...rest}
+      title="Installed Apps"
+      description="Manage your installed apps or change settings"
+      hideHeadingOnMobile>
       <AppCategoryNavigation baseURL="/apps/installed" containerClassname="min-w-0 w-full">
         {children}
       </AppCategoryNavigation>

apps/web/components/eventtype/EventAdvancedTab.tsx

@@ -1,10 +1,9 @@
+import { InfoIcon } from "lucide-react";
 import dynamic from "next/dynamic";
 import Link from "next/link";
 import type { EventTypeSetupProps, FormValues } from "pages/event-types/[type]";
 import { useEffect, useState } from "react";
 import { Controller, useFormContext } from "react-hook-form";
-import short from "short-uuid";
-import { v5 as uuidv5 } from "uuid";
 import type { z } from "zod";
 
 import type { EventNameObjectType } from "@calcom/core/event";
@@ -20,8 +19,8 @@ import { FormBuilder } from "@calcom/features/form-builder/FormBuilder";
 import type { EditableSchema } from "@calcom/features/form-builder/schema";
 import { BookerLayoutSelector } from "@calcom/features/settings/BookerLayoutSelector";
 import { classNames } from "@calcom/lib";
-import { APP_NAME, CAL_URL } from "@calcom/lib/constants";
-import { IS_VISUAL_REGRESSION_TESTING } from "@calcom/lib/constants";
+import { APP_NAME, IS_VISUAL_REGRESSION_TESTING, WEBSITE_URL } from "@calcom/lib/constants";
+import { generateHashedLink } from "@calcom/lib/generateHashedLink";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import type { Prisma } from "@calcom/prisma/client";
 import { trpc } from "@calcom/trpc/react";
@@ -32,6 +31,7 @@ import {
   Label,
   SettingsToggle,
   showToast,
+  Switch,
   TextField,
   Tooltip,
 } from "@calcom/ui";
@@ -41,22 +41,17 @@ import RequiresConfirmationController from "./RequiresConfirmationController";
 
 const CustomEventTypeModal = dynamic(() => import("@components/eventtype/CustomEventTypeModal"));
 
-const generateHashedLink = (id: number) => {
-  const translator = short();
-  const seed = `${id}:${new Date().getTime()}`;
-  const uid = translator.fromUUID(uuidv5(seed, uuidv5.URL));
-  return uid;
-};
-
 export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps, "eventType" | "team">) => {
   const connectedCalendarsQuery = trpc.viewer.connectedCalendars.useQuery();
   const { data: user } = trpc.viewer.me.useQuery();
   const formMethods = useFormContext<FormValues>();
   const { t } = useLocale();
-
   const [showEventNameTip, setShowEventNameTip] = useState(false);
   const [hashedLinkVisible, setHashedLinkVisible] = useState(!!formMethods.getValues("hashedLink"));
   const [redirectUrlVisible, setRedirectUrlVisible] = useState(!!formMethods.getValues("successRedirectUrl"));
+  const [useEventTypeDestinationCalendarEmail, setUseEventTypeDestinationCalendarEmail] = useState(
+    formMethods.getValues("useEventTypeDestinationCalendarEmail")
+  );
   const [hashedUrl, setHashedUrl] = useState(eventType.hashedLink?.link);
 
   const bookingFields: Prisma.JsonObject = {};
@@ -65,7 +60,6 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
   const selectedThemeIsDark =
     user?.theme === "dark" ||
     (!user?.theme && typeof document !== "undefined" && document.documentElement.classList.contains("dark"));
-
   formMethods.getValues().bookingFields.forEach(({ name }) => {
     bookingFields[name] = `${name} input`;
   });
@@ -82,7 +76,7 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
   const [requiresConfirmation, setRequiresConfirmation] = useState(
     formMethods.getValues("requiresConfirmation")
   );
-  const placeholderHashedLink = `${CAL_URL}/d/${hashedUrl}/${formMethods.getValues("slug")}`;
+  const placeholderHashedLink = `${WEBSITE_URL}/d/${hashedUrl}/${formMethods.getValues("slug")}`;
   const seatsEnabled = formMethods.watch("seatsPerTimeSlotEnabled");
   const noShowFeeEnabled =
     formMethods.getValues("metadata")?.apps?.stripe?.enabled === true &&
@@ -107,7 +101,8 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
           };
         }
         return field;
-      })
+      }),
+      { shouldDirty: true }
     );
   };
 
@@ -125,6 +120,8 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
   const seatsLocked = shouldLockDisableProps("seatsPerTimeSlotEnabled");
 
   const closeEventNameTip = () => setShowEventNameTip(false);
+  const displayDestinationCalendarSelector =
+    !!connectedCalendarsQuery.data?.connectedCalendars.length && !team;
 
   return (
     <div className="flex flex-col space-y-4">
@@ -134,7 +131,7 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
        * This will fallback to each user selected destination calendar.
        */}
       <div className="border-subtle space-y-6 rounded-lg border p-6">
-        {!!connectedCalendarsQuery.data?.connectedCalendars.length && !team && (
+        {displayDestinationCalendarSelector && (
           <div className="flex flex-col">
             <div className="flex justify-between">
               <div>
@@ -180,6 +177,27 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
             }
           />
         </div>
+        {displayDestinationCalendarSelector && (
+          <div className="w-full">
+            <Switch
+              tooltip={t("reconnect_calendar_to_use")}
+              label={
+                <>
+                  {t("display_add_to_calendar_organizer")}
+                  <InfoIcon className="text-default hover:text-attention hover:bg-attention ms-1 inline h-4 w-4 rounded-md" />
+                </>
+              }
+              checked={useEventTypeDestinationCalendarEmail}
+              onCheckedChange={(val) => {
+                setUseEventTypeDestinationCalendarEmail(val);
+                formMethods.setValue("useEventTypeDestinationCalendarEmail", val, { shouldDirty: true });
+                if (val) {
+                  showToast(t("reconnect_calendar_to_use"), "warning");
+                }
+              }}
+            />
+          </div>
+        )}
       </div>
 
       <BookerLayoutSelector fallbackToUserSettings isDark={selectedThemeIsDark} isOuterBorder={true} />
@@ -311,7 +329,7 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
         description={t("private_link_description", { appName: APP_NAME })}
         checked={hashedLinkVisible}
         onCheckedChange={(e) => {
-          formMethods.setValue("hashedLink", e ? hashedUrl : undefined);
+          formMethods.setValue("hashedLink", e ? hashedUrl : undefined, { shouldDirty: true });
           setHashedLinkVisible(e);
         }}>
         <div className="border-subtle rounded-b-lg border border-t-0 p-6">
@@ -375,10 +393,12 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
                 // Enabling seats will disable guests and requiring confirmation until fully supported
                 if (e) {
                   toggleGuests(false);
-                  formMethods.setValue("requiresConfirmation", false);
+                  formMethods.setValue("requiresConfirmation", false, { shouldDirty: true });
                   setRequiresConfirmation(false);
-                  formMethods.setValue("metadata.multipleDuration", undefined);
-                  formMethods.setValue("seatsPerTimeSlot", eventType.seatsPerTimeSlot ?? 2);
+                  formMethods.setValue("metadata.multipleDuration", undefined, { shouldDirty: true });
+                  formMethods.setValue("seatsPerTimeSlot", eventType.seatsPerTimeSlot ?? 2, {
+                    shouldDirty: true,
+                  });
                 } else {
                   formMethods.setValue("seatsPerTimeSlot", null);
                   toggleGuests(true);
@@ -498,7 +518,7 @@ export const EventAdvancedTab = ({ eventType, team }: Pick<EventTypeSetupProps,
       {showEventNameTip && (
         <CustomEventTypeModal
           close={closeEventNameTip}
-          setValue={(val: string) => formMethods.setValue("eventName", val)}
+          setValue={(val: string) => formMethods.setValue("eventName", val, { shouldDirty: true })}
           defaultValue={formMethods.getValues("eventName")}
           placeHolder={eventNamePlaceholder}
           event={eventNameObject}

apps/web/components/eventtype/EventAppsTab.tsx

@@ -31,10 +31,14 @@ export const EventAppsTab = ({ eventType }: { eventType: EventType }) => {
   const allAppsData = formMethods.watch("metadata")?.apps || {};
 
   const setAllAppsData = (_allAppsData: typeof allAppsData) => {
-    formMethods.setValue("metadata", {
-      ...formMethods.getValues("metadata"),
-      apps: _allAppsData,
-    });
+    formMethods.setValue(
+      "metadata",
+      {
+        ...formMethods.getValues("metadata"),
+        apps: _allAppsData,
+      },
+      { shouldDirty: true }
+    );
   };
 
   const getAppDataGetter = (appId: EventTypeAppsList): GetAppData => {

apps/web/components/eventtype/EventAvailabilityTab.tsx

@@ -230,7 +230,7 @@ const EventTypeSchedule = ({ eventType }: { eventType: EventTypeSetup }) => {
           : option.value === schedules.find((schedule) => schedule.isDefault)?.id
       );
 
-      setValue("availability", value);
+      setValue("availability", value, { shouldDirty: true });
     },
     [data]
   );
@@ -238,7 +238,7 @@ const EventTypeSchedule = ({ eventType }: { eventType: EventTypeSetup }) => {
 
   useEffect(() => {
     if (!availabilityValue?.value) return;
-    setValue("schedule", availabilityValue.value);
+    setValue("schedule", availabilityValue.value, { shouldDirty: true });
   }, [availabilityValue, setValue]);
 
   return (
@@ -260,7 +260,7 @@ const EventTypeSchedule = ({ eventType }: { eventType: EventTypeSetup }) => {
                   isSearchable={false}
                   onChange={(selected) => {
                     field.onChange(selected?.value || null);
-                    if (selected?.value) setValue("availability", selected);
+                    if (selected?.value) setValue("availability", selected, { shouldDirty: true });
                   }}
                   className="block w-full min-w-0 flex-1 rounded-sm text-sm"
                   value={availabilityValue}
@@ -298,7 +298,7 @@ const UseCommonScheduleSettingsToggle = ({ eventType }: { eventType: EventTypeSe
           onCheckedChange={(checked) => {
             onChange(!checked);
             if (!checked) {
-              setValue("schedule", null);
+              setValue("schedule", null, { shouldDirty: true });
             }
           }}
           title={t("choose_common_schedule_team_event")}

apps/web/components/eventtype/EventLimitsTab.tsx

@@ -61,7 +61,8 @@ const MinimumBookingNoticeInput = React.forwardRef<
         minimumBookingNoticeDisplayValues.type,
         "minutes",
         minimumBookingNoticeDisplayValues.value
-      )
+      ),
+      { shouldDirty: true }
     );
   }, [minimumBookingNoticeDisplayValues, setValue, passThroughProps.name]);
 
@@ -230,7 +231,9 @@ export const EventLimitsTab = () => {
                   <Select
                     isSearchable={false}
                     onChange={(val) => {
-                      formMethods.setValue("slotInterval", val && (val.value || 0) > 0 ? val.value : null);
+                      formMethods.setValue("slotInterval", val && (val.value || 0) > 0 ? val.value : null, {
+                        shouldDirty: true,
+                      });
                     }}
                     defaultValue={
                       slotIntervalOptions.find(
@@ -258,11 +261,15 @@ export const EventLimitsTab = () => {
               checked={isChecked}
               onCheckedChange={(active) => {
                 if (active) {
-                  formMethods.setValue("bookingLimits", {
-                    PER_DAY: 1,
-                  });
+                  formMethods.setValue(
+                    "bookingLimits",
+                    {
+                      PER_DAY: 1,
+                    },
+                    { shouldDirty: true }
+                  );
                 } else {
-                  formMethods.setValue("bookingLimits", {});
+                  formMethods.setValue("bookingLimits", {}, { shouldDirty: true });
                 }
               }}
               switchContainerClassName={classNames(
@@ -279,7 +286,7 @@ export const EventLimitsTab = () => {
       />
       <Controller
         name="onlyShowFirstAvailableSlot"
-        render={({ field: { value } }) => {
+        render={({ field: { onChange, value } }) => {
           const isChecked = value;
           return (
             <SettingsToggle
@@ -289,7 +296,7 @@ export const EventLimitsTab = () => {
               description={t("limit_booking_only_first_slot_description")}
               checked={isChecked}
               onCheckedChange={(active) => {
-                formMethods.setValue("onlyShowFirstAvailableSlot", active ?? false);
+                onChange(active ?? false);
               }}
               switchContainerClassName={classNames(
                 "border-subtle mt-6 rounded-lg border py-6 px-4 sm:px-6",
@@ -301,7 +308,7 @@ export const EventLimitsTab = () => {
       />
       <Controller
         name="durationLimits"
-        render={({ field: { value } }) => {
+        render={({ field: { onChange, value } }) => {
           const isChecked = Object.keys(value ?? {}).length > 0;
           return (
             <SettingsToggle
@@ -317,11 +324,11 @@ export const EventLimitsTab = () => {
               checked={isChecked}
               onCheckedChange={(active) => {
                 if (active) {
-                  formMethods.setValue("durationLimits", {
+                  onChange({
                     PER_DAY: 60,
                   });
                 } else {
-                  formMethods.setValue("durationLimits", {});
+                  onChange({});
                 }
               }}>
               <div className="border-subtle rounded-b-lg border border-t-0 p-6">
@@ -338,7 +345,7 @@ export const EventLimitsTab = () => {
       />
       <Controller
         name="periodType"
-        render={({ field: { value } }) => {
+        render={({ field: { onChange, value } }) => {
           const isChecked = value && value !== "UNLIMITED";
 
           return (
@@ -353,11 +360,16 @@ export const EventLimitsTab = () => {
               title={t("limit_future_bookings")}
               description={t("limit_future_bookings_description")}
               checked={isChecked}
-              onCheckedChange={(bool) => formMethods.setValue("periodType", bool ? "ROLLING" : "UNLIMITED")}>
+              onCheckedChange={(bool) =>
+                // formMethods.setValue("periodType", bool ? "ROLLING" : "UNLIMITED", { shouldDirty: true })
+                onChange(bool ? "ROLLING" : "UNLIMITED")
+              }>
               <div className="border-subtle rounded-b-lg border border-t-0 p-6">
                 <RadioGroup.Root
                   value={watchPeriodType}
-                  onValueChange={(val) => formMethods.setValue("periodType", val as PeriodType)}>
+                  onValueChange={(val) =>
+                    formMethods.setValue("periodType", val as PeriodType, { shouldDirty: true })
+                  }>
                   {PERIOD_TYPES.map((period) => {
                     if (period.type === "UNLIMITED") return null;
                     return (
@@ -388,17 +400,21 @@ export const EventLimitsTab = () => {
                               options={optionsPeriod}
                               isSearchable={false}
                               onChange={(opt) =>
-                                formMethods.setValue("periodCountCalendarDays", opt?.value === 1 ? "1" : "0")
+                                formMethods.setValue(
+                                  "periodCountCalendarDays",
+                                  opt?.value === 1 ? true : false,
+                                  { shouldDirty: true }
+                                )
                               }
                               name="periodCoundCalendarDays"
                               value={optionsPeriod.find((opt) => {
                                 opt.value ===
-                                  (formMethods.getValues("periodCountCalendarDays") === "1" ? 1 : 0);
+                                  (formMethods.getValues("periodCountCalendarDays") === true ? 1 : 0);
                               })}
                               defaultValue={optionsPeriod.find(
                                 (opt) =>
                                   opt.value ===
-                                  (formMethods.getValues("periodCountCalendarDays") === "1" ? 1 : 0)
+                                  (formMethods.getValues("periodCountCalendarDays") === true ? 1 : 0)
                               )}
                             />
                           </div>
@@ -407,12 +423,12 @@ export const EventLimitsTab = () => {
                           <div className="me-2 ms-2 inline-flex space-x-2 rtl:space-x-reverse">
                             <Controller
                               name="periodDates"
-                              render={() => (
+                              render={({ field: { onChange } }) => (
                                 <DateRangePicker
                                   startDate={formMethods.getValues("periodDates").startDate}
                                   endDate={formMethods.getValues("periodDates").endDate}
                                   onDatesChange={({ startDate, endDate }) => {
-                                    formMethods.setValue("periodDates", {
+                                    onChange({
                                       startDate,
                                       endDate,
                                     });
@@ -446,7 +462,7 @@ export const EventLimitsTab = () => {
         onCheckedChange={(active) => {
           setOffsetToggle(active);
           if (!active) {
-            formMethods.setValue("offsetStart", 0);
+            formMethods.setValue("offsetStart", 0, { shouldDirty: true });
           }
         }}>
         <div className="border-subtle rounded-b-lg border border-t-0 p-6">
@@ -577,11 +593,16 @@ const IntervalLimitsManager = <K extends "durationLimits" | "bookingLimits">({
           );
           if (!rest || !currentKeys.length) return;
           //currentDurationLimits is always defined so can be casted
-          // @ts-expect-error FIXME Fix these typings
-          setValue(propertyName, {
-            ...watchIntervalLimits,
-            [rest.value]: defaultLimit,
-          });
+
+          setValue(
+            propertyName,
+            // @ts-expect-error FIXME Fix these typings
+            {
+              ...watchIntervalLimits,
+              [rest.value]: defaultLimit,
+            },
+            { shouldDirty: true }
+          );
         };
 
         return (
@@ -611,7 +632,7 @@ const IntervalLimitsManager = <K extends "durationLimits" | "bookingLimits">({
                       )}
                       onLimitChange={(intervalLimitKey, val) =>
                         // @ts-expect-error FIXME Fix these typings
-                        setValue(`${propertyName}.${intervalLimitKey}`, val)
+                        setValue(`${propertyName}.${intervalLimitKey}`, val, { shouldDirty: true })
                       }
                       onDelete={(intervalLimitKey) => {
                         const current = currentIntervalLimits;

apps/web/components/eventtype/EventSetupTab.tsx

@@ -11,7 +11,7 @@ import type { EventLocationType } from "@calcom/app-store/locations";
 import { getEventLocationType, MeetLocationType } from "@calcom/app-store/locations";
 import useLockedFieldsManager from "@calcom/features/ee/managed-event-types/hooks/useLockedFieldsManager";
 import { useOrgBranding } from "@calcom/features/ee/organizations/context/provider";
-import { CAL_URL } from "@calcom/lib/constants";
+import { WEBAPP_URL, WEBSITE_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { md } from "@calcom/lib/markdownIt";
 import { slugify } from "@calcom/lib/slugify";
@@ -83,7 +83,7 @@ const DescriptionEditor = ({ isEditable }: { isEditable: boolean }) => {
   return mounted ? (
     <Editor
       getText={() => md.render(formMethods.getValues("description") || "")}
-      setText={(value: string) => formMethods.setValue("description", turndown(value))}
+      setText={(value: string) => formMethods.setValue("description", turndown(value), { shouldDirty: true })}
       excludedToolbarItems={["blockType"]}
       placeholder={t("quick_video_meeting")}
       editable={isEditable}
@@ -401,7 +401,7 @@ export const EventSetupTab = (
                   The “Add to calendar” for this event type needs to be a Google Calendar for Meet to work.
                   Change it{" "}
                   <Link
-                    href={`${CAL_URL}/event-types/${formMethods.getValues("id")}?tabName=advanced`}
+                    href={`${WEBAPP_URL}/event-types/${formMethods.getValues("id")}?tabName=advanced`}
                     className="underline">
                     here.
                   </Link>{" "}
@@ -412,7 +412,7 @@ export const EventSetupTab = (
           {isChildrenManagedEventType && !locationAvailable && locationDetails && (
             <p className="pl-1 text-sm leading-none text-red-600">
               {t("app_not_connected", { appName: locationDetails.name })}{" "}
-              <a className="underline" href={`${CAL_URL}/apps/${locationDetails.slug}`}>
+              <a className="underline" href={`${WEBAPP_URL}/apps/${locationDetails.slug}`}>
                 {t("connect_now")}
               </a>
             </p>
@@ -444,9 +444,10 @@ export const EventSetupTab = (
 
   const lengthLockedProps = shouldLockDisableProps("length");
   const descriptionLockedProps = shouldLockDisableProps("description");
+
   const urlPrefix = orgBranding
     ? orgBranding?.fullDomain.replace(/^(https?:|)\/\//, "")
-    : `${CAL_URL?.replace(/^(https?:|)\/\//, "")}`;
+    : `${WEBSITE_URL?.replace(/^(https?:|)\/\//, "")}`;
 
   return (
     <div>
@@ -511,16 +512,16 @@ export const EventSetupTab = (
                     if (!newOptions.find((opt) => opt.value === defaultDuration?.value)) {
                       if (newOptions.length > 0) {
                         setDefaultDuration(newOptions[0]);
-                        formMethods.setValue("length", newOptions[0].value);
+                        formMethods.setValue("length", newOptions[0].value, { shouldDirty: true });
                       } else {
                         setDefaultDuration(null);
                       }
                     }
                     if (newOptions.length === 1 && defaultDuration === null) {
                       setDefaultDuration(newOptions[0]);
-                      formMethods.setValue("length", newOptions[0].value);
+                      formMethods.setValue("length", newOptions[0].value, { shouldDirty: true });
                     }
-                    formMethods.setValue("metadata.multipleDuration", values);
+                    formMethods.setValue("metadata.multipleDuration", values, { shouldDirty: true });
                   }}
                 />
               </div>
@@ -541,7 +542,7 @@ export const EventSetupTab = (
                     setDefaultDuration(
                       selectedMultipleDuration.find((opt) => opt.value === option?.value) ?? null
                     );
-                    if (option) formMethods.setValue("length", option.value);
+                    if (option) formMethods.setValue("length", option.value, { shouldDirty: true });
                   }}
                 />
               </div>
@@ -570,12 +571,12 @@ export const EventSetupTab = (
                     setMultipleDuration(undefined);
                     setSelectedMultipleDuration([]);
                     setDefaultDuration(null);
-                    formMethods.setValue("metadata.multipleDuration", undefined);
-                    formMethods.setValue("length", eventType.length);
+                    formMethods.setValue("metadata.multipleDuration", undefined, { shouldDirty: true });
+                    formMethods.setValue("length", eventType.length, { shouldDirty: true });
                   } else {
                     setMultipleDuration([]);
-                    formMethods.setValue("metadata.multipleDuration", []);
-                    formMethods.setValue("length", 0);
+                    formMethods.setValue("metadata.multipleDuration", [], { shouldDirty: true });
+                    formMethods.setValue("length", 0, { shouldDirty: true });
                   }
                 }}
               />

apps/web/components/eventtype/EventTeamTab.tsx

@@ -1,6 +1,6 @@
 import { Trans } from "next-i18next";
 import Link from "next/link";
-import type { EventTypeSetupProps, FormValues } from "pages/event-types/[type]";
+import type { EventTypeSetupProps, FormValues, Host } from "pages/event-types/[type]";
 import { useEffect, useRef, useState } from "react";
 import type { ComponentProps, Dispatch, SetStateAction } from "react";
 import { Controller, useFormContext, useWatch } from "react-hook-form";
@@ -21,6 +21,13 @@ interface IUserToValue {
   email: string;
 }
 
+type TeamMember = {
+  value: string;
+  label: string;
+  avatar: string;
+  email: string;
+};
+
 const mapUserToValue = ({ id, name, username, avatar, email }: IUserToValue, pendingString: string) => ({
   value: `${id || ""}`,
   label: `${name || email || ""}${!username ? ` (${pendingString})` : ""}`,
@@ -109,7 +116,7 @@ const AssignAllTeamMembers = ({
   onInactive?: () => void;
 }) => {
   const { t } = useLocale();
-  const formMethods = useFormContext<FormValues>();
+  const { setValue } = useFormContext<FormValues>();
 
   return (
     <Controller<FormValues>
@@ -117,10 +124,10 @@ const AssignAllTeamMembers = ({
       render={() => (
         <SettingsToggle
           title={t("automatically_add_all_team_members")}
-          description={t("including_people_who_join_in_future")}
+          labelClassName="mt-0.5 font-normal"
           checked={assignAllTeamMembers}
           onCheckedChange={(active) => {
-            formMethods.setValue("assignAllTeamMembers", active);
+            setValue("assignAllTeamMembers", active, { shouldDirty: true });
             setAssignAllTeamMembers(active);
             if (active) {
               onActive();
@@ -128,7 +135,6 @@ const AssignAllTeamMembers = ({
               onInactive();
             }
           }}
-          toggleSwitchAtTheEnd
         />
       )}
     />
@@ -148,13 +154,13 @@ const CheckedHostField = ({
   labelText?: string;
   placeholder: string;
   isFixed: boolean;
-  value: { isFixed: boolean; userId: number }[];
-  onChange?: (options: { isFixed: boolean; userId: number }[]) => void;
+  value: Host[];
+  onChange?: (options: Host[]) => void;
   options?: Options<CheckedSelectOption>;
   helperText?: React.ReactNode | string;
 } & Omit<Partial<ComponentProps<typeof CheckedTeamSelect>>, "onChange" | "value">) => {
   return (
-    <div className="bg-muted flex flex-col space-y-5 p-4">
+    <div className="flex flex-col rounded-md">
       <div>
         {labelText ? <Label>{labelText}</Label> : <></>}
         <CheckedTeamSelect
@@ -165,23 +171,22 @@ const CheckedHostField = ({
                 options.map((option) => ({
                   isFixed,
                   userId: parseInt(option.value, 10),
+                  priority: option.priority ?? 2,
                 }))
               );
           }}
           value={(value || [])
             .filter(({ isFixed: _isFixed }) => isFixed === _isFixed)
-            .map(
-              (host) =>
-                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                options.find((member) => member.value === host.userId.toString())!
-            )
+            .map((host) => {
+              const option = options.find((member) => member.value === host.userId.toString());
+              return option ? { ...option, priority: host.priority ?? 2, isFixed } : options[0];
+            })
             .filter(Boolean)}
           controlShouldRenderValue={false}
           options={options}
           placeholder={placeholder}
           {...rest}
         />
-        {helperText && <p className="text-subtle text-sm">{helperText}</p>}
       </div>
     </div>
   );
@@ -199,6 +204,158 @@ const FixedHostHelper = (
   </Trans>
 );
 
+const FixedHosts = ({
+  teamMembers,
+  value,
+  onChange,
+  assignAllTeamMembers,
+  setAssignAllTeamMembers,
+  isRoundRobinEvent = false,
+}: {
+  value: Host[];
+  onChange: (hosts: Host[]) => void;
+  teamMembers: TeamMember[];
+  assignAllTeamMembers: boolean;
+  setAssignAllTeamMembers: Dispatch<SetStateAction<boolean>>;
+  isRoundRobinEvent?: boolean;
+}) => {
+  const { t } = useLocale();
+  const { getValues, setValue } = useFormContext<FormValues>();
+
+  const hasActiveFixedHosts = isRoundRobinEvent && getValues("hosts").some((host) => host.isFixed);
+
+  const [isDisabled, setIsDisabled] = useState(hasActiveFixedHosts);
+
+  return (
+    <div className="mt-5 rounded-lg">
+      {!isRoundRobinEvent ? (
+        <>
+          <div className="border-subtle mt-5 rounded-t-md border p-6 pb-5">
+            <Label className="mb-1 text-sm font-semibold">{t("fixed_hosts")}</Label>
+            <p className="text-subtle max-w-full break-words text-sm leading-tight">{FixedHostHelper}</p>
+          </div>
+          <div className="border-subtle rounded-b-md border border-t-0">
+            <AddMembersWithSwitch
+              teamMembers={teamMembers}
+              value={value}
+              onChange={onChange}
+              assignAllTeamMembers={assignAllTeamMembers}
+              setAssignAllTeamMembers={setAssignAllTeamMembers}
+              automaticAddAllEnabled={!isRoundRobinEvent}
+              isFixed={true}
+              onActive={() =>
+                setValue(
+                  "hosts",
+                  teamMembers.map((teamMember) => ({
+                    isFixed: true,
+                    userId: parseInt(teamMember.value, 10),
+                    priority: 2,
+                  })),
+                  { shouldDirty: true }
+                )
+              }
+            />
+          </div>
+        </>
+      ) : (
+        <SettingsToggle
+          toggleSwitchAtTheEnd={true}
+          title={t("fixed_hosts")}
+          description={FixedHostHelper}
+          checked={isDisabled}
+          labelClassName="text-sm"
+          descriptionClassName=" text-sm text-subtle"
+          onCheckedChange={(checked) => {
+            if (!checked) {
+              const rrHosts = getValues("hosts")
+                .filter((host) => !host.isFixed)
+                .sort((a, b) => (b.priority ?? 2) - (a.priority ?? 2));
+              setValue("hosts", rrHosts, { shouldDirty: true });
+            }
+            setIsDisabled(checked);
+          }}
+          childrenClassName="lg:ml-0">
+          <div className="border-subtle flex flex-col gap-6 rounded-bl-md rounded-br-md border border-t-0">
+            <AddMembersWithSwitch
+              teamMembers={teamMembers}
+              value={value}
+              onChange={onChange}
+              assignAllTeamMembers={assignAllTeamMembers}
+              setAssignAllTeamMembers={setAssignAllTeamMembers}
+              automaticAddAllEnabled={!isRoundRobinEvent}
+              isFixed={true}
+              onActive={() =>
+                setValue(
+                  "hosts",
+                  teamMembers.map((teamMember) => ({
+                    isFixed: true,
+                    userId: parseInt(teamMember.value, 10),
+                    priority: 2,
+                  })),
+                  { shouldDirty: true }
+                )
+              }
+            />
+          </div>
+        </SettingsToggle>
+      )}
+    </div>
+  );
+};
+
+const AddMembersWithSwitch = ({
+  teamMembers,
+  value,
+  onChange,
+  assignAllTeamMembers,
+  setAssignAllTeamMembers,
+  automaticAddAllEnabled,
+  onActive,
+  isFixed,
+}: {
+  value: Host[];
+  onChange: (hosts: Host[]) => void;
+  teamMembers: TeamMember[];
+  assignAllTeamMembers: boolean;
+  setAssignAllTeamMembers: Dispatch<SetStateAction<boolean>>;
+  automaticAddAllEnabled: boolean;
+  onActive: () => void;
+  isFixed: boolean;
+}) => {
+  const { t } = useLocale();
+  const { setValue } = useFormContext<FormValues>();
+
+  return (
+    <div className="rounded-md ">
+      <div className="flex flex-col rounded-md px-6 pb-2 pt-6">
+        {automaticAddAllEnabled ? (
+          <div className="mb-2">
+            <AssignAllTeamMembers
+              assignAllTeamMembers={assignAllTeamMembers}
+              setAssignAllTeamMembers={setAssignAllTeamMembers}
+              onActive={onActive}
+              onInactive={() => setValue("hosts", [], { shouldDirty: true })}
+            />
+          </div>
+        ) : (
+          <></>
+        )}
+        {!assignAllTeamMembers || !automaticAddAllEnabled ? (
+          <CheckedHostField
+            value={value}
+            onChange={onChange}
+            isFixed={isFixed}
+            options={teamMembers.sort(sortByLabel)}
+            placeholder={t("add_attendees")}
+          />
+        ) : (
+          <></>
+        )}
+      </div>
+    </div>
+  );
+};
+
 const RoundRobinHosts = ({
   teamMembers,
   value,
@@ -206,68 +363,45 @@ const RoundRobinHosts = ({
   assignAllTeamMembers,
   setAssignAllTeamMembers,
 }: {
-  value: { isFixed: boolean; userId: number }[];
-  onChange: (hosts: { isFixed: boolean; userId: number }[]) => void;
-  teamMembers: {
-    value: string;
-    label: string;
-    avatar: string;
-    email: string;
-  }[];
+  value: Host[];
+  onChange: (hosts: Host[]) => void;
+  teamMembers: TeamMember[];
   assignAllTeamMembers: boolean;
   setAssignAllTeamMembers: Dispatch<SetStateAction<boolean>>;
 }) => {
   const { t } = useLocale();
-  const formMethods = useFormContext<FormValues>();
+
+  const { setValue } = useFormContext<FormValues>();
 
   return (
-    <div className="border-subtle mt-6 space-y-5 rounded-lg border px-4 py-6 sm:px-6">
-      <div className="flex flex-col gap-8">
-        <CheckedHostField
-          options={teamMembers.sort(sortByLabel)}
-          isFixed={true}
-          onChange={(changeValue) => {
-            onChange([...value.filter(({ isFixed }) => !isFixed), ...changeValue]);
-          }}
+    <div className="rounded-lg ">
+      <div className="border-subtle mt-5 rounded-t-md border p-6 pb-5">
+        <Label className="mb-1 text-sm font-semibold">{t("round_robin_hosts")}</Label>
+        <p className="text-subtle max-w-full break-words text-sm leading-tight">{t("round_robin_helper")}</p>
+      </div>
+      <div className="border-subtle rounded-b-md border border-t-0">
+        <AddMembersWithSwitch
+          teamMembers={teamMembers}
           value={value}
-          placeholder={t("add_fixed_hosts")}
-          labelText={t("fixed_hosts")}
-          helperText={FixedHostHelper}
+          onChange={onChange}
+          assignAllTeamMembers={assignAllTeamMembers}
+          setAssignAllTeamMembers={setAssignAllTeamMembers}
+          automaticAddAllEnabled={true}
+          isFixed={false}
+          onActive={() =>
+            setValue(
+              "hosts",
+              teamMembers
+                .map((teamMember) => ({
+                  isFixed: false,
+                  userId: parseInt(teamMember.value, 10),
+                  priority: 2,
+                }))
+                .sort((a, b) => b.priority - a.priority),
+              { shouldDirty: true }
+            )
+          }
         />
-
-        <div className="bg-muted flex flex-col">
-          <Label className="p-4">{t("round_robin_hosts")}</Label>
-          <div className="px-4 pb-2">
-            <AssignAllTeamMembers
-              assignAllTeamMembers={assignAllTeamMembers}
-              setAssignAllTeamMembers={setAssignAllTeamMembers}
-              onActive={() =>
-                formMethods.setValue(
-                  "hosts",
-                  teamMembers.map((teamMember) => ({
-                    isFixed: false,
-                    userId: parseInt(teamMember.value, 10),
-                  }))
-                )
-              }
-              onInactive={() => formMethods.setValue("hosts", [])}
-            />
-          </div>
-          {assignAllTeamMembers ? (
-            <div className="mb-4" />
-          ) : (
-            <CheckedHostField
-              options={teamMembers.sort(sortByLabel)}
-              onChange={(changeValue) =>
-                onChange([...value.filter(({ isFixed }) => isFixed), ...changeValue])
-              }
-              value={value}
-              isFixed={false}
-              placeholder={t("add_attendees")}
-              helperText={t("round_robin_helper")}
-            />
-          )}
-        </div>
       </div>
     </div>
   );
@@ -282,14 +416,14 @@ const ChildrenEventTypes = ({
   assignAllTeamMembers: boolean;
   setAssignAllTeamMembers: Dispatch<SetStateAction<boolean>>;
 }) => {
-  const formMethods = useFormContext<FormValues>();
+  const { setValue } = useFormContext<FormValues>();
   return (
     <div className="border-subtle mt-6 space-y-5 rounded-lg border px-4 py-6 sm:px-6">
       <div className="flex flex-col gap-4">
         <AssignAllTeamMembers
           assignAllTeamMembers={assignAllTeamMembers}
           setAssignAllTeamMembers={setAssignAllTeamMembers}
-          onActive={() => formMethods.setValue("children", childrenEventTypeOptions)}
+          onActive={() => setValue("children", childrenEventTypeOptions, { shouldDirty: true })}
         />
         {!assignAllTeamMembers ? (
           <Controller<FormValues>
@@ -311,19 +445,14 @@ const Hosts = ({
   assignAllTeamMembers,
   setAssignAllTeamMembers,
 }: {
-  teamMembers: {
-    value: string;
-    label: string;
-    avatar: string;
-    email: string;
-  }[];
+  teamMembers: TeamMember[];
   assignAllTeamMembers: boolean;
   setAssignAllTeamMembers: Dispatch<SetStateAction<boolean>>;
 }) => {
   const { t } = useLocale();
   const {
     control,
-    resetField,
+    setValue,
     getValues,
     formState: { submitCount },
   } = useFormContext<FormValues>();
@@ -343,66 +472,52 @@ const Hosts = ({
       initialValue.current = { hosts: getValues("hosts"), schedulingType, submitCount };
       return;
     }
-    resetField("hosts", {
-      defaultValue: initialValue.current.schedulingType === schedulingType ? initialValue.current.hosts : [],
-    });
-  }, [schedulingType, resetField, getValues, submitCount]);
+    setValue(
+      "hosts",
+      initialValue.current.schedulingType === schedulingType ? initialValue.current.hosts : [],
+      { shouldDirty: true }
+    );
+  }, [schedulingType, setValue, getValues, submitCount]);
 
-  const formMethods = useFormContext<FormValues>();
   return (
     <Controller<FormValues>
       name="hosts"
       render={({ field: { onChange, value } }) => {
         const schedulingTypeRender = {
           COLLECTIVE: (
-            <div className="border-subtle mt-6 space-y-5 rounded-lg border px-4 py-6 sm:px-6">
-              <div className="flex flex-col gap-4">
-                <AssignAllTeamMembers
-                  assignAllTeamMembers={assignAllTeamMembers}
-                  setAssignAllTeamMembers={setAssignAllTeamMembers}
-                  onActive={() =>
-                    formMethods.setValue(
-                      "hosts",
-                      teamMembers.map((teamMember) => ({
-                        isFixed: true,
-                        userId: parseInt(teamMember.value, 10),
-                      }))
-                    )
-                  }
-                  onInactive={() => formMethods.setValue("hosts", [])}
-                />
-                {assignAllTeamMembers ? (
-                  <></>
-                ) : (
-                  <CheckedHostField
-                    value={value}
-                    onChange={onChange}
-                    isFixed={true}
-                    options={teamMembers.sort(sortByLabel)}
-                    placeholder={t("add_attendees")}
-                    labelText={t("team")}
-                  />
-                )}
-              </div>
-            </div>
+            <FixedHosts
+              teamMembers={teamMembers}
+              value={value}
+              onChange={onChange}
+              assignAllTeamMembers={assignAllTeamMembers}
+              setAssignAllTeamMembers={setAssignAllTeamMembers}
+            />
           ),
           ROUND_ROBIN: (
             <>
-              <RoundRobinHosts
+              <FixedHosts
+                teamMembers={teamMembers}
+                value={value}
+                onChange={(changeValue) => {
+                  onChange([...value.filter((host: Host) => !host.isFixed), ...changeValue]);
+                }}
+                assignAllTeamMembers={assignAllTeamMembers}
+                setAssignAllTeamMembers={setAssignAllTeamMembers}
+                isRoundRobinEvent={true}
+              />
+              <RoundRobinHosts
+                teamMembers={teamMembers}
+                value={value}
+                onChange={(changeValue) => {
+                  onChange(
+                    [...value.filter((host: Host) => host.isFixed), ...changeValue].sort(
+                      (a, b) => b.priority - a.priority
+                    )
+                  );
+                }}
                 assignAllTeamMembers={assignAllTeamMembers}
                 setAssignAllTeamMembers={setAssignAllTeamMembers}
-                teamMembers={teamMembers}
-                onChange={onChange}
-                value={value}
               />
-              {/*<TextField
-        required
-        type="number"
-        label={t("minimum_round_robin_hosts_count")}
-        defaultValue={1}
-        {...formMethods.register("minimumHostCount")}
-        addOnSuffix={<>{t("hosts")}</>}
-                />*/}
             </>
           ),
           MANAGED: <></>,
@@ -449,39 +564,47 @@ export const EventTeamTab = ({
     );
   });
   const isManagedEventType = eventType.schedulingType === SchedulingType.MANAGED;
-  const formMethods = useFormContext<FormValues>();
+  const { getValues, setValue } = useFormContext<FormValues>();
   const [assignAllTeamMembers, setAssignAllTeamMembers] = useState<boolean>(
-    formMethods.getValues("assignAllTeamMembers") ?? false
+    getValues("assignAllTeamMembers") ?? false
   );
 
   return (
     <div>
       {team && !isManagedEventType && (
-        <div className="space-y-5">
-          <div className="flex flex-col">
-            <Label>{t("scheduling_type")}</Label>
-            <Controller<FormValues>
-              name="schedulingType"
-              render={({ field: { value, onChange } }) => (
-                <Select
-                  options={schedulingTypeOptions}
-                  value={schedulingTypeOptions.find((opt) => opt.value === value)}
-                  className="w-full"
-                  onChange={(val) => {
-                    onChange(val?.value);
-                    formMethods.setValue("assignAllTeamMembers", false);
-                    setAssignAllTeamMembers(false);
-                  }}
-                />
-              )}
-            />
+        <>
+          <div className="border-subtle flex flex-col rounded-md">
+            <div className="border-subtle rounded-t-md border p-6 pb-5">
+              <Label className="mb-1 text-sm font-semibold">{t("assignment")}</Label>
+              <p className="text-subtle max-w-full break-words text-sm leading-tight">
+                {t("assignment_description")}
+              </p>
+            </div>
+            <div className="border-subtle rounded-b-md border border-t-0 p-6">
+              <Label>{t("scheduling_type")}</Label>
+              <Controller<FormValues>
+                name="schedulingType"
+                render={({ field: { value, onChange } }) => (
+                  <Select
+                    options={schedulingTypeOptions}
+                    value={schedulingTypeOptions.find((opt) => opt.value === value)}
+                    className="w-full"
+                    onChange={(val) => {
+                      onChange(val?.value);
+                      setValue("assignAllTeamMembers", false, { shouldDirty: true });
+                      setAssignAllTeamMembers(false);
+                    }}
+                  />
+                )}
+              />
+            </div>
           </div>
           <Hosts
             assignAllTeamMembers={assignAllTeamMembers}
             setAssignAllTeamMembers={setAssignAllTeamMembers}
             teamMembers={teamMembersOptions}
           />
-        </div>
+        </>
       )}
       {team && isManagedEventType && (
         <ChildrenEventTypes

apps/web/components/eventtype/EventTypeSingleLayout.tsx

@@ -14,6 +14,7 @@ import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { HttpError } from "@calcom/lib/http-error";
 import { SchedulingType } from "@calcom/prisma/enums";
 import { trpc, TRPCClientError } from "@calcom/trpc/react";
+import type { DialogProps } from "@calcom/ui";
 import {
   Button,
   ButtonGroup,
@@ -133,6 +134,60 @@ function getNavigation({
   ];
 }
 
+function DeleteDialog({
+  isManagedEvent,
+  eventTypeId,
+  open,
+  onOpenChange,
+}: { isManagedEvent: string; eventTypeId: number } & Pick<DialogProps, "open" | "onOpenChange">) {
+  const utils = trpc.useContext();
+  const { t } = useLocale();
+  const router = useRouter();
+  const deleteMutation = trpc.viewer.eventTypes.delete.useMutation({
+    onSuccess: async () => {
+      await utils.viewer.eventTypes.invalidate();
+      showToast(t("event_type_deleted_successfully"), "success");
+      router.push("/event-types");
+      onOpenChange?.(false);
+    },
+    onError: (err) => {
+      if (err instanceof HttpError) {
+        const message = `${err.statusCode}: ${err.message}`;
+        showToast(message, "error");
+        onOpenChange?.(false);
+      } else if (err instanceof TRPCClientError) {
+        showToast(err.message, "error");
+      }
+    },
+  });
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <ConfirmationDialogContent
+        isPending={deleteMutation.isPending}
+        variety="danger"
+        title={t(`delete${isManagedEvent}_event_type`)}
+        confirmBtnText={t(`confirm_delete_event_type`)}
+        loadingText={t(`confirm_delete_event_type`)}
+        onConfirm={(e) => {
+          e.preventDefault();
+          deleteMutation.mutate({ id: eventTypeId });
+        }}>
+        <p className="mt-5">
+          <Trans
+            i18nKey={`delete${isManagedEvent}_event_type_description`}
+            components={{ li: <li />, ul: <ul className="ml-4 list-disc" /> }}>
+            <ul>
+              <li>Members assigned to this event type will also have their event types deleted.</li>
+              <li>Anyone who they&apos;ve shared their link with will no longer be able to book using it.</li>
+            </ul>
+          </Trans>
+        </p>
+      </ConfirmationDialogContent>
+    </Dialog>
+  );
+}
+
 function EventTypeSingleLayout({
   children,
   eventType,
@@ -149,9 +204,7 @@ function EventTypeSingleLayout({
   bookerUrl,
   activeWebhooksNumber,
 }: Props) {
-  const utils = trpc.useContext();
   const { t } = useLocale();
-  const router = useRouter();
   const [deleteDialogOpen, setDeleteDialogOpen] = useState(false);
 
   const hasPermsToDelete =
@@ -160,24 +213,6 @@ function EventTypeSingleLayout({
     formMethods.getValues("schedulingType") === SchedulingType.MANAGED ||
     isUserOrganizationAdmin;
 
-  const deleteMutation = trpc.viewer.eventTypes.delete.useMutation({
-    onSuccess: async () => {
-      await utils.viewer.eventTypes.invalidate();
-      showToast(t("event_type_deleted_successfully"), "success");
-      router.push("/event-types");
-      setDeleteDialogOpen(false);
-    },
-    onError: (err) => {
-      if (err instanceof HttpError) {
-        const message = `${err.statusCode}: ${err.message}`;
-        showToast(message, "error");
-        setDeleteDialogOpen(false);
-      } else if (err instanceof TRPCClientError) {
-        showToast(err.message, "error");
-      }
-    },
-  });
-
   const { isManagedEventType, isChildrenManagedEventType } = useLockedFieldsManager(
     formMethods.getValues(),
     t("locked_fields_admin_description"),
@@ -308,7 +343,7 @@ function EventTypeSingleLayout({
                       id="hiddenSwitch"
                       checked={!formMethods.watch("hidden")}
                       onCheckedChange={(e) => {
-                        formMethods.setValue("hidden", !e);
+                        formMethods.setValue("hidden", !e, { shouldDirty: true });
                       }}
                     />
                   </div>
@@ -352,7 +387,7 @@ function EventTypeSingleLayout({
                   StartIcon={Code}
                   color="secondary"
                   variant="icon"
-                  namespace={eventType.slug}
+                  namespace=""
                   tooltip={t("embed")}
                   tooltipSide="bottom"
                   tooltipOffset={4}
@@ -424,7 +459,7 @@ function EventTypeSingleLayout({
                   id="hiddenSwitch"
                   checked={!formMethods.watch("hidden")}
                   onCheckedChange={(e) => {
-                    formMethods.setValue("hidden", !e);
+                    formMethods.setValue("hidden", !e, { shouldDirty: true });
                   }}
                 />
               </div>
@@ -435,6 +470,7 @@ function EventTypeSingleLayout({
             className="ml-4 lg:ml-0"
             type="submit"
             loading={isUpdateMutationLoading}
+            disabled={!formMethods.formState.isDirty}
             data-testid="update-eventtype"
             form="event-type-form">
             {t("save")}
@@ -467,31 +503,13 @@ function EventTypeSingleLayout({
           </div>
         </div>
       </Suspense>
-      <Dialog open={deleteDialogOpen} onOpenChange={setDeleteDialogOpen}>
-        <ConfirmationDialogContent
-          isPending={deleteMutation.isPending}
-          variety="danger"
-          title={t(`delete${isManagedEvent}_event_type`)}
-          confirmBtnText={t(`confirm_delete_event_type`)}
-          loadingText={t(`confirm_delete_event_type`)}
-          onConfirm={(e) => {
-            e.preventDefault();
-            deleteMutation.mutate({ id: formMethods.getValues("id") });
-          }}>
-          <p className="mt-5">
-            <Trans
-              i18nKey={`delete${isManagedEvent}_event_type_description`}
-              components={{ li: <li />, ul: <ul className="ml-4 list-disc" /> }}>
-              <ul>
-                <li>Members assigned to this event type will also have their event types deleted.</li>
-                <li>
-                  Anyone who they&apos;ve shared their link with will no longer be able to book using it.
-                </li>
-              </ul>
-            </Trans>
-          </p>
-        </ConfirmationDialogContent>
-      </Dialog>
+      <DeleteDialog
+        eventTypeId={eventType.id}
+        isManagedEvent={isManagedEvent}
+        open={deleteDialogOpen}
+        onOpenChange={setDeleteDialogOpen}
+      />
+
       <EventTypeEmbedDialog />
     </Shell>
   );

apps/web/components/eventtype/InstantEventController.tsx

@@ -81,10 +81,10 @@ export default function InstantEventController({
                   data-testid="instant-event-check"
                   onCheckedChange={(e) => {
                     if (!e) {
-                      formMethods.setValue("isInstantEvent", false);
+                      formMethods.setValue("isInstantEvent", false, { shouldDirty: true });
                       setInstantEventState(false);
                     } else {
-                      formMethods.setValue("isInstantEvent", true);
+                      formMethods.setValue("isInstantEvent", true, { shouldDirty: true });
                       setInstantEventState(true);
                     }
                   }}>

apps/web/components/eventtype/RecurringEventController.tsx

@@ -66,7 +66,7 @@ export default function RecurringEventController({
               data-testid="recurring-event-check"
               onCheckedChange={(e) => {
                 if (!e) {
-                  formMethods.setValue("recurringEvent", null);
+                  formMethods.setValue("recurringEvent", null, { shouldDirty: true });
                   setRecurringEventState(null);
                 } else {
                   const newVal = eventType.recurringEvent || {
@@ -74,7 +74,7 @@ export default function RecurringEventController({
                     count: 12,
                     freq: Frequency.WEEKLY,
                   };
-                  formMethods.setValue("recurringEvent", newVal);
+                  formMethods.setValue("recurringEvent", newVal, { shouldDirty: true });
                   setRecurringEventState(newVal);
                 }
               }}>
@@ -95,7 +95,7 @@ export default function RecurringEventController({
                             ...recurringEventState,
                             interval: parseInt(event?.target.value),
                           };
-                          formMethods.setValue("recurringEvent", newVal);
+                          formMethods.setValue("recurringEvent", newVal, { shouldDirty: true });
                           setRecurringEventState(newVal);
                         }}
                       />
@@ -110,7 +110,7 @@ export default function RecurringEventController({
                             ...recurringEventState,
                             freq: parseInt(event?.value || `${Frequency.WEEKLY}`),
                           };
-                          formMethods.setValue("recurringEvent", newVal);
+                          formMethods.setValue("recurringEvent", newVal, { shouldDirty: true });
                           setRecurringEventState(newVal);
                         }}
                       />
@@ -129,7 +129,7 @@ export default function RecurringEventController({
                             ...recurringEventState,
                             count: parseInt(event?.target.value),
                           };
-                          formMethods.setValue("recurringEvent", newVal);
+                          formMethods.setValue("recurringEvent", newVal, { shouldDirty: true });
                           setRecurringEventState(newVal);
                         }}
                       />

apps/web/components/eventtype/RequiresConfirmationController.tsx

@@ -37,7 +37,7 @@ export default function RequiresConfirmationController({
 
   useEffect(() => {
     if (!requiresConfirmation) {
-      formMethods.setValue("metadata.requiresConfirmationThreshold", undefined);
+      formMethods.setValue("metadata.requiresConfirmationThreshold", undefined, { shouldDirty: true });
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [requiresConfirmation]);
@@ -82,7 +82,7 @@ export default function RequiresConfirmationController({
               checked={requiresConfirmation}
               LockedIcon={requiresConfirmationLockedProps.LockedIcon}
               onCheckedChange={(val) => {
-                formMethods.setValue("requiresConfirmation", val);
+                formMethods.setValue("requiresConfirmation", val, { shouldDirty: true });
                 onRequiresConfirmation(val);
               }}>
               <div className="border-subtle rounded-b-lg border border-t-0 p-6">
@@ -96,16 +96,19 @@ export default function RequiresConfirmationController({
                   }
                   onValueChange={(val) => {
                     if (val === "always") {
-                      formMethods.setValue("requiresConfirmation", true);
+                      formMethods.setValue("requiresConfirmation", true, { shouldDirty: true });
                       onRequiresConfirmation(true);
-                      formMethods.setValue("metadata.requiresConfirmationThreshold", undefined);
+                      formMethods.setValue("metadata.requiresConfirmationThreshold", undefined, {
+                        shouldDirty: true,
+                      });
                       setRequiresConfirmationSetup(undefined);
                     } else if (val === "notice") {
-                      formMethods.setValue("requiresConfirmation", true);
+                      formMethods.setValue("requiresConfirmation", true, { shouldDirty: true });
                       onRequiresConfirmation(true);
                       formMethods.setValue(
                         "metadata.requiresConfirmationThreshold",
-                        requiresConfirmationSetup || defaultRequiresConfirmationSetup
+                        requiresConfirmationSetup || defaultRequiresConfirmationSetup,
+                        { shouldDirty: true }
                       );
                     }
                   }}>
@@ -146,7 +149,8 @@ export default function RequiresConfirmationController({
                                         });
                                         formMethods.setValue(
                                           "metadata.requiresConfirmationThreshold.time",
-                                          val
+                                          val,
+                                          { shouldDirty: true }
                                         );
                                       }}
                                       className="border-default !m-0 block w-16 rounded-r-none border-r-0 text-sm [appearance:textfield] focus:z-10 focus:border-r"
@@ -171,7 +175,8 @@ export default function RequiresConfirmationController({
                                           });
                                           formMethods.setValue(
                                             "metadata.requiresConfirmationThreshold.unit",
-                                            opt?.value as UnitTypeLongPlural
+                                            opt?.value as UnitTypeLongPlural,
+                                            { shouldDirty: true }
                                           );
                                         }}
                                         defaultValue={defaultValue}

apps/web/components/getting-started/steps-views/UserProfile.tsx

@@ -8,7 +8,6 @@ import { md } from "@calcom/lib/markdownIt";
 import { telemetryEventTypes, useTelemetry } from "@calcom/lib/telemetry";
 import turndown from "@calcom/lib/turndownService";
 import { trpc } from "@calcom/trpc/react";
-import type { Ensure } from "@calcom/types/utils";
 import { Button, Editor, ImageUploader, Label, showToast } from "@calcom/ui";
 import { UserAvatar } from "@calcom/ui";
 import { ArrowRight } from "@calcom/ui/components/icon";
@@ -97,18 +96,10 @@ const UserProfile = () => {
     },
   ];
 
-  const organization =
-    user.organization && user.organization.id
-      ? {
-          ...(user.organization as Ensure<typeof user.organization, "id">),
-          slug: user.organization.slug || null,
-          requestedSlug: user.organization.metadata?.requestedSlug || null,
-        }
-      : null;
   return (
     <form onSubmit={onSubmit}>
       <div className="flex flex-row items-center justify-start rtl:justify-end">
-        {user && <UserAvatar size="lg" user={user} previewSrc={imageSrc} organization={organization} />}
+        {user && <UserAvatar size="lg" user={user} previewSrc={imageSrc} />}
         <input
           ref={avatarRef}
           type="hidden"

apps/web/components/setup/AdminUser.tsx

@@ -3,7 +3,7 @@ import classNames from "classnames";
 import { signIn } from "next-auth/react";
 import React from "react";
 import { Controller, FormProvider, useForm } from "react-hook-form";
-import * as z from "zod";
+import { z } from "zod";
 
 import { isPasswordValid } from "@calcom/features/auth/lib/isPasswordValid";
 import { WEBSITE_URL } from "@calcom/lib/constants";

apps/web/components/setup/EnterpriseLicense.tsx

@@ -3,7 +3,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { noop } from "lodash";
 import { useCallback, useState } from "react";
 import { Controller, FormProvider, useForm, useFormState } from "react-hook-form";
-import * as z from "zod";
+import { z } from "zod";
 
 import { classNames } from "@calcom/lib";
 import { CONSOLE_URL } from "@calcom/lib/constants";

apps/web/components/team/screens/Team.tsx

@@ -5,11 +5,16 @@ import { useRouterQuery } from "@calcom/lib/hooks/useRouterQuery";
 import { md } from "@calcom/lib/markdownIt";
 import { markdownToSafeHTML } from "@calcom/lib/markdownToSafeHTML";
 import type { TeamWithMembers } from "@calcom/lib/server/queries/teams";
+import type { UserProfile } from "@calcom/types/UserProfile";
 import { UserAvatar } from "@calcom/ui";
 
 type TeamType = Omit<NonNullable<TeamWithMembers>, "inviteToken">;
 type MembersType = TeamType["members"];
-type MemberType = Pick<MembersType[number], "id" | "name" | "bio" | "username" | "organizationId"> & {
+type MemberType = Pick<
+  MembersType[number],
+  "id" | "name" | "bio" | "username" | "organizationId" | "avatarUrl"
+> & {
+  profile: Omit<UserProfile, "upId">;
   safeBio: string | null;
   bookerUrl: string;
 };
@@ -27,7 +32,7 @@ const Member = ({ member, teamName }: { member: MemberType; teamName: string | n
       key={member.id}
       href={{ pathname: `${member.bookerUrl}/${member.username}`, query: queryParamsToForward }}>
       <div className="sm:min-w-80 sm:max-w-80 bg-default hover:bg-muted border-subtle group flex min-h-full flex-col space-y-2 rounded-md border p-4 hover:cursor-pointer">
-        <UserAvatar size="md" user={member} />
+        <UserAvatar noOrganizationIndicator size="md" user={member} />
         <section className="mt-2 line-clamp-4 w-full space-y-1">
           <p className="text-default font-medium">{member.name}</p>
           <div className="text-subtle line-clamp-3 overflow-ellipsis text-sm font-normal">

apps/web/components/ui/UsernameAvailability/index.tsx

@@ -4,7 +4,7 @@ import { useState } from "react";
 import { Controller, useForm } from "react-hook-form";
 
 import { useOrgBranding } from "@calcom/features/ee/organizations/context/provider";
-import { CAL_URL, IS_SELF_HOSTED } from "@calcom/lib/constants";
+import { WEBSITE_URL, IS_SELF_HOSTED } from "@calcom/lib/constants";
 import type { TRPCClientErrorLike } from "@calcom/trpc/client";
 import { trpc } from "@calcom/trpc/react";
 import type { AppRouter } from "@calcom/trpc/server/routers/_app";
@@ -45,7 +45,7 @@ export const UsernameAvailabilityField = ({
 
   const usernamePrefix = orgBranding
     ? orgBranding?.fullDomain.replace(/^(https?:|)\/\//, "")
-    : `${CAL_URL?.replace(/^(https?:|)\/\//, "")}`;
+    : `${WEBSITE_URL?.replace(/^(https?:|)\/\//, "")}`;
 
   return (
     <Controller

apps/web/components/ui/form/LocationSelect.tsx

@@ -34,6 +34,7 @@ export default function LocationSelect(props: Props<LocationOption, false, Group
     <Select<LocationOption>
       name="location"
       id="location-select"
+      data-testid="location-select"
       components={{
         Option: (props) => {
           return (

apps/web/lib/d/[link]/[slug]/getServerSideProps.tsx

@@ -5,6 +5,7 @@ import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
 import { getBookingForReschedule, getMultipleDurationValue } from "@calcom/features/bookings/lib/get-booking";
 import type { GetBookingType } from "@calcom/features/bookings/lib/get-booking";
 import { orgDomainConfig } from "@calcom/features/ee/organizations/lib/orgDomains";
+import { UserRepository } from "@calcom/lib/server/repository/user";
 import slugify from "@calcom/lib/slugify";
 import prisma from "@calcom/prisma";
 
@@ -56,19 +57,9 @@ async function getUserPageProps(context: GetServerSidePropsContext) {
     return notFound;
   }
 
-  const user = await prisma.user.findFirst({
-    where: {
-      username,
-      organization: isValidOrgDomain
-        ? {
-            slug: currentOrgDomain,
-          }
-        : null,
-    },
-    select: {
-      away: true,
-      hideBranding: true,
-    },
+  const [user] = await UserRepository.findUsersByUsername({
+    usernameList: [username],
+    orgSlug: org,
   });
 
   if (!user) {

apps/web/lib/event-types/getServerSideProps.tsx

@@ -0,0 +1,21 @@
+import type { GetServerSidePropsContext } from "next";
+
+import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
+
+import { ssrInit } from "@server/lib/ssr";
+
+export const getServerSideProps = async (context: GetServerSidePropsContext) => {
+  const ssr = await ssrInit(context);
+  const session = await getServerSession({ req: context.req, res: context.res });
+
+  if (!session) {
+    return {
+      redirect: {
+        permanent: false,
+        destination: "/auth/login",
+      },
+    };
+  }
+
+  return { props: { trpcState: ssr.dehydrate() } };
+};

apps/web/lib/hooks/useRouterQuery.ts

@@ -11,7 +11,12 @@ export default function useRouterQuery<T extends string>(name: T) {
   const setQuery = useCallback(
     (newValue: string | number | null | undefined) => {
       const _searchParams = new URLSearchParams(searchParams ?? undefined);
-      _searchParams.set(name, newValue as string);
+      if (typeof newValue === "undefined") {
+        // when newValue is of type undefined, clear the search param.
+        _searchParams.delete(name);
+      } else {
+        _searchParams.set(name, newValue as string);
+      }
       router.replace(`${pathname}?${_searchParams.toString()}`);
     },
     [name, pathname, router, searchParams]

apps/web/lib/orgMigration.test.ts

@@ -1589,17 +1589,20 @@ async function createTeamOutsideOrg(
   });
 }
 
-async function createUserOutsideOrg(data: Omit<Prisma.UserCreateArgs["data"], "organization">) {
+async function createUserOutsideOrg(
+  data: Omit<Prisma.UserCreateArgs["data"], "organization" | "movedToProfile">
+) {
   return await prismock.user.create({
     data: {
       ...data,
+      movedToProfileId: null,
       organizationId: null,
     },
   });
 }
 
 async function createUserInsideTheOrg(
-  data: Omit<Prisma.UserUncheckedCreateInput, "organization" | "organizationId" | "id">,
+  data: Omit<Prisma.UserUncheckedCreateInput, "organization" | "organizationId" | "id" | "movedToProfileId">,
   orgId: number
 ) {
   const org = await prismock.team.findUnique({

apps/web/lib/orgMigration.ts

@@ -3,6 +3,7 @@ import { getOrgFullOrigin } from "@calcom/features/ee/organizations/lib/orgDomai
 import { HttpError } from "@calcom/lib/http-error";
 import logger from "@calcom/lib/logger";
 import { safeStringify } from "@calcom/lib/safeStringify";
+import { ProfileRepository } from "@calcom/lib/server/repository/profile";
 import prisma from "@calcom/prisma";
 import type { Team, User } from "@calcom/prisma/client";
 import { RedirectType } from "@calcom/prisma/client";
@@ -327,7 +328,7 @@ async function setOrgSlugIfNotSet(
     slug: string | null;
   },
   orgMetadata: {
-    requestedSlug?: string | undefined;
+    requestedSlug?: string | null | undefined;
   },
   targetOrgId: number
 ) {
@@ -348,7 +349,7 @@ async function setOrgSlugIfNotSet(
 
 function assertUserPartOfOrgAndRemigrationAllowed(
   userToMoveToOrg: {
-    organizationId: User["organizationId"];
+    organizationId: number | null;
   },
   targetOrgId: number,
   targetOrgUsername: string,
@@ -384,7 +385,7 @@ async function getTeamOrThrowError(targetOrgId: number) {
 
 function assertUserPartOfOtherOrg(
   userToMoveToOrg: {
-    organizationId: User["organizationId"];
+    organizationId: number | null;
   } | null,
   userName: string | undefined,
   userId: number | undefined,
@@ -594,6 +595,35 @@ async function dbMoveUserToOrg({
       },
     },
   });
+
+  await prisma.profile.upsert({
+    create: {
+      uid: ProfileRepository.generateProfileUid(),
+      userId: userToMoveToOrg.id,
+      organizationId: targetOrgId,
+      username: targetOrgUsername,
+      movedFromUser: {
+        connect: {
+          id: userToMoveToOrg.id,
+        },
+      },
+    },
+    update: {
+      organizationId: targetOrgId,
+      username: targetOrgUsername,
+      movedFromUser: {
+        connect: {
+          id: userToMoveToOrg.id,
+        },
+      },
+    },
+    where: {
+      userId_organizationId: {
+        userId: userToMoveToOrg.id,
+        organizationId: targetOrgId,
+      },
+    },
+  });
 }
 
 async function moveTeamsWithoutMembersToOrg({
@@ -841,6 +871,10 @@ async function dbRemoveUserFromOrg({
       },
     },
   });
+
+  await ProfileRepository.deleteMany({
+    userIds: [userToRemoveFromOrg.id],
+  });
 }
 
 async function removeMembership({

apps/web/lib/team/[slug]/[type]/getServerSideProps.tsx

@@ -2,7 +2,7 @@ import type { GetServerSidePropsContext } from "next";
 import { z } from "zod";
 
 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
-import { getBookingForReschedule, getMultipleDurationValue } from "@calcom/features/bookings/lib/get-booking";
+import { getBookingForReschedule } from "@calcom/features/bookings/lib/get-booking";
 import type { GetBookingType } from "@calcom/features/bookings/lib/get-booking";
 import { getSlugOrRequestedSlug } from "@calcom/features/ee/organizations/lib/orgDomains";
 import { orgDomainConfig } from "@calcom/features/ee/organizations/lib/orgDomains";
@@ -82,12 +82,11 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) =>
 
   return {
     props: {
-      entity: eventData.entity,
-      duration: getMultipleDurationValue(
-        eventData.metadata?.multipleDuration,
-        queryDuration,
-        eventData.length
-      ),
+      eventData: {
+        entity: eventData.entity,
+        length: eventData.length,
+        metadata: eventData.metadata,
+      },
       booking,
       away: false,
       user: teamSlug,

apps/web/lib/team/[slug]/getServerSideProps.tsx

@@ -121,7 +121,9 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) =>
         return {
           name: member.name,
           id: member.id,
+          avatarUrl: member.avatarUrl,
           bio: member.bio,
+          profile: member.profile,
           subteams: member.subteams,
           username: member.username,
           accepted: member.accepted,

apps/web/middleware.ts

@@ -11,6 +11,14 @@ import { csp } from "@lib/csp";
 
 import { abTestMiddlewareFactory } from "./abTest/middlewareFactory";
 
+const safeGet = async <T = any>(key: string): Promise<T | undefined> => {
+  try {
+    return get<T>(key);
+  } catch (error) {
+    // Don't crash if EDGE_CONFIG env var is missing
+  }
+};
+
 const middleware = async (req: NextRequest): Promise<NextResponse<unknown>> => {
   const url = req.nextUrl;
   const requestHeaders = new Headers(req.headers);
@@ -24,18 +32,12 @@ const middleware = async (req: NextRequest): Promise<NextResponse<unknown>> => {
     //
     //     - For this reason our matchers are sufficient for an app-wide maintenance page.
     //
-    try {
-      // Check whether the maintenance page should be shown
-      const isInMaintenanceMode = await get<boolean>("isInMaintenanceMode");
-      // If is in maintenance mode, point the url pathname to the maintenance page
-      if (isInMaintenanceMode) {
-        req.nextUrl.pathname = `/maintenance`;
-        return NextResponse.rewrite(req.nextUrl);
-      }
-    } catch (error) {
-      // show the default page if EDGE_CONFIG env var is missing,
-      // but log the error to the console
-      // console.error(error);
+    // Check whether the maintenance page should be shown
+    const isInMaintenanceMode = await safeGet<boolean>("isInMaintenanceMode");
+    // If is in maintenance mode, point the url pathname to the maintenance page
+    if (isInMaintenanceMode) {
+      req.nextUrl.pathname = `/maintenance`;
+      return NextResponse.rewrite(req.nextUrl);
     }
   }
 
@@ -60,6 +62,14 @@ const middleware = async (req: NextRequest): Promise<NextResponse<unknown>> => {
     requestHeaders.set("x-cal-timezone", req.headers.get("x-vercel-ip-timezone") ?? "");
   }
 
+  if (url.pathname.startsWith("/api/auth/signup")) {
+    const isSignupDisabled = await safeGet<boolean>("isSignupDisabled");
+    // If is in maintenance mode, point the url pathname to the maintenance page
+    if (isSignupDisabled) {
+      return NextResponse.json({ error: "Signup is disabled" }, { status: 503 });
+    }
+  }
+
   if (url.pathname.startsWith("/auth/login") || url.pathname.startsWith("/login")) {
     // Use this header to actually enforce CSP, otherwise it is running in Report Only mode on all pages.
     requestHeaders.set("x-csp-enforce", "true");
@@ -114,6 +124,7 @@ export const config = {
   // https://github.com/vercel/next.js/discussions/42458
   matcher: [
     "/:path*/embed",
+    "/api/auth/signup",
     "/api/trpc/:path*",
     "/login",
     "/auth/login",

apps/web/modules/bookings/views/bookings-listing-view.tsx

@@ -10,7 +10,7 @@ import { FilterToggle } from "@calcom/features/bookings/components/FilterToggle"
 import { FiltersContainer } from "@calcom/features/bookings/components/FiltersContainer";
 import type { filterQuerySchema } from "@calcom/features/bookings/lib/useFilterQuery";
 import { useFilterQuery } from "@calcom/features/bookings/lib/useFilterQuery";
-import { ShellMain } from "@calcom/features/shell/Shell";
+import Shell from "@calcom/features/shell/Shell";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { useParamsWithFallback } from "@calcom/lib/hooks/useParamsWithFallback";
 import type { RouterOutputs } from "@calcom/trpc/react";
@@ -147,7 +147,13 @@ export default function Bookings() {
   const [animationParentRef] = useAutoAnimate<HTMLDivElement>();
 
   return (
-    <ShellMain hideHeadingOnMobile heading={t("bookings")} subtitle={t("bookings_description")}>
+    <Shell
+      withoutMain={false}
+      hideHeadingOnMobile
+      heading={t("bookings")}
+      subtitle={t("bookings_description")}
+      title="Bookings"
+      description="Create events to share for people to book on your calendar.">
       <div className="flex flex-col">
         <div className="flex flex-row flex-wrap justify-between">
           <HorizontalTabs tabs={tabs} />
@@ -247,6 +253,6 @@ export default function Bookings() {
           </div>
         </main>
       </div>
-    </ShellMain>
+    </Shell>
   );
 }

apps/web/modules/bookings/views/bookings-single-view.getServerSideProps.tsx

@@ -82,6 +82,7 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
       cancellationReason: true,
       responses: true,
       rejectionReason: true,
+      userPrimaryEmail: true,
       user: {
         select: {
           id: true,

apps/web/modules/bookings/views/bookings-single-view.tsx

@@ -203,7 +203,7 @@ export default function Success(props: PageProps) {
       duration: calculatedDuration,
       organizer: {
         name: users[0].name || "Nameless",
-        email: users[0].email || "Email-less",
+        email: bookingInfo?.userPrimaryEmail || users[0].email || "Email-less",
         timeZone: users[0].timeZone,
       },
       confirmed: !needsConfirmation,
@@ -450,7 +450,9 @@ export default function Success(props: PageProps) {
                                 </span>
                                 <Badge variant="blue">{t("Host")}</Badge>
                               </div>
-                              <p className="text-default">{bookingInfo.user.email}</p>
+                              <p className="text-default">
+                                {bookingInfo?.userPrimaryEmail ?? bookingInfo.user.email}
+                              </p>
                             </div>
                           )}
                           {bookingInfo?.attendees.map((attendee) => (

apps/web/modules/event-types/views/event-types-listing-view.tsx

@@ -16,18 +16,20 @@ import CreateEventTypeDialog from "@calcom/features/eventtypes/components/Create
 import { DuplicateDialog } from "@calcom/features/eventtypes/components/DuplicateDialog";
 import { TeamsFilter } from "@calcom/features/filters/components/TeamsFilter";
 import { getTeamsFiltersFromQuery } from "@calcom/features/filters/lib/getTeamsFiltersFromQuery";
-import { ShellMain } from "@calcom/features/shell/Shell";
+import Shell from "@calcom/features/shell/Shell";
 import { APP_NAME, WEBAPP_URL } from "@calcom/lib/constants";
-import { CAL_URL } from "@calcom/lib/constants";
+import { WEBSITE_URL } from "@calcom/lib/constants";
 import { useCompatSearchParams } from "@calcom/lib/hooks/useCompatSearchParams";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import useMediaQuery from "@calcom/lib/hooks/useMediaQuery";
 import { useRouterQuery } from "@calcom/lib/hooks/useRouterQuery";
 import { useTypedQuery } from "@calcom/lib/hooks/useTypedQuery";
 import { HttpError } from "@calcom/lib/http-error";
+import type { User } from "@calcom/prisma/client";
 import { SchedulingType } from "@calcom/prisma/enums";
 import type { RouterOutputs } from "@calcom/trpc/react";
 import { trpc, TRPCClientError } from "@calcom/trpc/react";
+import type { UserProfile } from "@calcom/types/UserProfile";
 import {
   Alert,
   Avatar,
@@ -76,6 +78,7 @@ import useMeQuery from "@lib/hooks/useMeQuery";
 import SkeletonLoader from "@components/eventtype/SkeletonLoader";
 
 type EventTypeGroups = RouterOutputs["viewer"]["eventTypes"]["getByViewer"]["eventTypeGroups"];
+
 type EventTypeGroupProfile = EventTypeGroups[number]["profile"];
 type GetByViewerResponse = RouterOutputs["viewer"]["eventTypes"]["getByViewer"] | undefined;
 
@@ -89,16 +92,27 @@ interface EventTypeListHeadingProps {
 type EventTypeGroup = EventTypeGroups[number];
 type EventType = EventTypeGroup["eventTypes"][number];
 
+type DeNormalizedEventType = Omit<EventType, "userIds"> & {
+  users: (Pick<User, "id" | "name" | "username" | "avatarUrl"> & {
+    nonProfileUsername: string | null;
+    profile: UserProfile;
+  })[];
+};
+
+type DeNormalizedEventTypeGroup = Omit<EventTypeGroup, "eventTypes"> & {
+  eventTypes: DeNormalizedEventType[];
+};
+
 interface EventTypeListProps {
-  group: EventTypeGroup;
+  group: DeNormalizedEventTypeGroup;
   groupIndex: number;
   readOnly: boolean;
   bookerUrl: string | null;
-  types: EventType[];
+  types: DeNormalizedEventType[];
 }
 
 interface MobileTeamsTabProps {
-  eventTypeGroups: EventTypeGroups;
+  eventTypeGroups: DeNormalizedEventTypeGroup[];
 }
 
 const querySchema = z.object({
@@ -136,7 +150,15 @@ const MobileTeamsTab: FC<MobileTeamsTabProps> = (props) => {
   );
 };
 
-const Item = ({ type, group, readOnly }: { type: EventType; group: EventTypeGroup; readOnly: boolean }) => {
+const Item = ({
+  type,
+  group,
+  readOnly,
+}: {
+  type: DeNormalizedEventType;
+  group: DeNormalizedEventTypeGroup;
+  readOnly: boolean;
+}) => {
   const { t } = useLocale();
 
   const content = () => (
@@ -166,11 +188,7 @@ const Item = ({ type, group, readOnly }: { type: EventType; group: EventTypeGrou
   return readOnly ? (
     <div className="flex-1 overflow-hidden pr-4 text-sm">
       {content()}
-      <EventTypeDescription
-        // @ts-expect-error FIXME: We have a type mismatch here @hariombalhara @sean-brydon
-        eventType={type}
-        shortenDescription
-      />
+      <EventTypeDescription eventType={type} shortenDescription />
     </div>
   ) : (
     <Link
@@ -197,7 +215,6 @@ const Item = ({ type, group, readOnly }: { type: EventType; group: EventTypeGrou
         )}
       </div>
       <EventTypeDescription
-        // @ts-expect-error FIXME: We have a type mismatch here @hariombalhara @sean-brydon
         eventType={{ ...type, descriptionAsSafeHTML: type.safeDescription }}
         shortenDescription
       />
@@ -243,7 +260,7 @@ export const EventTypeList = ({
       await utils.viewer.eventTypes.getByViewer.cancel();
       const previousValue = utils.viewer.eventTypes.getByViewer.getData();
       if (previousValue) {
-        const newList = [...types];
+        const newList = [...types.map(normalizeEventType)];
         const itemIndex = newList.findIndex((item) => item.id === id);
         if (itemIndex !== -1 && newList[itemIndex]) {
           newList[itemIndex].hidden = !newList[itemIndex].hidden;
@@ -272,13 +289,13 @@ export const EventTypeList = ({
   });
 
   async function moveEventType(index: number, increment: 1 | -1) {
-    const newList = [...types];
+    const newList = [...types.map(normalizeEventType)];
 
     const type = types[index];
     const tmp = types[index + increment];
     if (tmp) {
-      newList[index] = tmp;
-      newList[index + increment] = type;
+      newList[index] = normalizeEventType(tmp);
+      newList[index + increment] = normalizeEventType(type);
     }
 
     await utils.viewer.eventTypes.getByViewer.cancel();
@@ -306,7 +323,7 @@ export const EventTypeList = ({
   }
 
   // inject selection data into url for correct router history
-  const openDuplicateModal = (eventType: EventType, group: EventTypeGroup) => {
+  const openDuplicateModal = (eventType: DeNormalizedEventType, group: DeNormalizedEventTypeGroup) => {
     const newSearchParams = new URLSearchParams(searchParams ?? undefined);
     function setParamsIfDefined(key: string, value: string | number | boolean | null | undefined) {
       if (value) newSearchParams.set(key, value.toString());
@@ -331,7 +348,7 @@ export const EventTypeList = ({
       await utils.viewer.eventTypes.getByViewer.cancel();
       const previousValue = utils.viewer.eventTypes.getByViewer.getData();
       if (previousValue) {
-        const newList = types.filter((item) => item.id !== id);
+        const newList = types.filter((item) => item.id !== id).map(normalizeEventType);
 
         utils.viewer.eventTypes.getByViewer.setData(undefined, {
           ...previousValue,
@@ -390,7 +407,7 @@ export const EventTypeList = ({
           const embedLink = `${group.profile.slug}/${type.slug}`;
           const calLink = `${bookerUrl}/${embedLink}`;
           const isPrivateURLEnabled = type.hashedLink?.link;
-          const placeholderHashedLink = `${CAL_URL}/d/${type.hashedLink?.link}/${type.slug}`;
+          const placeholderHashedLink = `${WEBSITE_URL}/d/${type.hashedLink?.link}/${type.slug}`;
           const isManagedEventType = type.schedulingType === SchedulingType.MANAGED;
           const isChildrenManagedEventType =
             type.metadata?.managedEventConfig !== undefined && type.schedulingType !== SchedulingType.MANAGED;
@@ -408,7 +425,7 @@ export const EventTypeList = ({
                   <MemoizedItem type={type} group={group} readOnly={readOnly} />
                   <div className="mt-4 hidden sm:mt-0 sm:flex">
                     <div className="flex justify-between space-x-2 rtl:space-x-reverse">
-                      {type.team && !isManagedEventType && (
+                      {!!type.teamId && !isManagedEventType && (
                         <UserAvatarGroup
                           className="relative right-3"
                           size="sm"
@@ -522,7 +539,7 @@ export const EventTypeList = ({
                               {!isManagedEventType && (
                                 <DropdownMenuItem className="outline-none">
                                   <EventTypeEmbedButton
-                                    namespace={type.slug}
+                                    namespace=""
                                     as={DropdownItem}
                                     type="button"
                                     StartIcon={Code}
@@ -729,9 +746,9 @@ const EventTypeListHeading = ({
   return (
     <div className="mb-4 flex items-center space-x-2">
       <Avatar
-        alt={profile?.name || ""}
+        alt={profile.name || ""}
         href={teamId ? `/settings/teams/${teamId}/profile` : "/settings/my-account/profile"}
-        imageSrc={`${bookerUrl}${teamId ? "/team" : ""}/${profile.slug}/avatar.png`}
+        imageSrc={profile.image}
         size="md"
         className="mt-1 inline-flex justify-center"
       />
@@ -739,7 +756,7 @@ const EventTypeListHeading = ({
         <Link
           href={teamId ? `/settings/teams/${teamId}/profile` : "/settings/my-account/profile"}
           className="text-emphasis font-bold">
-          {profile?.name || ""}
+          {profile.name || ""}
         </Link>
         {membershipCount && teamId && (
           <span className="text-subtle relative -top-px me-2 ms-2 text-xs">
@@ -751,13 +768,13 @@ const EventTypeListHeading = ({
             </Link>
           </span>
         )}
-        {profile?.slug && (
+        {profile.slug && (
           <Link href={`${bookerUrl}/${profile.slug}`} className="text-subtle block text-xs">
             {`${bookerUrl.replace("https://", "").replace("http://", "")}/${profile.slug}`}
           </Link>
         )}
       </div>
-      {!profile?.slug && !!teamId && (
+      {!profile.slug && !!teamId && (
         <button onClick={() => publishTeamMutation.mutate({ teamId })}>
           <Badge variant="gray" className="-ml-2 mb-1">
             {t("upgrade")}
@@ -816,12 +833,12 @@ const CTA = ({ data }: { data: GetByViewerResponse }) => {
 const Actions = () => {
   return (
     <div className="hidden items-center md:flex">
-      <TeamsFilter popoverTriggerClassNames="mb-0" showVerticalDivider={true} />
+      <TeamsFilter useProfileFilter popoverTriggerClassNames="mb-0" showVerticalDivider={true} />
     </div>
   );
 };
 
-const EmptyEventTypeList = ({ group }: { group: EventTypeGroup }) => {
+const EmptyEventTypeList = ({ group }: { group: DeNormalizedEventTypeGroup }) => {
   const { t } = useLocale();
   return (
     <>
@@ -843,7 +860,7 @@ const EmptyEventTypeList = ({ group }: { group: EventTypeGroup }) => {
 const Main = ({
   status,
   errorMessage,
-  data,
+  data: rawData,
   filters,
 }: {
   status: string;
@@ -853,9 +870,8 @@ const Main = ({
 }) => {
   const isMobile = useMediaQuery("(max-width: 768px)");
   const searchParams = useCompatSearchParams();
-  const orgBranding = useOrgBranding();
 
-  if (!data || status === "pending") {
+  if (!rawData || status === "pending") {
     return <SkeletonLoader />;
   }
 
@@ -864,7 +880,11 @@ const Main = ({
   }
 
   const isFilteredByOnlyOneItem =
-    (filters?.teamIds?.length === 1 || filters?.userIds?.length === 1) && data.eventTypeGroups.length === 1;
+    (filters?.teamIds?.length === 1 || filters?.userIds?.length === 1) &&
+    rawData.eventTypeGroups.length === 1;
+
+  const data = denormalizePayload(rawData);
+
   return (
     <>
       {data.eventTypeGroups.length > 1 || isFilteredByOnlyOneItem ? (
@@ -872,7 +892,7 @@ const Main = ({
           {isMobile ? (
             <MobileTeamsTab eventTypeGroups={data.eventTypeGroups} />
           ) : (
-            data.eventTypeGroups.map((group: EventTypeGroup, index: number) => (
+            data.eventTypeGroups.map((group, index: number) => (
               <div
                 className="mt-4 flex flex-col"
                 data-testid={`slug-${group.profile.slug}`}
@@ -954,7 +974,10 @@ const EventTypesPage: React.FC & {
   }, [orgBranding, user]);
 
   return (
-    <ShellMain
+    <Shell
+      withoutMain={false}
+      title="Event Types"
+      description="Create events to share for people to book on your calendar."
       withoutSeo
       heading={t("event_types_page_title")}
       hideHeadingOnMobile
@@ -966,8 +989,39 @@ const EventTypesPage: React.FC & {
         description="Create events to share for people to book on your calendar."
       />
       <Main data={data} status={status} errorMessage={error?.message} filters={filters} />
-    </ShellMain>
+    </Shell>
   );
 };
 
 export default EventTypesPage;
+
+function normalizeEventType(eventType: DeNormalizedEventType): EventType {
+  return {
+    ...eventType,
+    userIds: eventType.users.map((user) => user.id),
+  };
+}
+
+function denormalizePayload(data: NonNullable<GetByViewerResponse>) {
+  return {
+    ...data,
+    eventTypeGroups: data.eventTypeGroups.map((eventTypeGroup) => {
+      return {
+        ...eventTypeGroup,
+        eventTypes: eventTypeGroup.eventTypes.map((eventType) => {
+          const { userIds, ...rest } = eventType;
+          return {
+            ...rest,
+            users: userIds.map((userId) => {
+              const user = data.allUsersAcrossAllEventTypes.get(userId);
+              if (!user) {
+                throw new Error(`User with id ${userId} not found in allUsersAcrossAllEventTypes`);
+              }
+              return user;
+            }),
+          };
+        }),
+      };
+    }),
+  };
+}

apps/web/modules/event-types/views/event-types-single-view.tsx

@@ -15,7 +15,7 @@ import { validateCustomEventName } from "@calcom/core/event";
 import type { EventLocationType } from "@calcom/core/location";
 import type { ChildrenEventType } from "@calcom/features/eventtypes/components/ChildrenEventTypeSelect";
 import { validateIntervalLimitOrder } from "@calcom/lib";
-import { CAL_URL } from "@calcom/lib/constants";
+import { WEBSITE_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { useTypedQuery } from "@calcom/lib/hooks/useTypedQuery";
 import { HttpError } from "@calcom/lib/http-error";
@@ -82,6 +82,8 @@ const EventWebhooksTab = dynamic(() =>
 
 const ManagedEventTypeDialog = dynamic(() => import("@components/eventtype/ManagedEventDialog"));
 
+export type Host = { isFixed: boolean; userId: number; priority: number };
+
 export type FormValues = {
   id: number;
   title: string;
@@ -117,7 +119,7 @@ export type FormValues = {
   schedule: number | null;
   periodType: PeriodType;
   periodDays: number;
-  periodCountCalendarDays: "1" | "0";
+  periodCountCalendarDays: boolean;
   periodDates: { startDate: Date; endDate: Date };
   seatsPerTimeSlot: number | null;
   seatsShowAttendees: boolean | null;
@@ -139,13 +141,14 @@ export type FormValues = {
   bookingLimits?: IntervalLimit;
   onlyShowFirstAvailableSlot: boolean;
   children: ChildrenEventType[];
-  hosts: { userId: number; isFixed: boolean }[];
+  hosts: Host[];
   bookingFields: z.infer<typeof eventTypeBookingFields>;
   availability?: AvailabilityOption;
   bookerLayouts: BookerLayoutSettings;
   multipleDurationEnabled: boolean;
   users: EventTypeSetup["users"];
   assignAllTeamMembers: boolean;
+  useEventTypeDestinationCalendarEmail: boolean;
 };
 
 export type CustomInputParsed = typeof customInputSchema._output;
@@ -189,14 +192,17 @@ const EventTypePage = (props: EventTypeSetupProps) => {
   const [animationParentRef] = useAutoAnimate<HTMLDivElement>();
   const updateMutation = trpc.viewer.eventTypes.update.useMutation({
     onSuccess: async () => {
-      formMethods.setValue(
-        "children",
-        formMethods.getValues().children.map((child) => ({
-          ...child,
-          created: true,
-        }))
-      );
-      formMethods.setValue("assignAllTeamMembers", formMethods.getValues("assignAllTeamMembers") || false);
+      const currentValues = formMethods.getValues();
+
+      currentValues.children = currentValues.children.map((child) => ({
+        ...child,
+        created: true,
+      }));
+      currentValues.assignAllTeamMembers = currentValues.assignAllTeamMembers || false;
+
+      // Reset the form with these values as new default values to ensure the correct comparison for dirtyFields eval
+      formMethods.reset(currentValues);
+
       showToast(t("event_type_updated_successfully", { eventTypeTitle: eventType.title }), "success");
     },
     async onSettled() {
@@ -250,7 +256,6 @@ const EventTypePage = (props: EventTypeSetupProps) => {
   eventType.bookingFields.forEach(({ name }) => {
     bookingFields[name] = name;
   });
-
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const defaultValues: any = useMemo(() => {
     return {
@@ -287,7 +292,7 @@ const EventTypePage = (props: EventTypeSetupProps) => {
       offsetStart: eventType.offsetStart,
       bookingFields: eventType.bookingFields,
       periodType: eventType.periodType,
-      periodCountCalendarDays: eventType.periodCountCalendarDays ? "1" : "0",
+      periodCountCalendarDays: eventType.periodCountCalendarDays ? true : false,
       schedulingType: eventType.schedulingType,
       requiresConfirmation: eventType.requiresConfirmation,
       slotInterval: eventType.slotInterval,
@@ -296,6 +301,7 @@ const EventTypePage = (props: EventTypeSetupProps) => {
       hosts: eventType.hosts,
       successRedirectUrl: eventType.successRedirectUrl || "",
       users: eventType.users,
+      useEventTypeDestinationCalendarEmail: eventType.useEventTypeDestinationCalendarEmail,
       children: eventType.children.map((ch) => ({
         ...ch,
         created: true,
@@ -312,7 +318,6 @@ const EventTypePage = (props: EventTypeSetupProps) => {
       assignAllTeamMembers: eventType.assignAllTeamMembers,
     };
   }, [eventType, periodDates, metadata]);
-
   const formMethods = useForm<FormValues>({
     defaultValues,
     resolver: zodResolver(
@@ -401,14 +406,9 @@ const EventTypePage = (props: EventTypeSetupProps) => {
         .passthrough()
     ),
   });
-
-  useEffect(() => {
-    if (!formMethods.formState.isDirty) {
-      //TODO: What's the best way to sync the form with backend
-      formMethods.setValue("bookingFields", defaultValues.bookingFields);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [defaultValues]);
+  const {
+    formState: { isDirty: isFormDirty, dirtyFields },
+  } = formMethods;
 
   const appsMetadata = formMethods.getValues("metadata")?.apps;
   const availability = formMethods.watch("availability");
@@ -421,10 +421,9 @@ const EventTypePage = (props: EventTypeSetupProps) => {
     ).length;
   }
 
-  const permalink = `${CAL_URL}/${team ? `team/${team.slug}` : eventType.users[0].username}/${
+  const permalink = `${WEBSITE_URL}/${team ? `team/${team.slug}` : eventType.users[0].username}/${
     eventType.slug
   }`;
-
   const tabMap = {
     setup: (
       <EventSetupTab
@@ -450,8 +449,100 @@ const EventTypePage = (props: EventTypeSetupProps) => {
     ),
     webhooks: <EventWebhooksTab eventType={eventType} />,
   } as const;
+  const isObject = <T,>(value: T): boolean => {
+    return value !== null && typeof value === "object" && !Array.isArray(value);
+  };
+
+  const isArray = <T,>(value: T): boolean => {
+    return Array.isArray(value);
+  };
+
+  const isFieldDirty = (fieldName: keyof FormValues) => {
+    // If the field itself is directly marked as dirty
+    if (dirtyFields[fieldName] === true) {
+      return true;
+    }
+
+    // Check if the field is an object or an array
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const fieldValue: any = getNestedField(dirtyFields, fieldName);
+    if (isObject(fieldValue)) {
+      for (const key in fieldValue) {
+        if (fieldValue[key] === true) {
+          return true;
+        }
+
+        if (isObject(fieldValue[key]) || isArray(fieldValue[key])) {
+          const nestedFieldName = `${fieldName}.${key}` as keyof FormValues;
+          // Recursive call for nested objects or arrays
+          if (isFieldDirty(nestedFieldName)) {
+            return true;
+          }
+        }
+      }
+    }
+    if (isArray(fieldValue)) {
+      for (const element of fieldValue) {
+        // If element is an object, check each property of the object
+        if (isObject(element)) {
+          for (const key in element) {
+            if (element[key] === true) {
+              return true;
+            }
+
+            if (isObject(element[key]) || isArray(element[key])) {
+              const nestedFieldName = `${fieldName}.${key}` as keyof FormValues;
+              // Recursive call for nested objects or arrays within each element
+              if (isFieldDirty(nestedFieldName)) {
+                return true;
+              }
+            }
+          }
+        } else if (element === true) {
+          return true;
+        }
+      }
+    }
+
+    return false;
+  };
+
+  const getNestedField = (obj: typeof dirtyFields, path: string) => {
+    const keys = path.split(".");
+    let current = obj;
+
+    for (let i = 0; i < keys.length; i++) {
+      // @ts-expect-error /—— currentKey could be any deeply nested fields thanks to recursion
+      const currentKey = current[keys[i]];
+      if (currentKey === undefined) return undefined;
+      current = currentKey;
+    }
+
+    return current;
+  };
+
+  const getDirtyFields = (values: FormValues): Partial<FormValues> => {
+    if (!isFormDirty) {
+      return {};
+    }
+    const updatedFields: Partial<FormValues> = {};
+    Object.keys(dirtyFields).forEach((key) => {
+      const typedKey = key as keyof typeof dirtyFields;
+      updatedFields[typedKey] = undefined;
+      const isDirty = isFieldDirty(typedKey);
+      if (isDirty) {
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        updatedFields[typedKey] = values[typedKey];
+      }
+    });
+    return updatedFields;
+  };
 
   const handleSubmit = async (values: FormValues) => {
+    const { children } = values;
+    const dirtyValues = getDirtyFields(values);
+    const dirtyFieldExists = Object.keys(dirtyValues).length !== 0;
     const {
       periodDates,
       periodCountCalendarDays,
@@ -467,7 +558,6 @@ const EventTypePage = (props: EventTypeSetupProps) => {
       locations,
       metadata,
       customInputs,
-      children,
       assignAllTeamMembers,
       // We don't need to send send these values to the backend
       // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -480,8 +570,7 @@ const EventTypePage = (props: EventTypeSetupProps) => {
       multipleDurationEnabled,
       length,
       ...input
-    } = values;
-
+    } = dirtyValues;
     if (!Number(length)) throw new Error(t("event_setup_length_error"));
 
     if (bookingLimits) {
@@ -501,8 +590,12 @@ const EventTypePage = (props: EventTypeSetupProps) => {
       if (metadata?.multipleDuration.length < 1) {
         throw new Error(t("event_setup_multiple_duration_error"));
       } else {
-        if (!length && !metadata?.multipleDuration?.includes(length)) {
-          throw new Error(t("event_setup_multiple_duration_default_error"));
+        // if length is unchanged, we skip this check
+        if (length !== undefined) {
+          if (!length && !metadata?.multipleDuration?.includes(length)) {
+            //This would work but it leaves the potential of this check being useless. Need to check against length and not eventType.length, but length can be undefined
+            throw new Error(t("event_setup_multiple_duration_default_error"));
+          }
         }
       }
     }
@@ -518,14 +611,14 @@ const EventTypePage = (props: EventTypeSetupProps) => {
 
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     const { availability, users, scheduleName, ...rest } = input;
-    updateMutation.mutate({
+    const payload = {
       ...rest,
       length,
       locations,
       recurringEvent,
-      periodStartDate: periodDates.startDate,
-      periodEndDate: periodDates.endDate,
-      periodCountCalendarDays: periodCountCalendarDays === "1",
+      periodStartDate: periodDates?.startDate,
+      periodEndDate: periodDates?.endDate,
+      periodCountCalendarDays,
       id: eventType.id,
       beforeEventBuffer,
       afterEventBuffer,
@@ -539,7 +632,19 @@ const EventTypePage = (props: EventTypeSetupProps) => {
       customInputs,
       children,
       assignAllTeamMembers,
-    });
+    };
+    // Filter out undefined values
+    const filteredPayload = Object.entries(payload).reduce((acc, [key, value]) => {
+      if (value !== undefined) {
+        // @ts-expect-error Element implicitly has any type
+        acc[key] = value;
+      }
+      return acc;
+    }, {});
+
+    if (dirtyFieldExists) {
+      updateMutation.mutate({ ...filteredPayload, id: eventType.id });
+    }
   };
 
   const [slugExistsChildrenDialogOpen, setSlugExistsChildrenDialogOpen] = useState<ChildrenEventType[]>([]);
@@ -592,6 +697,9 @@ const EventTypePage = (props: EventTypeSetupProps) => {
           form={formMethods}
           id="event-type-form"
           handleSubmit={async (values) => {
+            const { children } = values;
+            const dirtyValues = getDirtyFields(values);
+            const dirtyFieldExists = Object.keys(dirtyValues).length !== 0;
             const {
               periodDates,
               periodCountCalendarDays,
@@ -614,9 +722,9 @@ const EventTypePage = (props: EventTypeSetupProps) => {
               multipleDurationEnabled,
               length,
               ...input
-            } = values;
+            } = dirtyValues;
 
-            if (!Number(length)) throw new Error(t("event_setup_length_error"));
+            if (length && !Number(length)) throw new Error(t("event_setup_length_error"));
 
             if (bookingLimits) {
               const isValid = validateIntervalLimitOrder(bookingLimits);
@@ -635,8 +743,11 @@ const EventTypePage = (props: EventTypeSetupProps) => {
               if (metadata?.multipleDuration.length < 1) {
                 throw new Error(t("event_setup_multiple_duration_error"));
               } else {
-                if (!length && !metadata?.multipleDuration?.includes(length)) {
-                  throw new Error(t("event_setup_multiple_duration_default_error"));
+                if (length !== undefined) {
+                  if (!length && !metadata?.multipleDuration?.includes(length)) {
+                    //This would work but it leaves the potential of this check being useless. Need to check against length and not eventType.length, but length can be undefined
+                    throw new Error(t("event_setup_multiple_duration_default_error"));
+                  }
                 }
               }
             }
@@ -648,14 +759,15 @@ const EventTypePage = (props: EventTypeSetupProps) => {
 
             // eslint-disable-next-line @typescript-eslint/no-unused-vars
             const { availability, users, scheduleName, ...rest } = input;
-            updateMutation.mutate({
+            const payload = {
               ...rest,
+              children,
               length,
               locations,
               recurringEvent,
-              periodStartDate: periodDates.startDate,
-              periodEndDate: periodDates.endDate,
-              periodCountCalendarDays: periodCountCalendarDays === "1",
+              periodStartDate: periodDates?.startDate,
+              periodEndDate: periodDates?.endDate,
+              periodCountCalendarDays,
               id: eventType.id,
               beforeEventBuffer,
               afterEventBuffer,
@@ -667,7 +779,19 @@ const EventTypePage = (props: EventTypeSetupProps) => {
               seatsShowAvailabilityCount,
               metadata,
               customInputs,
-            });
+            };
+            // Filter out undefined values
+            const filteredPayload = Object.entries(payload).reduce((acc, [key, value]) => {
+              if (value !== undefined) {
+                // @ts-expect-error Element implicitly has any type
+                acc[key] = value;
+              }
+              return acc;
+            }, {});
+
+            if (dirtyFieldExists) {
+              updateMutation.mutate({ ...filteredPayload, id: eventType.id });
+            }
           }}>
           <div ref={animationParentRef}>{tabMap[tabName]}</div>
         </Form>

apps/web/modules/users/views/users-public-view.getServerSideProps.tsx

@@ -4,23 +4,27 @@ import { encode } from "querystring";
 import type { z } from "zod";
 
 import { handleUserRedirection } from "@calcom/features/booking-redirect/handle-user";
-import { getSlugOrRequestedSlug } from "@calcom/features/ee/organizations/lib/orgDomains";
 import { orgDomainConfig } from "@calcom/features/ee/organizations/lib/orgDomains";
 import { DEFAULT_DARK_BRAND_COLOR, DEFAULT_LIGHT_BRAND_COLOR } from "@calcom/lib/constants";
 import { getUsernameList } from "@calcom/lib/defaultEvents";
+import { getUserAvatarUrl } from "@calcom/lib/getAvatarUrl";
 import logger from "@calcom/lib/logger";
 import { markdownToSafeHTML } from "@calcom/lib/markdownToSafeHTML";
+import { safeStringify } from "@calcom/lib/safeStringify";
+import { UserRepository } from "@calcom/lib/server/repository/user";
 import { stripMarkdown } from "@calcom/lib/stripMarkdown";
 import prisma from "@calcom/prisma";
 import { RedirectType, type EventType, type User } from "@calcom/prisma/client";
 import { baseEventTypeSelect } from "@calcom/prisma/selects";
-import { EventTypeMetaDataSchema, teamMetadataSchema } from "@calcom/prisma/zod-utils";
+import { EventTypeMetaDataSchema } from "@calcom/prisma/zod-utils";
+import type { UserProfile } from "@calcom/types/UserProfile";
 
 import { getTemporaryOrgRedirect } from "@lib/getTemporaryOrgRedirect";
 import type { EmbedProps } from "@lib/withEmbedSsr";
 
 import { ssrInit } from "@server/lib/ssr";
 
+const log = logger.getSubLogger({ prefix: ["[[pages/[user]]]"] });
 export type UserPageProps = {
   trpcState: DehydratedState;
   profile: {
@@ -33,11 +37,13 @@ export type UserPageProps = {
       requestedSlug: string | null;
       slug: string | null;
       id: number | null;
-    };
+    } | null;
     allowSEOIndexing: boolean;
     username: string | null;
   };
-  users: Pick<User, "away" | "name" | "username" | "bio" | "verified" | "avatarUrl">[];
+  users: (Pick<User, "away" | "name" | "username" | "bio" | "verified" | "avatarUrl"> & {
+    profile: UserProfile;
+  })[];
   themeBasis: string | null;
   markdownStrippedBio: string;
   safeBio: string;
@@ -106,7 +112,7 @@ export const getEventTypesWithHiddenFromDB = async (userId: number) => {
   return eventTypes.reduce<typeof eventTypes>((eventTypes, eventType) => {
     const parsedMetadata = EventTypeMetaDataSchema.safeParse(eventType.metadata);
     if (!parsedMetadata.success) {
-      logger.error(parsedMetadata.error);
+      log.error(parsedMetadata.error);
       return eventTypes;
     }
     eventTypes.push({
@@ -124,7 +130,7 @@ export const getServerSideProps: GetServerSideProps<UserPageProps> = async (cont
   const isOrgContext = isValidOrgDomain && currentOrgDomain;
   const dataFetchStart = Date.now();
   let outOfOffice = false;
-  const isDynamicGroup = usernameList.length > 1;
+
   if (usernameList.length === 1) {
     const result = await handleUserRedirection({ username: usernameList[0] });
     if (result && result.outOfOffice) {
@@ -136,6 +142,7 @@ export const getServerSideProps: GetServerSideProps<UserPageProps> = async (cont
   }
 
   if (!isOrgContext) {
+    // If there is no org context, see if some redirect is setup due to org migration
     const redirect = await getTemporaryOrgRedirect({
       slugs: usernameList,
       redirectType: RedirectType.User,
@@ -148,51 +155,22 @@ export const getServerSideProps: GetServerSideProps<UserPageProps> = async (cont
     }
   }
 
-  const usersWithoutAvatar = await prisma.user.findMany({
-    where: {
-      username: {
-        in: usernameList,
-      },
-      organization: isOrgContext ? getSlugOrRequestedSlug(currentOrgDomain) : null,
-    },
-    select: {
-      id: true,
-      username: true,
-      email: true,
-      name: true,
-      bio: true,
-      metadata: true,
-      brandColor: true,
-      darkBrandColor: true,
-      avatarUrl: true,
-      organizationId: true,
-      organization: {
-        select: {
-          slug: true,
-          name: true,
-          metadata: true,
-        },
-      },
-      theme: true,
-      away: true,
-      verified: true,
-      allowDynamicBooking: true,
-      allowSEOIndexing: true,
-    },
+  const usersInOrgContext = await UserRepository.findUsersByUsername({
+    usernameList,
+    orgSlug: isValidOrgDomain ? currentOrgDomain : null,
   });
 
-  const users = usersWithoutAvatar.map((user) => ({
-    ...user,
-    organization: {
-      ...user.organization,
-      metadata: user.organization?.metadata ? teamMetadataSchema.parse(user.organization.metadata) : null,
-    },
-    avatar: `/${user.username}/avatar.png`,
-  }));
+  const usersWithoutAvatar = usersInOrgContext.map((user) => {
+    const { avatar: _1, ...rest } = user;
+    return rest;
+  });
+
+  const isDynamicGroup = usersWithoutAvatar.length > 1;
+  log.debug(safeStringify({ usersInOrgContext, isValidOrgDomain, currentOrgDomain, isDynamicGroup }));
 
   if (isDynamicGroup) {
     const destinationUrl = `/${usernameList.join("+")}/dynamic`;
-    logger.debug(`Dynamic group detected, redirecting to ${destinationUrl}`);
+    log.debug(`Dynamic group detected, redirecting to ${destinationUrl}`);
     return {
       redirect: {
         permanent: false,
@@ -206,7 +184,18 @@ export const getServerSideProps: GetServerSideProps<UserPageProps> = async (cont
     };
   }
 
-  if (!users.length || (!isValidOrgDomain && !users.some((user) => user.organizationId === null))) {
+  const users = usersWithoutAvatar.map((user) => ({
+    ...user,
+    avatar: `/${user.username}/avatar.png`,
+  }));
+
+  const isNonOrgUser = (user: { profile: UserProfile }) => {
+    return !user.profile?.organization;
+  };
+
+  const isThereAnyNonOrgUser = users.some(isNonOrgUser);
+
+  if (!users.length || (!isValidOrgDomain && !isThereAnyNonOrgUser)) {
     return {
       notFound: true,
     } as {
@@ -218,18 +207,17 @@ export const getServerSideProps: GetServerSideProps<UserPageProps> = async (cont
 
   const profile = {
     name: user.name || user.username || "",
-    image: user.avatar,
+    image: getUserAvatarUrl({
+      ...user,
+      profile: user.profile,
+    }),
     theme: user.theme,
     brandColor: user.brandColor ?? DEFAULT_LIGHT_BRAND_COLOR,
     avatarUrl: user.avatarUrl,
     darkBrandColor: user.darkBrandColor ?? DEFAULT_DARK_BRAND_COLOR,
     allowSEOIndexing: user.allowSEOIndexing ?? true,
     username: user.username,
-    organization: {
-      id: user.organizationId,
-      slug: user.organization?.slug ?? null,
-      requestedSlug: user.organization?.metadata?.requestedSlug ?? null,
-    },
+    organization: user.profile.organization,
   };
 
   const eventTypesWithHidden = await getEventTypesWithHiddenFromDB(user.id);
@@ -248,7 +236,7 @@ export const getServerSideProps: GetServerSideProps<UserPageProps> = async (cont
   // if profile only has one public event-type, redirect to it
   if (eventTypes.length === 1 && context.query.redirect !== "false" && !outOfOffice) {
     // Redirect but don't change the URL
-    const urlDestination = `/${user.username}/${eventTypes[0].slug}`;
+    const urlDestination = `/${user.profile.username}/${eventTypes[0].slug}`;
     const { query } = context;
     const urlQuery = new URLSearchParams(encode(query));
 
@@ -263,7 +251,7 @@ export const getServerSideProps: GetServerSideProps<UserPageProps> = async (cont
   const safeBio = markdownToSafeHTML(user.bio) || "";
 
   const markdownStrippedBio = stripMarkdown(user?.bio || "");
-  const org = usersWithoutAvatar[0].organization;
+  const org = usersWithoutAvatar[0].profile.organization;
 
   return {
     props: {
@@ -274,6 +262,7 @@ export const getServerSideProps: GetServerSideProps<UserPageProps> = async (cont
         avatarUrl: user.avatarUrl,
         away: usernameList.length === 1 ? outOfOffice : user.away,
         verified: user.verified,
+        profile: user.profile,
       })),
       entity: {
         isUnpublished: org?.slug === null,

apps/web/modules/users/views/users-public-view.tsx

@@ -111,19 +111,11 @@ export function UserPage(props: InferGetServerSidePropsType<typeof getServerSide
             <UserAvatar
               size="xl"
               user={{
-                organizationId: profile.organization?.id,
+                avatarUrl: user.avatarUrl,
+                profile: user.profile,
                 name: profile.name,
                 username: profile.username,
               }}
-              organization={
-                profile.organization?.id
-                  ? {
-                      id: profile.organization.id,
-                      slug: profile.organization.slug,
-                      requestedSlug: null,
-                    }
-                  : null
-              }
             />
             <h1 className="font-cal text-emphasis my-1 text-3xl" data-testid="name-title">
               {profile.name}
@@ -163,7 +155,7 @@ export function UserPage(props: InferGetServerSidePropsType<typeof getServerSide
                     <Link
                       prefetch={false}
                       href={{
-                        pathname: `/${user.username}/${type.slug}`,
+                        pathname: `/${user.profile.username}/${type.slug}`,
                         query,
                       }}
                       passHref

apps/web/modules/users/views/users-type-public-view.getServerSideProps.tsx

@@ -5,10 +5,10 @@ import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
 import { handleTypeRedirection } from "@calcom/features/booking-redirect/handle-type";
 import { getBookingForReschedule, getBookingForSeatedEvent } from "@calcom/features/bookings/lib/get-booking";
 import type { GetBookingType } from "@calcom/features/bookings/lib/get-booking";
-import { orgDomainConfig, userOrgQuery } from "@calcom/features/ee/organizations/lib/orgDomains";
+import { orgDomainConfig } from "@calcom/features/ee/organizations/lib/orgDomains";
 import { getUsernameList } from "@calcom/lib/defaultEvents";
+import { UserRepository } from "@calcom/lib/server/repository/user";
 import slugify from "@calcom/lib/slugify";
-import prisma from "@calcom/prisma";
 import { RedirectType } from "@calcom/prisma/client";
 
 import { getTemporaryOrgRedirect } from "@lib/getTemporaryOrgRedirect";
@@ -39,22 +39,13 @@ async function getDynamicGroupPageProps(context: GetServerSidePropsContext) {
     }
   }
 
-  const users = await prisma.user.findMany({
-    where: {
-      username: {
-        in: usernames,
-      },
-      organization: isValidOrgDomain
-        ? {
-            slug: currentOrgDomain,
-          }
-        : null,
-    },
-    select: {
-      allowDynamicBooking: true,
-    },
+  const usersInOrgContext = await UserRepository.findUsersByUsername({
+    usernameList: usernames,
+    orgSlug: isValidOrgDomain ? currentOrgDomain : null,
   });
 
+  const users = usersInOrgContext;
+
   if (!users.length) {
     return {
       notFound: true,
@@ -129,16 +120,9 @@ async function getUserPageProps(context: GetServerSidePropsContext) {
 
   const { ssrInit } = await import("@server/lib/ssr");
   const ssr = await ssrInit(context);
-  const user = await prisma.user.findFirst({
-    where: {
-      username,
-      organization: userOrgQuery(context.req, context.params?.orgSlug),
-    },
-    select: {
-      id: true,
-      hideBranding: true,
-      allowSEOIndexing: true,
-    },
+  const [user] = await UserRepository.findUsersByUsername({
+    usernameList: [username],
+    orgSlug: isValidOrgDomain ? currentOrgDomain : null,
   });
 
   if (!user) {

apps/web/modules/videos/views/videos-single-view.getServerSideProps.tsx

@@ -3,6 +3,7 @@ import type { GetServerSidePropsContext } from "next";
 
 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
 import { getCalVideoReference } from "@calcom/features/get-cal-video-reference";
+import { UserRepository } from "@calcom/lib/server/repository/user";
 import prisma, { bookingMinimalSelect } from "@calcom/prisma";
 
 import { type inferSSRProps } from "@lib/types/inferSSRProps";
@@ -33,11 +34,7 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
           timeZone: true,
           name: true,
           email: true,
-          organization: {
-            select: {
-              calVideoLogo: true,
-            },
-          },
+          username: true,
         },
       },
       references: {
@@ -63,6 +60,14 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
     };
   }
 
+  const profile = booking.user
+    ? (
+        await UserRepository.enrichUserWithItsProfile({
+          user: booking.user,
+        })
+      ).profile
+    : null;
+
   //daily.co calls have a 60 minute exit buffer when a user enters a call when it's not available it will trigger the modals
   const now = new Date();
   const exitDate = new Date(now.getTime() - 60 * 60 * 1000);
@@ -102,6 +107,12 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
       booking: {
         ...bookingObj,
         ...(bookingObj.description && { description: md.render(bookingObj.description) }),
+        user: bookingObj.user
+          ? {
+              ...bookingObj.user,
+              organization: profile?.organization,
+            }
+          : bookingObj.user,
       },
       trpcState: ssr.dehydrate(),
     },

apps/web/next.config.js

@@ -207,7 +207,17 @@ const nextConfig = {
   images: {
     unoptimized: true,
   },
-  webpack: (config, { webpack, buildId }) => {
+  webpack: (config, { webpack, buildId, isServer }) => {
+    if (isServer) {
+      // Module not found fix @see https://github.com/boxyhq/jackson/issues/1535#issuecomment-1704381612
+      config.plugins.push(
+        new webpack.IgnorePlugin({
+          resourceRegExp:
+            /(^@google-cloud\/spanner|^@mongodb-js\/zstd|^@sap\/hana-client\/extension\/Stream$|^@sap\/hana-client|^@sap\/hana-client$|^aws-crt|^aws4$|^better-sqlite3$|^bson-ext$|^cardinal$|^cloudflare:sockets$|^hdb-pool$|^ioredis$|^kerberos$|^mongodb-client-encryption$|^mysql$|^oracledb$|^pg-native$|^pg-query-stream$|^react-native-sqlite-storage$|^snappy\/package\.json$|^snappy$|^sql.js$|^sqlite3$|^typeorm-aurora-data-api-driver$)/,
+        })
+      );
+    }
+
     config.plugins.push(
       new CopyWebpackPlugin({
         patterns: [

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@calcom/web",
-  "version": "3.7.10",
+  "version": "3.8.2",
   "private": true,
   "scripts": {
     "analyze": "ANALYZE=true next build",
@@ -24,7 +24,7 @@
     "yarn": "3.4.1"
   },
   "dependencies": {
-    "@boxyhq/saml-jackson": "1.8.2",
+    "@boxyhq/saml-jackson": "1.18.6",
     "@calcom/app-store": "*",
     "@calcom/app-store-cli": "*",
     "@calcom/core": "*",
@@ -130,7 +130,7 @@
     "tailwindcss-radix": "^2.6.0",
     "turndown": "^7.1.1",
     "uuid": "^8.3.2",
-    "zod": "^3.22.2"
+    "zod": "^3.22.4"
   },
   "devDependencies": {
     "@babel/core": "^7.19.6",

apps/web/pages/_document.tsx

@@ -76,8 +76,8 @@ class MyDocument extends Document<Props> {
           <link rel="manifest" href="/site.webmanifest" />
           <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#000000" />
           <meta name="msapplication-TileColor" content="#ff0000" />
-          <meta name="theme-color" media="(prefers-color-scheme: light)" content="#f9fafb" />
-          <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#1C1C1C" />
+          <meta name="theme-color" media="(prefers-color-scheme: light)" content="#F9FAFC" />
+          <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#1F1F1F" />
           {!IS_PRODUCTION && process.env.VERCEL_ENV === "preview" && (
             // eslint-disable-next-line @next/next/no-sync-scripts
             <script

apps/web/pages/api/auth/changepw.ts

@@ -38,7 +38,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
   const oldPassword = req.body.oldPassword;
   const newPassword = req.body.newPassword;
 
-  const currentPassword = user.password;
+  const currentPassword = user.password?.hash;
   if (!currentPassword) {
     return res.status(400).json({ error: ErrorCode.UserMissingPassword });
   }
@@ -53,12 +53,16 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
   }
 
   const hashedPassword = await hashPassword(newPassword);
-  await prisma.user.update({
+  await prisma.userPassword.upsert({
     where: {
-      id: user.id,
+      userId: user.id,
     },
-    data: {
-      password: hashedPassword,
+    create: {
+      hash: hashedPassword,
+      userId: user.id,
+    },
+    update: {
+      hash: hashedPassword,
     },
   });
 

apps/web/pages/api/auth/reset-password.ts

@@ -41,7 +41,13 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
         email: maybeRequest.email,
       },
       data: {
-        password: hashedPassword,
+        password: {
+          upsert: {
+            create: { hash: hashedPassword },
+            update: { hash: hashedPassword },
+          },
+        },
+        emailVerified: new Date(),
       },
     });
   } catch (e) {

apps/web/pages/api/auth/setup.ts

@@ -41,7 +41,7 @@ async function handler(req: NextApiRequest) {
     data: {
       username,
       email: userEmail,
-      password: hashedPassword,
+      password: { create: { hash: hashedPassword } },
       role: "ADMIN",
       name: parsedQuery.data.full_name,
       emailVerified: new Date(),

apps/web/pages/api/auth/two-factor/totp/disable.ts

@@ -23,13 +23,13 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     return res.status(500).json({ error: ErrorCode.InternalServerError });
   }
 
-  const user = await prisma.user.findUnique({ where: { id: session.user.id } });
+  const user = await prisma.user.findUnique({ where: { id: session.user.id }, include: { password: true } });
   if (!user) {
     console.error(`Session references user that no longer exists.`);
     return res.status(401).json({ message: "Not authenticated" });
   }
 
-  if (!user.password && user.identityProvider === IdentityProvider.CAL) {
+  if (!user.password?.hash && user.identityProvider === IdentityProvider.CAL) {
     return res.status(400).json({ error: ErrorCode.UserMissingPassword });
   }
 
@@ -37,8 +37,8 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     return res.json({ message: "Two factor disabled" });
   }
 
-  if (user.password && user.identityProvider === IdentityProvider.CAL) {
-    const isCorrectPassword = await verifyPassword(req.body.password, user.password);
+  if (user.password?.hash && user.identityProvider === IdentityProvider.CAL) {
+    const isCorrectPassword = await verifyPassword(req.body.password, user.password.hash);
     if (!isCorrectPassword) {
       return res.status(400).json({ error: ErrorCode.IncorrectPassword });
     }

apps/web/pages/api/auth/two-factor/totp/setup.ts

@@ -25,7 +25,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     return res.status(500).json({ error: ErrorCode.InternalServerError });
   }
 
-  const user = await prisma.user.findUnique({ where: { id: session.user.id } });
+  const user = await prisma.user.findUnique({ where: { id: session.user.id }, include: { password: true } });
   if (!user) {
     console.error(`Session references user that no longer exists.`);
     return res.status(401).json({ message: "Not authenticated" });
@@ -35,7 +35,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     return res.status(400).json({ error: ErrorCode.ThirdPartyIdentityProviderEnabled });
   }
 
-  if (!user.password) {
+  if (!user.password?.hash) {
     return res.status(400).json({ error: ErrorCode.UserMissingPassword });
   }
 
@@ -48,7 +48,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     return res.status(500).json({ error: ErrorCode.InternalServerError });
   }
 
-  const isCorrectPassword = await verifyPassword(req.body.password, user.password);
+  const isCorrectPassword = await verifyPassword(req.body.password, user.password.hash);
   if (!isCorrectPassword) {
     return res.status(400).json({ error: ErrorCode.IncorrectPassword });
   }

apps/web/pages/api/auth/verify-email.ts

@@ -4,6 +4,7 @@ import { z } from "zod";
 import dayjs from "@calcom/dayjs";
 import { WEBAPP_URL } from "@calcom/lib/constants";
 import { prisma } from "@calcom/prisma";
+import { userMetadata } from "@calcom/prisma/zod-utils";
 
 const verifySchema = z.object({
   token: z.string(),
@@ -26,23 +27,71 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
     return res.status(401).json({ message: "Token expired" });
   }
 
-  const user = await prisma.user.update({
+  const user = await prisma.user.findFirst({
     where: {
       email: foundToken?.identifier,
     },
+  });
+
+  if (!user) {
+    return res.status(401).json({ message: "Cannot find a user attached to this token" });
+  }
+
+  const userMetadataParsed = userMetadata.parse(user.metadata);
+  // Attach the new email and verify
+  if (userMetadataParsed?.emailChangeWaitingForVerification) {
+    // Ensure this email isnt in use
+    const existingUser = await prisma.user.findUnique({
+      where: { email: userMetadataParsed?.emailChangeWaitingForVerification },
+      select: {
+        id: true,
+      },
+    });
+
+    if (existingUser) {
+      return res.status(401).json({ message: "A User already exists with this email" });
+    }
+
+    const updatedEmail = userMetadataParsed.emailChangeWaitingForVerification;
+    delete userMetadataParsed.emailChangeWaitingForVerification;
+
+    // Update and re-verify
+    await prisma.user.update({
+      where: {
+        id: user.id,
+      },
+      data: {
+        email: updatedEmail,
+        metadata: userMetadataParsed,
+      },
+    });
+
+    await cleanUpVerificationTokens(foundToken.id);
+
+    return res.status(200).json({
+      updatedEmail,
+    });
+  }
+
+  await prisma.user.update({
+    where: {
+      id: user.id,
+    },
     data: {
       emailVerified: new Date(),
     },
   });
 
+  const hasCompletedOnboarding = user.completedOnboarding;
+
+  return res.redirect(`${WEBAPP_URL}/${hasCompletedOnboarding ? "/event-types" : "/getting-started"}`);
+}
+
+async function cleanUpVerificationTokens(id: number) {
   // Delete token from DB after it has been used
   await prisma.verificationToken.delete({
     where: {
-      id: foundToken?.id,
+      id,
     },
   });
-
-  const hasCompletedOnboarding = user.completedOnboarding;
-
-  res.redirect(`${WEBAPP_URL}/${hasCompletedOnboarding ? "/event-types" : "/getting-started"}`);
 }

apps/web/pages/api/book/event.ts

@@ -17,9 +17,7 @@ async function handler(req: NextApiRequest & { userId?: number }, res: NextApiRe
   const session = await getServerSession({ req, res });
   /* To mimic API behavior and comply with types */
   req.userId = session?.user?.id || -1;
-  const booking = await handleNewBooking(req, {
-    isNotAnApiCall: true,
-  });
+  const booking = await handleNewBooking(req);
   return booking;
 }
 

apps/web/pages/api/book/recurring-event.ts

@@ -1,12 +1,11 @@
 import type { NextApiRequest, NextApiResponse } from "next";
 
 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
-import handleNewBooking from "@calcom/features/bookings/lib/handleNewBooking";
-import type { BookingResponse, RecurringBookingCreateBody } from "@calcom/features/bookings/types";
+import { handleNewRecurringBooking } from "@calcom/features/bookings/lib/handleNewRecurringBooking";
+import type { BookingResponse } from "@calcom/features/bookings/types";
 import { checkRateLimitAndThrowError } from "@calcom/lib/checkRateLimitAndThrowError";
 import getIP from "@calcom/lib/getIP";
 import { defaultResponder } from "@calcom/lib/server";
-import type { AppsStatus } from "@calcom/types/Calendar";
 
 // @TODO: Didn't look at the contents of this function in order to not break old booking page.
 
@@ -17,74 +16,12 @@ async function handler(req: NextApiRequest & { userId?: number }, res: NextApiRe
     rateLimitingType: "core",
     identifier: userIp,
   });
-  const data: RecurringBookingCreateBody[] = req.body;
   const session = await getServerSession({ req, res });
-  const createdBookings: BookingResponse[] = [];
-  const allRecurringDates: { start: string | undefined; end: string | undefined }[] = data.map((booking) => {
-    return { start: booking.start, end: booking.end };
-  });
-  const appsStatus: AppsStatus[] | undefined = undefined;
-
   /* To mimic API behavior and comply with types */
   req.userId = session?.user?.id || -1;
-  const numSlotsToCheckForAvailability = 2;
 
-  let thirdPartyRecurringEventId = null;
-  for (let key = 0; key < data.length; key++) {
-    const booking = data[key];
-    // Disable AppStatus in Recurring Booking Email as it requires us to iterate backwards to be able to compute the AppsStatus for all the bookings except the very first slot and then send that slot's email with statuses
-    // It is also doubtful that how useful is to have the AppsStatus of all the bookings in the email.
-    // It is more important to iterate forward and check for conflicts for only first few bookings defined by 'numSlotsToCheckForAvailability'
-    // if (key === 0) {
-    //   const calcAppsStatus: { [key: string]: AppsStatus } = createdBookings
-    //     .flatMap((book) => (book.appsStatus !== undefined ? book.appsStatus : []))
-    //     .reduce((prev, curr) => {
-    //       if (prev[curr.type]) {
-    //         prev[curr.type].failures += curr.failures;
-    //         prev[curr.type].success += curr.success;
-    //       } else {
-    //         prev[curr.type] = curr;
-    //       }
-    //       return prev;
-    //     }, {} as { [key: string]: AppsStatus });
-    //   appsStatus = Object.values(calcAppsStatus);
-    // }
+  const createdBookings: BookingResponse[] = await handleNewRecurringBooking(req);
 
-    const recurringEventReq: NextApiRequest & { userId?: number } = req;
-
-    recurringEventReq.body = {
-      ...booking,
-      appsStatus,
-      allRecurringDates,
-      isFirstRecurringSlot: key == 0,
-      thirdPartyRecurringEventId,
-      numSlotsToCheckForAvailability,
-      currentRecurringIndex: key,
-      noEmail: key !== 0,
-    };
-
-    const promiseEachRecurringBooking: ReturnType<typeof handleNewBooking> = handleNewBooking(
-      recurringEventReq,
-      {
-        isNotAnApiCall: true,
-      }
-    );
-
-    const eachRecurringBooking = await promiseEachRecurringBooking;
-
-    createdBookings.push(eachRecurringBooking);
-
-    if (!thirdPartyRecurringEventId) {
-      if (eachRecurringBooking.references && eachRecurringBooking.references.length > 0) {
-        for (const reference of eachRecurringBooking.references!) {
-          if (reference.thirdPartyRecurringEventId) {
-            thirdPartyRecurringEventId = reference.thirdPartyRecurringEventId;
-            break;
-          }
-        }
-      }
-    }
-  }
   return createdBookings;
 }
 

apps/web/pages/api/cron/bookingReminder.ts

@@ -119,7 +119,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
         endTime: booking.endTime.toISOString(),
         organizer: {
           id: user.id,
-          email: user.email,
+          email: booking?.userPrimaryEmail ?? user.email,
           name,
           timeZone: user.timeZone,
           language: { translate: tOrganizer, locale: user.locale ?? "en" },

apps/web/pages/api/link.ts

@@ -8,6 +8,7 @@ import { UserPermissionRole } from "@calcom/prisma/enums";
 import { TRPCError } from "@calcom/trpc/server";
 import { createContext } from "@calcom/trpc/server/createContext";
 import { bookingsRouter } from "@calcom/trpc/server/routers/viewer/bookings/_router";
+import type { UserProfile } from "@calcom/types/UserProfile";
 
 enum DirectAction {
   ACCEPT = "accept",
@@ -46,7 +47,16 @@ async function handler(req: NextApiRequest, res: NextApiResponse<Response>) {
         id: userId,
         username: "" /* Not used in this context */,
         role: UserPermissionRole.USER,
+        /* Not used in this context */
+        profile: {
+          id: null,
+          organizationId: null,
+          organization: null,
+          username: "",
+          upId: "",
+        } satisfies UserProfile,
       },
+      upId: "",
       hasValidLicense: true,
       expires: "" /* Not used in this context */,
     };

apps/web/pages/api/recorded-daily-video.ts

@@ -3,7 +3,6 @@ import { createHmac } from "crypto";
 import type { NextApiRequest, NextApiResponse } from "next";
 import { z } from "zod";
 
-import { DailyLocationType } from "@calcom/app-store/locations";
 import { getDownloadLinkOfCalVideoByRecordingId } from "@calcom/core/videoClient";
 import { sendDailyVideoRecordingEmails } from "@calcom/emails";
 import getWebhooks from "@calcom/features/webhooks/lib/getWebhooks";
@@ -182,7 +181,7 @@ async function handler(req: NextApiRequest, res: NextApiResponse) {
       },
     });
 
-    if (!booking || !(booking.location === DailyLocationType || booking?.location?.trim() === "")) {
+    if (!booking) {
       log.error(
         "Booking:",
         safeStringify({
@@ -231,7 +230,7 @@ async function handler(req: NextApiRequest, res: NextApiResponse) {
       startTime: booking.startTime.toISOString(),
       endTime: booking.endTime.toISOString(),
       organizer: {
-        email: booking.user?.email || "Email-less",
+        email: booking?.userPrimaryEmail || booking.user?.email || "Email-less",
         name: booking.user?.name || "Nameless",
         timeZone: booking.user?.timeZone || "Europe/London",
         language: { translate: t, locale: booking?.user?.locale ?? "en" },

apps/web/pages/api/user/avatar.ts

@@ -42,14 +42,30 @@ async function getIdentityData(req: NextApiRequest) {
     : null;
 
   if (username) {
-    const user = await prisma.user.findFirst({
+    const users = await prisma.user.findMany({
       where: {
-        username,
-        organization: orgQuery,
+        ...(orgQuery
+          ? {
+              profiles: {
+                some: {
+                  username,
+                  organization: orgQuery,
+                },
+              },
+            }
+          : {
+              username,
+              // If a user is moved, it isn't actually available outside of the organization. So, for non-org domain check for movedToProfileId
+              movedToProfileId: null,
+            }),
       },
       select: { avatar: true, email: true },
     });
 
+    if (users.length > 1) {
+      throw new Error(`More than one user found for username "${username}"`);
+    }
+    const [user] = users;
     return {
       name: username,
       email: user?.email,