v2.7.13

Co-authored-by: Alex van Andel <me@alexvanandel.com>

apps/web/components/booking/BookingDescription.tsx

@@ -132,9 +132,9 @@ const BookingDescription: FC<Props> = (props) => {
                       variant="gray"
                       className={classNames(
                         duration === dur.toString()
-                          ? "bg-darkgray-200 text-darkgray-900 dark:bg-darkmodebrand dark:!text-darkmodebrandcontrast"
-                          : "hover:bg-darkgray-200 dark:hover:bg-darkmodebrand hover:text-darkgray-900 dark:hover:text-darkmodebrandcontrast dark:bg-darkgray-200 bg-emphasis text-emphasis dark:text-inverted",
-                        "cursor-pointer"
+                          ? "bg-emphasis border-emphasis text-emphasis "
+                          : "bg-subtle text-default border-transparent ",
+                        "cursor-pointer border"
                       )}
                       onClick={() => {
                         setDuration(dur);

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@calcom/web",
-  "version": "2.7.12",
+  "version": "2.7.13",
   "private": true,
   "scripts": {
     "analyze": "ANALYZE=true next build",

apps/web/pages/teams/index.tsx

@@ -1,3 +1,5 @@
+import { serverSideTranslations } from "next-i18next/serverSideTranslations";
+
 import { TeamsListing } from "@calcom/features/ee/teams/components";
 import Shell from "@calcom/features/shell/Shell";
 import { WEBAPP_URL } from "@calcom/lib/constants";
@@ -25,6 +27,14 @@ function Teams() {
   );
 }
 
+export const getStaticProps = async () => {
+  return {
+    props: {
+      ...(await serverSideTranslations("en", ["common"])),
+    },
+  };
+};
+
 Teams.requiresLicense = false;
 
 export default Teams;

packages/app-store/stripepayment/lib/PaymentService.ts

@@ -61,7 +61,6 @@ export class PaymentService implements IAbstractPaymentService {
         amount: payment.amount,
         currency: this.credentials.default_currency,
         payment_method_types: ["card"],
-        application_fee_amount: paymentFee,
       };
 
       const paymentIntent = await this.stripe.paymentIntents.create(params, {

packages/core/components/NoSSR.tsx

@@ -0,0 +1,20 @@
+import { useState, useEffect } from "react";
+
+interface Props {
+  children: React.ReactNode; // React.ReactNode
+  fallback?: JSX.Element | null; // JSX.Element
+}
+
+const NoSSR = ({ children, fallback = null }: Props) => {
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => setMounted(true), []);
+
+  if (!mounted) {
+    return fallback;
+  }
+
+  return <>{children}</>;
+};
+
+export default NoSSR;

packages/features/flags/pages/flag-listing-view.tsx

@@ -1,5 +1,6 @@
 import { Suspense } from "react";
 
+import NoSSR from "@calcom/core/components/NoSSR";
 import { Meta } from "@calcom/ui";
 import { FiLoader } from "@calcom/ui/components/icon";
 
@@ -9,9 +10,11 @@ export const FlagListingView = () => {
   return (
     <>
       <Meta title="Feature Flags" description="Here you can toggle your Cal.com instance features." />
-      <Suspense fallback={<FiLoader />}>
-        <FlagAdminList />
-      </Suspense>
+      <NoSSR>
+        <Suspense fallback={<FiLoader />}>
+          <FlagAdminList />
+        </Suspense>
+      </NoSSR>
     </>
   );
 };

packages/features/shell/Shell.tsx

@@ -715,7 +715,7 @@ const MobileNavigationMoreItem: React.FC<{
   if (!shouldDisplayNavigationItem) return null;
 
   return (
-    <li className="border-b last:border-b-0" key={item.name}>
+    <li className="border-subtle border-b last:border-b-0" key={item.name}>
       <Link href={item.href} className="hover:bg-subtle flex items-center justify-between p-5">
         <span className="text-default flex items-center font-semibold ">
           {item.icon && <item.icon className="h-5 w-5 flex-shrink-0 ltr:mr-3 rtl:ml-3" aria-hidden="true" />}
@@ -912,7 +912,7 @@ function TopNav() {
 }
 
 export const MobileNavigationMoreItems = () => (
-  <ul className="mt-2 rounded-md border">
+  <ul className="border-subtle mt-2 rounded-md border">
     {mobileNavigationMoreItems.map((item) => (
       <MobileNavigationMoreItem key={item.name} item={item} />
     ))}

packages/prisma/seed-app-store.ts

@@ -160,7 +160,7 @@ async function createApp(
   await prisma.app.upsert({
     where: { slug },
     create: { slug, dirName, categories, keys, enabled: true },
-    update: { dirName, categories, keys, enabled: true },
+    update: { dirName, categories, keys },
   });
   await prisma.credential.updateMany({
     where: { type },

packages/trpc/react/trpc.ts

@@ -23,7 +23,7 @@ export const trpc = createTRPCNext<AppRouter, NextPageContext, "ExperimentalSusp
         ? "/api/trpc"
         : process.env.VERCEL_URL
         ? `https://${process.env.VERCEL_URL}/api/trpc`
-        : `http://${process.env.NEXT_PUBLIC_WEBAPP_URL}/api/trpc`;
+        : `${process.env.NEXT_PUBLIC_WEBAPP_URL}/api/trpc`;
 
     /**
      * If you want to use SSR, you need to use the server's full URL

packages/trpc/server/routers/viewer/apps.tsx

@@ -129,7 +129,7 @@ export const appsRouter = router({
         },
         create: {
           slug: input.slug,
-          dirName: appMetadata?.dirName || "",
+          dirName: appMetadata?.dirName || appMetadata?.slug || "",
           categories:
             (appMetadata?.categories as AppCategories[]) ||
             ([appMetadata?.category] as AppCategories[]) ||
@@ -261,7 +261,7 @@ export const appsRouter = router({
         update: { keys },
         create: {
           slug: input.slug,
-          dirName: appMetadata?.dirName || "",
+          dirName: appMetadata?.dirName || appMetadata?.slug || "",
           categories:
             (appMetadata?.categories as AppCategories[]) ||
             ([appMetadata?.category] as AppCategories[]) ||