Fix/availability not loading by joeauyeung · Pull Request #7789 · calcom/cal.com

joeauyeung · 2023-03-16T22:32:51Z

What does this PR do?

This PR fixes

Endless loading on the availability page
Fixes the default schedule not saving in the DB
Handles if a user does not have any schedules

https://www.loom.com/share/dd7e533941f5418db5d2667b142ad8be

Fixes #7783

Environment: Staging(main branch) / Production

Type of change

Bug fix (non-breaking change which fixes an issue)

How should this be tested?

Go to an event type page
On the availability, the schedule should load
Delete all schedules
Go back to the availability page, you should have the option of creating a new schedule
The new schedule should be your new default

Checklist

I haven't added tests that prove my fix is effective or that my feature works
I haven't checked if new and existing unit tests pass locally with my changes

vercel · 2023-03-16T22:32:58Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated
cal	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Mar 27, 2023 at 7:30PM (UTC)
dhe	❌ Failed (Inspect)			Mar 27, 2023 at 7:30PM (UTC)

1 Ignored Deployment

Name	Status	Preview	Comments	Updated
ui	⬜️ Ignored (Inspect)	Visit Preview		Mar 27, 2023 at 7:30PM (UTC)

joeauyeung · 2023-03-16T22:37:56Z

apps/web/components/eventtype/AvailabilityTab.tsx

+  isLoading: boolean;
+  schedules: RouterOutputs["viewer"]["availability"]["list"]["schedules"] | [];


Moved the query up a level to display the empty screen component if there are no schedules

During load it flashes the empty screen component before showing the schedule. (blocking because of this)

There is a design implementation error on the empty screen with a double border. NIT as it's unrelated

Removes double flash
0507f85

Removes border
1b58b3c

joeauyeung · 2023-03-16T22:40:31Z

