♻️(frontend) get rid of the ListItemActionButton

Use the primitive Button component, avoid maintaining two button
components.

src/frontend/src/features/rooms/livekit/components/controls/Participants/HandRaisedListItem.tsx

@@ -8,8 +8,8 @@ import { getParticipantColor } from '@/features/rooms/utils/getParticipantColor'
 import { Participant } from 'livekit-client'
 import { isLocal } from '@/utils/livekit'
 import { RiHand } from '@remixicon/react'
-import { ListItemActionButton } from '@/features/rooms/livekit/components/controls/Participants/ListItemActionButton'
 import { useLowerHandParticipant } from '@/features/rooms/livekit/api/lowerHandParticipant.ts'
+import { Button } from '@/primitives'
 
 type HandRaisedListItemProps = {
   participant: Participant
@@ -67,12 +67,15 @@ export const HandRaisedListItem = ({
           )}
         </Text>
       </HStack>
-      <ListItemActionButton
+      <Button
+        square
+        invisible
+        size="sm"
         onPress={() => lowerHandParticipant(participant)}
         tooltip={t('participants.lowerParticipantHand', { name })}
       >
-        <RiHand color="gray" />
+        <RiHand />
-      </ListItemActionButton>
+      </Button>
     </HStack>
   )
 }

src/frontend/src/features/rooms/livekit/components/controls/Participants/ListItemActionButton.tsx

@@ -1,39 +0,0 @@
-import { styled } from '@/styled-system/jsx'
-import {
-  Button as RACButton,
-  ButtonProps as RACButtonsProps,
-} from 'react-aria-components'
-import {
-  TooltipWrapper,
-  TooltipWrapperProps,
-} from '@/primitives/TooltipWrapper'
-
-const StyledButton = styled(RACButton, {
-  base: {
-    padding: '10px',
-    minWidth: '24px',
-    minHeight: '24px',
-    borderRadius: '50%',
-    backgroundColor: 'transparent',
-    transition: 'background 200ms',
-    '&[data-hovered]': {
-      backgroundColor: '#f5f5f5',
-    },
-    '&[data-focused]': {
-      backgroundColor: '#f5f5f5',
-    },
-  },
-})
-
-export const ListItemActionButton = ({
-  tooltip,
-  tooltipType = 'instant',
-  children,
-  ...props
-}: RACButtonsProps & TooltipWrapperProps) => {
-  return (
-    <TooltipWrapper tooltip={tooltip} tooltipType={tooltipType}>
-      <StyledButton {...props}>{children}</StyledButton>
-    </TooltipWrapper>
-  )
-}

src/frontend/src/features/rooms/livekit/components/controls/Participants/ParticipantListItem.tsx

@@ -17,7 +17,6 @@ import { RiMicOffLine } from '@remixicon/react'
 import { Button, Dialog, P } from '@/primitives'
 import { useState } from 'react'
 import { useMuteParticipant } from '@/features/rooms/livekit/api/muteParticipant'
-import { ListItemActionButton } from '@/features/rooms/livekit/components/controls/Participants/ListItemActionButton'
 
 const MuteAlertDialog = ({
   isOpen,
@@ -66,7 +65,10 @@ const MicIndicator = ({ participant }: MicIndicatorProps) => {
 
   return (
     <>
-      <ListItemActionButton
+      <Button
+        square
+        invisible
+        size="sm"
         tooltip={t('participants.muteParticipant', {
           name,
         })}
@@ -78,7 +80,7 @@ const MicIndicator = ({ participant }: MicIndicatorProps) => {
         ) : (
           <ActiveSpeaker isSpeaking={isSpeaking} />
         )}
-      </ListItemActionButton>
+      </Button>
       <MuteAlertDialog
         isOpen={isAlertOpen}
         onSubmit={() =>