Fixed issue when not all calendars were fetched for some accounts

Signed-off-by: Alex Rybchenko <arybchenko@box.com>

.changeset/tasty-goats-shout.md

@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-gcalendar': patch
+---
+
+Fixed issue when not all calendars were fetched for some accounts

plugins/gcalendar/src/api/client.ts

@@ -15,7 +15,7 @@
  */
 import { OAuthApi, createApiRef, FetchApi } from '@backstage/core-plugin-api';
 
-import { GCalendar, GCalendarEvent } from './types';
+import { GCalendarEvent, GCalendarList } from './types';
 import { ResponseError } from '@backstage/errors';
 
 type Options = {
@@ -58,7 +58,7 @@ export class GCalendarApiClient {
   }
 
   public async getCalendars(params?: any) {
-    return this.get<{ items: GCalendar[] }>(
+    return this.get<GCalendarList>(
       '/calendar/v3/users/me/calendarList',
       params,
     );

plugins/gcalendar/src/api/types.ts

@@ -17,6 +17,8 @@
 /// <reference types="gapi.auth2" />
 /// <reference types="gapi.client.calendar" />
 
+export type GCalendarList = gapi.client.calendar.CalendarList;
+
 export type GCalendar = gapi.client.calendar.CalendarListEntry;
 
 export type EventAttendee = gapi.client.calendar.EventAttendee;

plugins/gcalendar/src/components/CalendarCard/CalendarCard.tsx

@@ -15,7 +15,7 @@
  */
 import { sortBy } from 'lodash';
 import { DateTime } from 'luxon';
-import React, { useEffect, useMemo, useState } from 'react';
+import React, { useEffect, useState } from 'react';
 
 import { InfoCard, Progress } from '@backstage/core-components';
 import { useAnalytics } from '@backstage/core-plugin-api';
@@ -51,10 +51,10 @@ export const CalendarCard = () => {
     signIn(true);
   }, [signIn]);
 
-  const { isLoading: isCalendarLoading, data } = useCalendarsQuery({
-    enabled: isSignedIn,
-  });
-  const calendars = useMemo(() => data?.items || [], [data]);
+  const { isLoading: isCalendarLoading, data: calendars = [] } =
+    useCalendarsQuery({
+      enabled: isSignedIn,
+    });
   const primaryCalendarId = calendars.find(c => c.primary === true)?.id;
   const defaultSelectedCalendars = primaryCalendarId ? [primaryCalendarId] : [];
   const [storedCalendars, setStoredCalendars] = useStoredCalendars(

plugins/gcalendar/src/hooks/useCalendarsQuery.ts

@@ -30,10 +30,22 @@ export const useCalendarsQuery = ({ enabled }: Options) => {
 
   return useQuery(
     ['calendars'],
-    async () =>
-      calendarApi.getCalendars({
-        minAccessRole: 'reader',
-      }),
+    async () => {
+      const calendars = [];
+      let token = '';
+      do {
+        const { nextPageToken = '', items = [] } =
+          await calendarApi.getCalendars({
+            maxResults: 100,
+            minAccessRole: 'reader',
+            pageToken: token,
+          });
+        token = nextPageToken;
+        calendars.push(...items);
+      } while (token);
+
+      return calendars;
+    },
     {
       enabled,
       keepPreviousData: true,