frontend: IconButton: Fix ARIA usage with label and aria-expanded

Signed-off-by: Sagar Choudhary <sagar6203620715@gmail.com>

Author: Sagar-6203620715

frontend/src/components/common/ShowHideLabel/ShowHideLabel.tsx

@@ -58,17 +58,17 @@ export default function ShowHideLabel(props: ShowHideLabelProps) {
 
   return (
     <Box display={expanded ? 'block' : 'flex'}>
-      <label
+      <span
         id={labelIdOrRandom}
         style={{ wordBreak: 'break-all', whiteSpace: 'normal' }}
-        aria-expanded={!needsButton ? undefined : expanded}
       >
         {actualText}
         {needsButton && (
           <>
             {!expanded && '…'}
             <IconButton
               aria-controls={labelIdOrRandom}
+              aria-expanded={expanded}
               sx={{ display: 'inline' }}
               onClick={() => setExpanded(expandedVal => !expandedVal)}
               size="small"
@@ -78,7 +78,7 @@ export default function ShowHideLabel(props: ShowHideLabelProps) {
             </IconButton>
           </>
         )}
-      </label>
+      </span>
     </Box>
   );
 }