From b38c302d7a000e14e5f658693f49cbf3037e573b Mon Sep 17 00:00:00 2001
From: David Lechner <david@pybricks.com>
Date: Fri, 16 Dec 2022 16:30:12 -0600
Subject: [PATCH] activities: fix aria-label on tablist

For some reason the compiler didn't give an error even though aria-label
was not a valid property.
---
 src/activities/Activities.tsx | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/activities/Activities.tsx b/src/activities/Activities.tsx
index 9eb60787..d38378a1 100644
--- a/src/activities/Activities.tsx
+++ b/src/activities/Activities.tsx
@@ -85,9 +85,20 @@ const Activities: React.VoidFunctionComponent = () => {
         }
     }, [tabsRef]);
 
+    useEffect(() => {
+        // @ts-expect-error: using private property
+        const tablist: HTMLDivElement = tabsRef.current?.tablistElement;
+
+        // istanbul-ignore-if: should not happen
+        if (!tablist) {
+            return;
+        }
+
+        tablist.setAttribute('aria-label', i18n.translate('title'));
+    }, [i18n]);
+
     return (
         <Tabs
-            aria-label={i18n.translate('title')}
             vertical={true}
             className="pb-activities"
             selectedTabId={selectedActivity}