hunk.code_window:     "@calcom/web#start": {
         "dependsOn": ["@calcom/prisma#db-deploy"]
       },
       "@calcom/website#build": {
         "dependsOn": ["$WEBSITE_BASE_URL"],
         "outputs": [".next/**"]
       },
       "build": {
  
hunk.labels: keep keep keep keep replace keep keep keep
hunk.after_edit:       "dependsOn": [
           "$NEXT_PUBLIC_STRIPE_FREE_PLAN_PRICE",
           "$NEXT_PUBLIC_STRIPE_PREMIUM_PLAN_PRICE",
           "$NEXT_PUBLIC_STRIPE_PRO_PLAN_PRICE",
           "$NEXT_PUBLIC_STRIPE_PRO_PLAN_PRODUCT",
           "$NEXT_PUBLIC_STRIPE_PUBLIC_KEY",
           "$NEXT_PUBLIC_WEBAPP_URL",
           "$NEXT_PUBLIC_WEBSITE_URL",
           "$STRIPE_WEBHOOK_SECRET"
         ],
  
hunk.file_path: turbo.json
hunk.type: replace
file: import fs from "fs";
  import matter from "gray-matter";
  import { GetStaticPaths, GetStaticPathsResult, GetStaticPropsContext } from "next";
  import { MDXRemote } from "next-mdx-remote";
  import { serialize } from "next-mdx-remote/serialize";
  import Image from "next/image";
  import Link from "next/link";
  import path from "path";
  
  import { getAppRegistry } from "@calcom/app-store/_appRegistry";
  
  import useMediaQuery from "@lib/hooks/useMediaQuery";
  import { inferSSRProps } from "@lib/types/inferSSRProps";
  
  import App from "@components/App";
  import Slider from "@components/apps/Slider";
  
  const components = {
    a: ({ href = "", ...otherProps }: JSX.IntrinsicElements["a"]) => (
      <Link href={href}>
        <a {...otherProps} />
      </Link>
    ),
    img: ({ src = "", alt = "", placeholder, ...rest }: JSX.IntrinsicElements["img"]) => (
      <Image src={src} alt={alt} {...rest} />
    ),
    Slider: ({ items }: { items: string[] }) => {
      const isTabletAndUp = useMediaQuery("(min-width: 960px)");
      return (
        <Slider<string>
          items={items}
          title="Screenshots"
          options={{
            perView: 1,
          }}
          renderItem={(item) =>
            isTabletAndUp ? (
              <Image src={item} alt="" loading="eager" layout="fixed" width={573} height={382} />
            ) : (
              <Image src={item} alt="" layout="responsive" width={573} height={382} />
            )
          }
        />
      );
    },
  };
  
  function SingleAppPage({ data, source }: inferSSRProps<typeof getStaticProps>) {
    return (
      <App
        name={data.name}
        isGlobal={data.isGlobal}
        type={data.type}
        logo={data.logo}
        categories={[data.category]}
        author="Cal.com"
        feeType={data.feeType || "usage-based"}
        price={data.price || 0}
        commission={data.commission || 0}
        docs={data.docsUrl}
        website={data.url}
        email={data.email}
        //   tos="https://zoom.us/terms"
        //   privacy="https://zoom.us/privacy"
        body={<MDXRemote {...source} components={components} />}
      />
    );
  }
  
  export const getStaticPaths: GetStaticPaths<{ slug: string }> = async () => {
    const appStore = getAppRegistry();
    const paths = appStore.reduce((paths, app) => {
      paths.push({ params: { slug: app.slug } });
      return paths;
    }, [] as GetStaticPathsResult<{ slug: string }>["paths"]);
  
    return {
      paths,
      fallback: false,
    };
  };
  
  export const getStaticProps = async (ctx: GetStaticPropsContext) => {
    const appStore = getAppRegistry();
  
    if (typeof ctx.params?.slug !== "string") {
      return {
        notFound: true,
      };
    }
  
    const singleApp = appStore.find((app) => app.slug === ctx.params?.slug);
  
    if (!singleApp) {
      return {
        notFound: true,
      };
    }
  
    const appDirname = singleApp.type.replace("_", "");
    const README_PATH = path.join(process.cwd(), "..", "..", `packages/app-store/${appDirname}/README.mdx`);
    const postFilePath = path.join(README_PATH);
    let source = "";
  
    try {
      /* If the app doesn't have a README we fallback to the packagfe description */
      source = fs.readFileSync(postFilePath).toString();
    } catch (error) {
      console.log("error", error);
      source = singleApp.description;
    }
  
    const { content, data } = matter(source);
    const mdxSource = await serialize(content, { scope: data });
  
    return {
      props: {
        source: mdxSource,
        data: singleApp,
      },
    };
  };
  
  export default SingleAppPage;
  