From 35c0f3318cc344f27bd6808fefb850a0d5dde2bf Mon Sep 17 00:00:00 2001
From: atanasster <atanasster@gmail.com>
Date: Thu, 29 Apr 2021 10:22:40 -0400
Subject: [PATCH] fix: fix for aria-allowed-attr on div

---
 ui/components/src/Tree/Tree.tsx                    |  8 +++++++-
 .../src/Tree/__snapshots__/Tree.test.ts.snap       | 14 +++++++-------
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/ui/components/src/Tree/Tree.tsx b/ui/components/src/Tree/Tree.tsx
index 3405b3070..64fb81609 100644
--- a/ui/components/src/Tree/Tree.tsx
+++ b/ui/components/src/Tree/Tree.tsx
@@ -102,7 +102,6 @@ export const Tree: FC<TreeProps> = ({
     const isActiveParent = hasActiveChidlren(item, activeItem);
     const expandIcon = itemItems?.length ? (
       <Box
-        aria-label={isExpanded ? 'collapse items' : 'expand items'}
         variant="tree.expandicon"
         sx={{
           transform: isExpanded ? undefined : 'rotate(-90deg)',
@@ -124,6 +123,13 @@ export const Tree: FC<TreeProps> = ({
             className={isActiveItem && !itemItems ? 'selected' : undefined}
           >
             <LinkClass
+              aria-label={
+                itemItems?.length
+                  ? isExpanded
+                    ? 'collapse items'
+                    : 'expand items'
+                  : undefined
+              }
               variant="tree.link"
               {...rest}
               onClick={(e: any) => {
diff --git a/ui/components/src/Tree/__snapshots__/Tree.test.ts.snap b/ui/components/src/Tree/__snapshots__/Tree.test.ts.snap
index 179212c39..eaecf9e5d 100644
--- a/ui/components/src/Tree/__snapshots__/Tree.test.ts.snap
+++ b/ui/components/src/Tree/__snapshots__/Tree.test.ts.snap
@@ -21,6 +21,7 @@ exports[`Tree arrowsStart snapshot 1`] = `
               class="css-162ewbd"
             >
               <button
+                aria-label="collapse items"
                 class="css-t9fq0h"
               >
                 <div
@@ -30,7 +31,6 @@ exports[`Tree arrowsStart snapshot 1`] = `
                     class="css-f5h6sg"
                   >
                     <div
-                      aria-label="collapse items"
                       class="css-aqscwe"
                     >
                       <svg
@@ -645,6 +645,7 @@ exports[`Tree customExpandIcons snapshot 1`] = `
               class="css-162ewbd"
             >
               <button
+                aria-label="collapse items"
                 class="css-t9fq0h"
               >
                 <div
@@ -684,7 +685,6 @@ exports[`Tree customExpandIcons snapshot 1`] = `
                     class="css-vthntz"
                   >
                     <div
-                      aria-label="collapse items"
                       class="css-aqscwe"
                     >
                       <svg
@@ -1269,6 +1269,7 @@ exports[`Tree items snapshot 1`] = `
               class="css-162ewbd"
             >
               <button
+                aria-label="collapse items"
                 class="css-t9fq0h"
               >
                 <div
@@ -1308,7 +1309,6 @@ exports[`Tree items snapshot 1`] = `
                     class="css-vthntz"
                   >
                     <div
-                      aria-label="collapse items"
                       class="css-aqscwe"
                     >
                       <svg
@@ -1894,6 +1894,7 @@ exports[`Tree largeIndentation snapshot 1`] = `
               class="css-162ewbd"
             >
               <button
+                aria-label="collapse items"
                 class="css-t9fq0h"
               >
                 <div
@@ -1933,7 +1934,6 @@ exports[`Tree largeIndentation snapshot 1`] = `
                     class="css-vthntz"
                   >
                     <div
-                      aria-label="collapse items"
                       class="css-aqscwe"
                     >
                       <svg
@@ -2519,6 +2519,7 @@ exports[`Tree overview snapshot 1`] = `
               class="css-162ewbd"
             >
               <button
+                aria-label="collapse items"
                 class="css-t9fq0h"
               >
                 <div
@@ -2539,7 +2540,6 @@ exports[`Tree overview snapshot 1`] = `
                     class="css-vthntz"
                   >
                     <div
-                      aria-label="collapse items"
                       class="css-aqscwe"
                     >
                       <svg
@@ -2653,6 +2653,7 @@ exports[`Tree overview snapshot 1`] = `
               class="css-162ewbd"
             >
               <button
+                aria-label="expand items"
                 class="css-t9fq0h"
               >
                 <div
@@ -2673,7 +2674,6 @@ exports[`Tree overview snapshot 1`] = `
                     class="css-vthntz"
                   >
                     <div
-                      aria-label="expand items"
                       class="css-164ifi5"
                     >
                       <svg
@@ -2731,6 +2731,7 @@ exports[`Tree search snapshot 1`] = `
               class="css-162ewbd"
             >
               <button
+                aria-label="collapse items"
                 class="css-t9fq0h"
               >
                 <div
@@ -2770,7 +2771,6 @@ exports[`Tree search snapshot 1`] = `
                     class="css-vthntz"
                   >
                     <div
-                      aria-label="collapse items"
                       class="css-aqscwe"
                     >
                       <svg