From d6362ce0bdb1e9cd71d33bc9045dca265ac8b4a3 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Thu, 4 Jan 2024 23:58:09 +1100
Subject: [PATCH] fix(ui): fix invalid nesting of button in button

---
 .../src/features/ui/components/InvokeTabs.tsx | 22 +++++++++----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx b/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
index 3ee22260cf..f94ef631c0 100644
--- a/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
+++ b/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx
@@ -136,17 +136,17 @@ const InvokeTabs = () => {
     () =>
       enabledTabs.map((tab) => (
         <InvTooltip key={tab.id} label={t(tab.translationKey)} placement="end">
-          <InvTab p={0}>
-            <InvIconButton
-              onClick={handleClickTab}
-              icon={tab.icon}
-              size="md"
-              fontSize="24px"
-              variant="appTab"
-              data-selected={activeTabName === tab.id}
-              aria-label={t(tab.translationKey)}
-            />
-          </InvTab>
+          <InvTab
+            as={InvIconButton}
+            p={0}
+            onClick={handleClickTab}
+            icon={tab.icon}
+            size="md"
+            fontSize="24px"
+            variant="appTab"
+            data-selected={activeTabName === tab.id}
+            aria-label={t(tab.translationKey)}
+          />
         </InvTooltip>
       )),
     [enabledTabs, t, handleClickTab, activeTabName]