chore: settings/organizations - remove pages router and use app rou…

…ter (calcom#16774)

* remove pages router and use app router

* remove future/settings/organizations files

* fix billing page

* sync SettingsLayoutAppDirClient and fix members page

* fix attribute pages

* remove isAppDir where not needed anymore

* add CTA button for members view

.env.example

@@ -348,7 +348,6 @@ AB_TEST_BUCKET_PROBABILITY=50
 # whether we redirect to the future/event-types from event-types or not
 APP_ROUTER_EVENT_TYPES_ENABLED=0
 APP_ROUTER_SETTINGS_DEVELOPER_ENABLED=0
-APP_ROUTER_SETTINGS_ORG_ENABLED=0
 APP_ROUTER_APPS_INSTALLED_CATEGORY_ENABLED=0
 APP_ROUTER_APPS_SLUG_ENABLED=0
 APP_ROUTER_APPS_SLUG_SETUP_ENABLED=0

apps/web/abTest/middlewareFactory.ts

@@ -8,7 +8,6 @@ import { FUTURE_ROUTES_ENABLED_COOKIE_NAME, FUTURE_ROUTES_OVERRIDE_COOKIE_NAME }
 const ROUTES: [URLPattern, boolean][] = [
   ["/event-types", process.env.APP_ROUTER_EVENT_TYPES_ENABLED === "1"] as const,
   ["/settings/developer/:path*", process.env.APP_ROUTER_SETTINGS_DEVELOPER_ENABLED === "1"] as const,
-  ["/settings/organizations/:path*", process.env.APP_ROUTER_SETTINGS_ORG_ENABLED === "1"] as const,
   ["/apps/installed/:category", process.env.APP_ROUTER_APPS_INSTALLED_CATEGORY_ENABLED === "1"] as const,
   ["/apps/:slug", process.env.APP_ROUTER_APPS_SLUG_ENABLED === "1"] as const,
   ["/apps/:slug/setup", process.env.APP_ROUTER_APPS_SLUG_SETUP_ENABLED === "1"] as const,

apps/web/app/settings/(settings-layout)/organizations/attributes/[id]/edit/page.tsx

@@ -0,0 +1,24 @@
+import { _generateMetadata, getFixedT } from "app/_utils";
+
+import OrgAttributesEditPage from "@calcom/ee/organizations/pages/settings/attributes/attributes-edit-view";
+import { getServerSessionForAppDir } from "@calcom/features/auth/lib/get-server-session-for-app-dir";
+import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
+
+export const generateMetadata = async () =>
+  await _generateMetadata(
+    (t) => t("attribute"),
+    (t) => t("edit_attribute_description")
+  );
+
+const Page = async () => {
+  const session = await getServerSessionForAppDir();
+  const t = await getFixedT(session?.user.locale || "en");
+
+  return (
+    <SettingsHeader title={t("attribute")} description={t("edit_attribute_description")}>
+      <OrgAttributesEditPage />
+    </SettingsHeader>
+  );
+};
+
+export default Page;

apps/web/app/settings/(settings-layout)/organizations/attributes/create/page.tsx

@@ -0,0 +1,24 @@
+import { _generateMetadata, getFixedT } from "app/_utils";
+
+import OrgAttributesCreatePage from "@calcom/ee/organizations/pages/settings/attributes/attributes-create-view";
+import { getServerSessionForAppDir } from "@calcom/features/auth/lib/get-server-session-for-app-dir";
+import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
+
+export const generateMetadata = async () =>
+  await _generateMetadata(
+    (t) => t("attribute"),
+    (t) => t("create_attribute_description")
+  );
+
+const Page = async () => {
+  const session = await getServerSessionForAppDir();
+  const t = await getFixedT(session?.user.locale || "en");
+
+  return (
+    <SettingsHeader title={t("attribute")} description={t("create_attribute_description")}>
+      <OrgAttributesCreatePage />
+    </SettingsHeader>
+  );
+};
+
+export default Page;

apps/web/app/settings/(settings-layout)/organizations/attributes/page.tsx

@@ -0,0 +1,24 @@
+import { _generateMetadata, getFixedT } from "app/_utils";
+
+import OrgSettingsAttributesPage from "@calcom/ee/organizations/pages/settings/attributes/attributes-list-view";
+import { getServerSessionForAppDir } from "@calcom/features/auth/lib/get-server-session-for-app-dir";
+import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
+
+export const generateMetadata = async () =>
+  await _generateMetadata(
+    (t) => t("attributes"),
+    (t) => t("attribute_meta_description")
+  );
+
+const Page = async () => {
+  const session = await getServerSessionForAppDir();
+  const t = await getFixedT(session?.user.locale || "en");
+
+  return (
+    <SettingsHeader title={t("attributes")} description={t("attribute_meta_description")}>
+      <OrgSettingsAttributesPage />
+    </SettingsHeader>
+  );
+};
+
+export default Page;

apps/web/app/settings/(settings-layout)/organizations/billing/page.tsx

@@ -0,0 +1,5 @@
+import BillingPage, { generateMetadata } from "app/future/settings/(settings)/billing/page";
+
+export { generateMetadata };
+
+export default BillingPage;

apps/web/app/future/settings/(settings)/organizations/general/page.tsx → apps/web/app/settings/(settings-layout)/organizations/general/page.tsx

@@ -16,7 +16,7 @@ const Page = async () => {
 
   return (
     <SettingsHeader title={t("general")} description={t("general_description")} borderInShellHeader={true}>
-      <LegacyPage isAppDir={true} />
+      <LegacyPage />
     </SettingsHeader>
   );
 };

apps/web/app/future/settings/(settings)/organizations/profile/page.tsx → apps/web/app/settings/(settings-layout)/organizations/profile/page.tsx

@@ -19,7 +19,7 @@ const Page = async () => {
       title={t("profile")}
       description={t("profile_org_description")}
       borderInShellHeader={true}>
-      <LegacyPage isAppDir={true} />
+      <LegacyPage />
     </SettingsHeader>
   );
 };

apps/web/app/future/settings/(settings)/organizations/sso/page.tsx → apps/web/app/settings/(settings-layout)/organizations/sso/page.tsx

@@ -15,8 +15,8 @@ const Page = async () => {
   const t = await getFixedT(session?.user.locale || "en");
 
   return (
-    <SettingsHeader title={t("profile")} description={t("profile_org_description")}>
-      <OrgSSOView isAppDir={true} />
+    <SettingsHeader title={t("sso_configuration")} description={t("sso_configuration_description_orgs")}>
+      <OrgSSOView />
     </SettingsHeader>
   );
 };

apps/web/app/future/settings/(settings)/organizations/teams/other/[id]/members/page.tsx → apps/web/app/settings/(settings-layout)/organizations/teams/other/[id]/members/page.tsx

@@ -1,7 +1,9 @@
 import { _generateMetadata, getFixedT } from "app/_utils";
 
 import { getServerSessionForAppDir } from "@calcom/features/auth/lib/get-server-session-for-app-dir";
-import LegacyPage from "@calcom/features/ee/organizations/pages/settings/other-team-members-view";
+import LegacyPage, {
+  TeamMembersCTA,
+} from "@calcom/features/ee/organizations/pages/settings/other-team-members-view";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
 
 export const generateMetadata = async () =>
@@ -15,9 +17,11 @@ const Page = async () => {
   const t = await getFixedT(session?.user.locale || "en");
 
   return (
-    // TODO: Add CTA Button
-    <SettingsHeader title={t("team_members")} description={t("members_team_description")}>
-      <LegacyPage isAppDir={true} />
+    <SettingsHeader
+      title={t("team_members")}
+      description={t("members_team_description")}
+      CTA={<TeamMembersCTA />}>
+      <LegacyPage />
     </SettingsHeader>
   );
 };

apps/web/app/future/settings/(settings)/organizations/teams/other/[id]/profile/page.tsx → apps/web/app/settings/(settings-layout)/organizations/teams/other/[id]/profile/page.tsx

@@ -16,7 +16,7 @@ const Page = async () => {
 
   return (
     <SettingsHeader title={t("profile")} description={t("profile_team_description")}>
-      <LegacyPage isAppDir={true} />
+      <LegacyPage />
     </SettingsHeader>
   );
 };

apps/web/app/future/settings/(settings)/organizations/teams/other/page.tsx → apps/web/app/settings/(settings-layout)/organizations/teams/other/page.tsx

@@ -16,7 +16,7 @@ const Page = async () => {
 
   return (
     <SettingsHeader title={t("org_admin_other_teams")} description={t("org_admin_other_teams_description")}>
-      <LegacyPage isAppDir={true} />
+      <LegacyPage />
     </SettingsHeader>
   );
 };

apps/web/app/future/settings/(settings)/organizations/members/page.tsx → apps/web/app/settings/organizations/members/page.tsx

@@ -1,8 +1,10 @@
 import { _generateMetadata, getFixedT } from "app/_utils";
+import { WithLayout } from "app/layoutHOC";
 
 import { getServerSessionForAppDir } from "@calcom/features/auth/lib/get-server-session-for-app-dir";
 import LegacyPage from "@calcom/features/ee/organizations/pages/settings/members";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
+import SettingsLayoutAppDir from "@calcom/features/settings/appDir/SettingsLayoutAppDir";
 
 export const generateMetadata = async () =>
   await _generateMetadata(
@@ -16,9 +18,12 @@ const Page = async () => {
 
   return (
     <SettingsHeader title={t("organization_members")} description={t("organization_description")}>
-      <LegacyPage isAppDir={true} />
+      <LegacyPage />
     </SettingsHeader>
   );
 };
 
-export default Page;
+const getLayout = async (page: React.ReactElement) =>
+  await SettingsLayoutAppDir({ children: page, containerClassName: "lg:max-w-screen-2xl" });
+
+export default WithLayout({ ServerPage: Page, getServerLayout: getLayout })<"P">;