From ce614ca170c4a2bd17f5cf4d603595af2e45cacf Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Sun, 19 Dec 2021 22:08:25 -0800
Subject: [PATCH] chore: Minor typescript improves

---
 app/components/ContextMenu/index.tsx            | 6 ++----
 app/hooks/useSessions.ts                        | 2 +-
 app/menus/AccountMenu.tsx                       | 5 ++---
 app/scenes/Search/components/RecentSearches.tsx | 7 ++-----
 4 files changed, 7 insertions(+), 13 deletions(-)

diff --git a/app/components/ContextMenu/index.tsx b/app/components/ContextMenu/index.tsx
index 57d4f9b68..1d20038e5 100644
--- a/app/components/ContextMenu/index.tsx
+++ b/app/components/ContextMenu/index.tsx
@@ -49,7 +49,7 @@ export default function ContextMenu({
 }: Props) {
   const previousVisible = usePrevious(rest.visible);
   const maxHeight = useMenuHeight(rest.visible, rest.unstable_disclosureRef);
-  const backgroundRef = React.useRef();
+  const backgroundRef = React.useRef<HTMLDivElement>(null);
 
   React.useEffect(() => {
     if (rest.visible && !previousVisible) {
@@ -79,8 +79,7 @@ export default function ContextMenu({
           // kind of hacky, but this is an effective way of telling which way
           // the menu will _actually_ be placed when taking into account screen
           // positioning.
-          // @ts-expect-error ts-migrate(2532) FIXME: Object is possibly 'undefined'.
-          const topAnchor = props.style.top === "0";
+          const topAnchor = props.style?.top === "0";
           // @ts-expect-error ts-migrate(2339) FIXME: Property 'placement' does not exist on type 'Extra... Remove this comment to see the full error message
           const rightAnchor = props.placement === "bottom-end";
 
@@ -90,7 +89,6 @@ export default function ContextMenu({
                 dir="auto"
                 topAnchor={topAnchor}
                 rightAnchor={rightAnchor}
-                // @ts-expect-error ts-migrate(2769) FIXME: No overload matches this call.
                 ref={backgroundRef}
                 style={
                   maxHeight && topAnchor
diff --git a/app/hooks/useSessions.ts b/app/hooks/useSessions.ts
index 2833ee56d..32ddc10c6 100644
--- a/app/hooks/useSessions.ts
+++ b/app/hooks/useSessions.ts
@@ -16,7 +16,7 @@ function loadSessionsFromCookie(): Session[] {
   }));
 }
 
-export default function useSessions() {
+export default function useSessions(): [Session[], () => void] {
   const [sessions, setSessions] = React.useState(loadSessionsFromCookie);
   const reload = React.useCallback(() => {
     setSessions(loadSessionsFromCookie());
diff --git a/app/menus/AccountMenu.tsx b/app/menus/AccountMenu.tsx
index b71c213ec..4603fe23c 100644
--- a/app/menus/AccountMenu.tsx
+++ b/app/menus/AccountMenu.tsx
@@ -47,9 +47,7 @@ function AccountMenu(props: Props) {
   }, [menu, theme, previousTheme]);
 
   const actions = React.useMemo(() => {
-    // @ts-expect-error ts-migrate(2339) FIXME: Property 'filter' does not exist on type 'Session[... Remove this comment to see the full error message
     const otherSessions = sessions.filter(
-      // @ts-expect-error ts-migrate(7006) FIXME: Parameter 'session' implicitly has an 'any' type.
       (session) => session.teamId !== team.id && session.url !== team.url
     );
 
@@ -69,9 +67,10 @@ function AccountMenu(props: Props) {
             createAction({
               name: t("Switch team"),
               section: "account",
-              // @ts-expect-error ts-migrate(7006) FIXME: Parameter 'session' implicitly has an 'any' type.
               children: otherSessions.map((session) => ({
+                id: session.url,
                 name: session.name,
+                section: "account",
                 icon: <Logo alt={session.name} src={session.logoUrl} />,
                 perform: () => (window.location.href = session.url),
               })),
diff --git a/app/scenes/Search/components/RecentSearches.tsx b/app/scenes/Search/components/RecentSearches.tsx
index 98adf61ec..b064e51ac 100644
--- a/app/scenes/Search/components/RecentSearches.tsx
+++ b/app/scenes/Search/components/RecentSearches.tsx
@@ -24,11 +24,8 @@ function RecentSearches() {
       <Heading>{t("Recent searches")}</Heading>
       <List>
         {searches.recent.map((searchQuery) => (
-          <ListItem>
-            <RecentSearch
-              key={searchQuery.id}
-              to={searchUrl(searchQuery.query)}
-            >
+          <ListItem key={searchQuery.id}>
+            <RecentSearch to={searchUrl(searchQuery.query)}>
               {searchQuery.query}
               <Tooltip tooltip={t("Remove search")} delay={150}>
                 <RemoveButton