apps/web/pages/availability/[schedule].tsx

  return (
    <Shell
-      backPath="/availability"
+      backPath={fromEventType ? true : "/availability"}


If we create a new schedule from an event type, the back button should bring the user back to the event type.

joeauyeung · 2023-03-16T22:41:33Z

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

+        if (!user.defaultScheduleId) {
+          await prisma.user.update({
+            where: {
+              id: user.id,
+            },
+            data: {
+              defaultScheduleId: schedule.id,
+            },
+          });


This function returns the first schedule as the default if the user does not have one set. If this is the case then we should set that schedule as the default

Isn't this what setupDefaultSchedule did/does? 😕

That's what I thought as well, but it wasn't triggering

Dug into it some more. The getter always returned an id, either the user default id or the first schedule in the query. That means the update was never triggered.

joeauyeung · 2023-03-16T22:43:21Z

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

            },
            data: {
-              defaultScheduleId: scheduleToSetAsDefault?.id,
+              defaultScheduleId: scheduleToSetAsDefault?.id || null,


If a user deletes a schedule, the next available schedule should be their default. If there are none, then we should set the field to null.

github-actions · 2023-03-16T22:45:29Z

📦 Next.js Bundle Analysis

This analysis was generated by the next.js bundle analysis action 🤖

⚠️ Global Bundle Size Increased

Page	Size (compressed)
`global`	`233.24 KB` (🟡 +22 B)

Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

Forty-three Pages Changed Size

The following pages changed size from the code in this PR compared to its base branch:

Page	Size (compressed)	First Load	% of Budget (`350 KB`)
`/apps`	`167.17 KB`	400.41 KB	114.40% (+/- <0.01%)
`/apps/[slug]`	`190.9 KB`	424.14 KB	121.18% (+/- <0.01%)
`/apps/[slug]/[...pages]`	`392.31 KB`	625.55 KB	178.73% (+/- <0.01%)
`/apps/categories`	`152.07 KB`	385.31 KB	110.09% (+/- <0.01%)
`/apps/categories/[category]`	`155.94 KB`	389.18 KB	111.19% (+/- <0.01%)
`/apps/installed/[category]`	`197.04 KB`	430.28 KB	122.94% (+/- <0.01%)
`/availability`	`155.38 KB`	388.62 KB	111.03% (🟡 +0.03%)
`/availability/[schedule]`	`272.13 KB`	505.38 KB	144.39% (🟡 +0.02%)
`/availability/troubleshoot`	`152.76 KB`	386 KB	110.29% (🟢 -0.01%)
`/bookings/[status]`	`272.38 KB`	505.62 KB	144.46% (+/- <0.01%)
`/event-types`	`349.31 KB`	582.55 KB	166.44% (+/- <0.01%)
`/event-types/[type]`	`382.89 KB`	616.13 KB	176.04% (🟡 +0.15%)
`/insights`	`386.24 KB`	619.48 KB	176.99% (+/- <0.01%)
`/more`	`151.7 KB`	384.94 KB	109.98% (+/- <0.01%)
`/settings/admin`	`157.15 KB`	390.39 KB	111.54% (+/- <0.01%)
`/settings/admin/apps`	`165.84 KB`	399.08 KB	114.02% (+/- <0.01%)
`/settings/admin/apps/[category]`	`165.82 KB`	399.06 KB	114.02% (+/- <0.01%)
`/settings/admin/flags`	`160.05 KB`	393.29 KB	112.37% (+/- <0.01%)
`/settings/admin/impersonation`	`157.44 KB`	390.68 KB	111.62% (+/- <0.01%)
`/settings/billing`	`157.26 KB`	390.5 KB	111.57% (+/- <0.01%)
`/settings/developer/api-keys`	`186.42 KB`	419.66 KB	119.90% (+/- <0.01%)
`/settings/developer/webhooks`	`159.76 KB`	393 KB	112.28% (+/- <0.01%)
`/settings/developer/webhooks/[id]`	`190.61 KB`	423.85 KB	121.10% (+/- <0.01%)
`/settings/developer/webhooks/new`	`190.47 KB`	423.71 KB	121.06% (+/- <0.01%)
`/settings/my-account/appearance`	`171.23 KB`	404.47 KB	115.56% (+/- <0.01%)
`/settings/my-account/calendars`	`191.45 KB`	424.69 KB	121.34% (+/- <0.01%)
`/settings/my-account/conferencing`	`163.03 KB`	396.27 KB	113.22% (+/- <0.01%)
`/settings/my-account/general`	`266.42 KB`	499.66 KB	142.76% (+/- <0.01%)
`/settings/my-account/profile`	`274.31 KB`	507.55 KB	145.02% (🟢 -0.01%)
`/settings/security/impersonation`	`159.3 KB`	392.54 KB	112.16% (🟢 -0.01%)
`/settings/security/password`	`192.6 KB`	425.84 KB	121.67% (+/- <0.01%)
`/settings/security/sso`	`167 KB`	400.24 KB	114.35% (+/- <0.01%)
`/settings/security/two-factor-auth`	`161.76 KB`	395 KB	112.86% (+/- <0.01%)
`/settings/teams`	`156.9 KB`	390.14 KB	111.47% (+/- <0.01%)
`/settings/teams/[id]/appearance`	`171.25 KB`	404.49 KB	115.57% (+/- <0.01%)
`/settings/teams/[id]/billing`	`157.13 KB`	390.37 KB	111.54% (🟢 -0.01%)
`/settings/teams/[id]/members`	`297.13 KB`	530.38 KB	151.54% (🟢 -0.01%)
`/settings/teams/[id]/profile`	`269.52 KB`	502.76 KB	143.65% (+/- <0.01%)
`/settings/teams/[id]/sso`	`167.09 KB`	400.33 KB	114.38% (+/- <0.01%)
`/settings/teams/new`	`92.72 KB`	325.96 KB	93.13% (+/- <0.01%)
`/teams`	`151.91 KB`	385.15 KB	110.04% (+/- <0.01%)
`/workflows`	`164.81 KB`	398.05 KB	113.73% (+/- <0.01%)
`/workflows/[workflow]`	`294.01 KB`	527.25 KB	150.64% (+/- <0.01%)

Details

Only the gzipped size is provided here based on an expert tip.

First Load is the size of the global bundle plus the bundle for the individual page. If a user were to show up to your website and land on a given page, the first load size represents the amount of javascript that user would need to download. If next/link is used, subsequent page loads would only need to download that page's bundle (the number in the "Size" column), since the global bundle has already been downloaded.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

The "Budget %" column shows what percentage of your performance budget the First Load total takes up. For example, if your budget was 100kb, and a given page's first load size was 10kb, it would be 10% of your budget. You can also see how much this has increased or decreased compared to the base branch of your PR. If this percentage has increased by 20% or more, there will be a red status indicator applied, indicating that special attention should be given to this. If you see "+/- <0.01%" it means that there was a change in bundle size, but it is a trivial enough amount that it can be ignored.

deploysentinel · 2023-03-16T22:49:36Z

No failed tests 🎉

emrysal · 2023-03-16T22:50:43Z

apps/web/components/eventtype/AvailabilityTab.tsx

+  isLoading: boolean;
+  schedules: RouterOutputs["viewer"]["availability"]["list"]["schedules"] | [];


During load it flashes the empty screen component before showing the schedule. (blocking because of this)

There is a design implementation error on the empty screen with a double border. NIT as it's unrelated

emrysal · 2023-03-16T23:04:19Z

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

+        if (!user.defaultScheduleId) {
+          await prisma.user.update({
+            where: {
+              id: user.id,
+            },
+            data: {
+              defaultScheduleId: schedule.id,
+            },
+          });


Isn't this what setupDefaultSchedule did/does? 😕

emrysal · 2023-03-16T23:04:48Z

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

            },
            data: {
-              defaultScheduleId: scheduleToSetAsDefault?.id,
+              defaultScheduleId: scheduleToSetAsDefault?.id || null,


emrysal · 2023-03-16T23:05:55Z

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

    },
  });

