perf: layout persistence and reduced bundle size#18889
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎ 2 Skipped Deployments
|
dosubot
Bot
added
the
performance
Graphite Automations"Add consumer team as reviewer" took an action on this PR • (01/25/25)1 reviewer was added to this PR based on Keith Williams's automation. |
| {props.afterHeading && <>{props.afterHeading}</>} | ||
|
|
||
| <div className={classNames(props.flexChildrenContainer && "flex flex-1 flex-col")}> | ||
| {props.children} |
| : "pwa:bottom-[max(7rem,_calc(5rem_+_env(safe-area-inset-bottom)))] fixed bottom-20 z-40 ltr:right-4 rtl:left-4 md:z-auto md:ltr:right-0 md:rtl:left-0", | ||
| "flex-shrink-0 [-webkit-app-region:no-drag] md:relative md:bottom-auto md:right-auto" | ||
| )}> | ||
| {props.CTA} |
|
|
||
| // Copied from `ShellMain` but with a different `ShellMainAppDirBackButton` import | ||
| // for client/server component separation | ||
| export function ShellMainAppDir(props: LayoutProps) { |
There was a problem hiding this comment.
Copied from ShellMain component inside Shell.tsx.
I was able to turn this into RSC by extracting the back button into a separate client component ShellMainAppDirBackButton.tsx.
| heading={t("availability")} | ||
| subtitle={t("configure_availability")} |
There was a problem hiding this comment.
fyi, title or description are not needed. They are passed to Shell.tsx for SEO purposes, but they aren't used anywhere in ShellMain. Also, we turn withoutSeo={true} anyways since App Router handles Metadata already
| ); | ||
| }; | ||
|
|
||
| export const EventTypesCTA = () => { |
There was a problem hiding this comment.
extracted from CTA={...} in Main Page below
| }; | ||
|
|
||
| export default function AvailabilityPage({ currentOrg }: PageProps) { | ||
| export const AvailabilityCTA = () => { |
There was a problem hiding this comment.
Extracted from CTA={...} from Main page below
| @@ -19,14 +20,23 @@ export const generateMetadata = async () => | |||
|
|
|||
| const Page = async ({ params, searchParams }: PageProps) => { | |||
| const context = buildLegacyCtx(headers(), cookies(), params, searchParams); | |||
| const session = await getServerSessionForAppDir(); | |||
There was a problem hiding this comment.
this makes initial RSC fetch so slow, check https://app.campsite.com/cal/posts/58hm2drix99s
E2E results are ready! |
Udit-takkar
left a comment
Udit-takkar
left a comment
There was a problem hiding this comment.
Unit tests failing and merge conflicts
…ce-and-reduced-bundle-size
* create /(main-nav)/layout.tsx file that uses Shell * Add ShellMainAppDir that clones ShellMain but with client/server separation * event-types, availability, bookings * update pagesAndRewritePaths logic * fix --------- Co-authored-by: Peer Richelsen <peeroke@gmail.com>
4 participants
What does this PR do?
/event-types,/bookings/[status],/availability(main-nav), andlayout.tsxfile inside withShellShellindividually in its client componente.g.,
Mandatory Tasks (DO NOT REMOVE)
How should this be tested?