refactor /integrations with <Suspense /> (#1078)

* suspense

* iframe embeds

* calendar list container

* rename things as a container

* use list container on onboarding

* fix

* rm code

* newer alpha

* make it work in react 17

* fix

* fix

* make components handle error state through `QueryCell`

* fix constant

* fix type error

* type error

* type fixes

* fix package.lock

* fix webhook invalidate

* fix mt

* fix typo

* pr comment

server/routers/viewer.tsx

@@ -313,6 +313,18 @@ const loggedInViewerRouter = createProtectedRouter()
       };
     },
   })
+  .query("connectedCalendars", {
+    async resolve({ ctx }) {
+      const { user } = ctx;
+      // get user's credentials + their connected integrations
+      const calendarCredentials = getCalendarCredentials(user.credentials, user.id);
+
+      // get all the connected integrations' calendars (from third party)
+      const connectedCalendars = await getConnectedCalendars(calendarCredentials, user.selectedCalendars);
+
+      return connectedCalendars;
+    },
+  })
   .query("integrations", {
     async resolve({ ctx }) {
       const { user } = ctx;
@@ -338,11 +350,6 @@ const loggedInViewerRouter = createProtectedRouter()
       // get all the connected integrations' calendars (from third party)
       const connectedCalendars = await getConnectedCalendars(calendarCredentials, user.selectedCalendars);
 
-      const webhooks = await ctx.prisma.webhook.findMany({
-        where: {
-          userId: user.id,
-        },
-      });
       return {
         conferencing: {
           items: conferencing,
@@ -357,7 +364,6 @@ const loggedInViewerRouter = createProtectedRouter()
           numActive: countActive(payment),
         },
         connectedCalendars,
-        webhooks,
       };
     },
   })