+  await prisma.user.update({


An update in a getter is very unexpected, function probably needs renaming (or logic modified)

joeauyeung · 2023-03-17T01:15:18Z

packages/prisma/schema.prisma

  bookings             Booking[]
  schedules            Schedule[]
-  defaultScheduleId    Int?
+  defaultScheduleId    Int


Made optional in the next commit

joeauyeung · 2023-03-17T01:15:24Z

@emrysal from our conversation, I prevented users from deleting their last schedule. Also, during setup when the first schedule is created, it should automatically populate the defaultScheduleId. However, we need to keep this field optional since users are created in the DB before their first schedule.

de1690d

emrysal

LGTM

joeauyeung added 5 commits March 16, 2023 14:57

Set default schedule if there is not one

432a44e

Removing last schedule sets user.defaultScheduleId to null

d8079e2

Create new schedule from event type

6a4d8ae

First schedule created is the default

b709ff6

Go back if new schedule was created

3cb3a25

joeauyeung requested a review from zomars as a code owner March 16, 2023 22:32

joeauyeung requested review from a team March 16, 2023 22:32

Merge branch 'main' into fix/availability-not-loading

030f800

vercel bot had a problem deploying to Preview – ui March 16, 2023 22:35 Failure

vercel bot deployed to Preview – cal March 16, 2023 22:42 View deployment

joeauyeung commented Mar 16, 2023

View reviewed changes

emrysal requested changes Mar 16, 2023

View reviewed changes

Moved update logic out of getter

7b2881b

vercel bot had a problem deploying to Preview – ui March 17, 2023 00:15 Failure

joeauyeung added 2 commits March 16, 2023 20:17

Remove flashing of empty screen

0507f85

Add border prop to EmptyScreen

1b58b3c

joeauyeung requested review from a team and emrysal March 17, 2023 00:23

vercel bot had a problem deploying to Preview – ui March 17, 2023 00:25 Failure

vercel bot deployed to Preview – cal March 17, 2023 00:34 View deployment

User requires a schedule

de1690d

vercel bot had a problem deploying to Preview – ui March 17, 2023 01:12 Failure

Change back schema

7db2f9a

joeauyeung commented Mar 17, 2023

View reviewed changes

vercel bot had a problem deploying to Preview – ui March 17, 2023 01:22 Failure

vercel bot deployed to Preview – cal March 17, 2023 01:29 View deployment

Merge branch 'main' into fix/availability-not-loading

8fb19ac

vercel bot had a problem deploying to Preview – ui March 17, 2023 13:47 Failure

vercel bot deployed to Preview – cal March 17, 2023 13:54 View deployment

PeerRich requested a review from keithwillcode March 17, 2023 22:32

Merge branch 'main' into fix/availability-not-loading

ab38a07

vercel bot deployed to Preview – ui March 20, 2023 16:38 View deployment

vercel bot deployed to Preview – cal March 20, 2023 16:40 View deployment

Merge branch 'main' into fix/availability-not-loading

f04e6e6

vercel bot deployed to Preview – ui March 20, 2023 16:50 View deployment

vercel bot deployed to Preview – cal March 20, 2023 16:54 View deployment

Merge branch 'main' into fix/availability-not-loading

83d0cc2

joeauyeung requested a review from PeerRich as a code owner March 27, 2023 19:03

vercel bot had a problem deploying to Preview – dhe March 27, 2023 19:04 Failure

vercel bot deployed to Preview – ui March 27, 2023 19:08 View deployment

emrysal approved these changes Mar 27, 2023

View reviewed changes

Merge branch 'main' into fix/availability-not-loading

91a2c47

vercel bot had a problem deploying to Preview – dhe March 27, 2023 19:17 Failure

Merge branch 'main' into fix/availability-not-loading

18b73ac

vercel bot had a problem deploying to Preview – dhe March 27, 2023 19:18 Failure

emrysal enabled auto-merge (squash) March 27, 2023 19:21

vercel bot deployed to Preview – cal March 27, 2023 19:30 View deployment

emrysal merged commit a2457ab into main Mar 27, 2023

emrysal deleted the fix/availability-not-loading branch March 27, 2023 19:53

PeerRich added the core area: core, team members only label Jul 24, 2023

		isLoading: boolean;
		schedules: RouterOutputs["viewer"]["availability"]["list"]["schedules"] \| [];

Conversation

joeauyeung commented Mar 16, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What does this PR do?

Type of change

How should this be tested?

Checklist

Uh oh!

vercel bot commented Mar 16, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

joeauyeung Mar 17, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Mar 16, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📦 Next.js Bundle Analysis

⚠️ Global Bundle Size Increased

Forty-three Pages Changed Size

Uh oh!

deploysentinel bot commented Mar 16, 2023 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

joeauyeung commented Mar 17, 2023

Uh oh!

emrysal left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

joeauyeung commented Mar 16, 2023 •

edited

Loading

vercel bot commented Mar 16, 2023 •

edited

Loading

joeauyeung Mar 17, 2023 •

edited

Loading

github-actions bot commented Mar 16, 2023 •

edited

Loading

deploysentinel bot commented Mar 16, 2023 •

edited

Loading