From 0f5d914060b1e0c2b45f1f4b1a5d2f5ea566a8c0 Mon Sep 17 00:00:00 2001
From: Georg Bremer <github@dschoordsch.de>
Date: Wed, 31 Jul 2024 15:57:08 +0200
Subject: [PATCH] fix: Fix error in start meeting if the user has no teams

Show a more helpful error message instead
---
 .../ActivityLibrary/ActivityDetailsSidebar.tsx       | 12 +++++++++++-
 .../components/ActivityLibrary/TeamPickerModal.tsx   |  7 +++++--
 .../client/components/DashNavList/DashNavList.tsx    |  7 +++----
 .../client/components/TimelineSuggestedAction.tsx    |  6 ++++--
 4 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/packages/client/components/ActivityLibrary/ActivityDetailsSidebar.tsx b/packages/client/components/ActivityLibrary/ActivityDetailsSidebar.tsx
index 65f2f386017..b7b048d8cce 100644
--- a/packages/client/components/ActivityLibrary/ActivityDetailsSidebar.tsx
+++ b/packages/client/components/ActivityLibrary/ActivityDetailsSidebar.tsx
@@ -26,6 +26,7 @@ import NewMeetingSettingsToggleCheckIn from '../NewMeetingSettingsToggleCheckIn'
 import NewMeetingSettingsToggleTeamHealth from '../NewMeetingSettingsToggleTeamHealth'
 import NewMeetingTeamPicker from '../NewMeetingTeamPicker'
 import StyledError from '../StyledError'
+import StyledLink from '../StyledLink'
 import ScheduleMeetingButton from './ScheduleMeetingButton'
 
 interface Props {
@@ -102,7 +103,7 @@ const ActivityDetailsSidebar = (props: Props) => {
     () =>
       availableTeams.find((team) => team.id === preferredTeamId) ??
       templateTeam ??
-      sortByTier(availableTeams)[0]!
+      sortByTier(availableTeams)[0]
   )
 
   const onSelectTeam = (teamId: string) => {
@@ -114,6 +115,15 @@ const ActivityDetailsSidebar = (props: Props) => {
   const {onError, onCompleted, submitting, submitMutation, error} = mutationProps
   const history = useHistory()
 
+  // user has no teams
+  if (!selectedTeam)
+    return (
+      <div className='flex w-full flex-col items-center border-t border-solid border-slate-300 bg-white px-4 pt-2 lg:right-0 lg:top-0 lg:h-full lg:w-96 lg:flex-1 lg:border-l lg:pt-14'>
+        <div className='self-center italic'>You have no teams to start a meeting with!</div>
+        <StyledLink to='/newteam'>Create a team</StyledLink>
+      </div>
+    )
+
   const handleStartActivity = (name?: string, rrule?: RRule, gcalInput?: CreateGcalEventInput) => {
     if (submitting) return
     submitMutation()
diff --git a/packages/client/components/ActivityLibrary/TeamPickerModal.tsx b/packages/client/components/ActivityLibrary/TeamPickerModal.tsx
index 9f9a3083622..2d16d9571b7 100644
--- a/packages/client/components/ActivityLibrary/TeamPickerModal.tsx
+++ b/packages/client/components/ActivityLibrary/TeamPickerModal.tsx
@@ -48,7 +48,7 @@ const TeamPickerModal = (props: Props) => {
   )
 
   const [selectedTeam, setSelectedTeam] = useState(
-    teams.find((team) => team.id === preferredTeamId) ?? sortByTier(teams)[0]!
+    teams.find((team) => team.id === preferredTeamId) ?? sortByTier(teams)[0]
   )
 
   const atmosphere = useAtmosphere()
@@ -56,10 +56,13 @@ const TeamPickerModal = (props: Props) => {
 
   useEffect(() => {
     onCompleted()
-  }, [selectedTeam.id])
+  }, [selectedTeam?.id])
 
   const history = useHistory()
 
+  // user has no teams
+  if (!selectedTeam) return null
+
   const handleSelectTeam = () => {
     if (submitting) {
       return
diff --git a/packages/client/components/DashNavList/DashNavList.tsx b/packages/client/components/DashNavList/DashNavList.tsx
index bda7d56a650..40a00f3105e 100644
--- a/packages/client/components/DashNavList/DashNavList.tsx
+++ b/packages/client/components/DashNavList/DashNavList.tsx
@@ -54,10 +54,6 @@ const DashNavList = (props: Props) => {
 
   const teams = organizations.flatMap((org) => org.viewerTeams)
 
-  if (teams?.length === 0) {
-    return <EmptyTeams>{'It appears you are not a member of any team!'}</EmptyTeams>
-  }
-
   return (
     <div className='w-full p-3 pt-4 pb-0'>
       {sortedOrgs.map((org) => (
@@ -83,6 +79,9 @@ const DashNavList = (props: Props) => {
           <DashNavListTeams onClick={onClick} organizationRef={org} />
         </div>
       ))}
+      {teams?.length === 0 && (
+        <EmptyTeams>{'It appears you are not a member of any team!'}</EmptyTeams>
+      )}
     </div>
   )
 }
diff --git a/packages/client/components/TimelineSuggestedAction.tsx b/packages/client/components/TimelineSuggestedAction.tsx
index 5f192adb47a..3d6b8d16f3d 100644
--- a/packages/client/components/TimelineSuggestedAction.tsx
+++ b/packages/client/components/TimelineSuggestedAction.tsx
@@ -57,7 +57,7 @@ function TimelineSuggestedAction(props: Props) {
     viewerRef
   )
   const {suggestedActions} = viewer
-  const [suggestedAction] = suggestedActions
+  const suggestedAction = suggestedActions?.[0]
   let AsyncComponent: ValueOf<typeof lookup> | undefined
   if (suggestedAction) {
     const {__typename} = suggestedAction
@@ -66,7 +66,9 @@ function TimelineSuggestedAction(props: Props) {
   return (
     <Wrapper>
       <DelayUnmount unmountAfter={500}>
-        {AsyncComponent ? <AsyncComponent suggestedAction={suggestedAction!} /> : null}
+        {AsyncComponent && suggestedAction ? (
+          <AsyncComponent suggestedAction={suggestedAction} />
+        ) : null}
       </DelayUnmount>
     </Wrapper>
   )