fix: removed noBackgroundColor from panel buttons

ts/components/buttons/PanelButton.tsx

@@ -63,7 +63,6 @@ export const PanelButtonGroup = (props: PanelButtonGroupProps) => {
 };
 
 const StyledPanelButton = styled.button<{
-  noBackgroundColor?: boolean;
   disabled: boolean;
 }>`
   cursor: ${props => (props.disabled ? 'not-allowed' : 'pointer')};
@@ -77,8 +76,6 @@ const StyledPanelButton = styled.button<{
   min-height: 50px;
   width: 100%;
   transition: var(--default-duration);
-  background-color: ${props =>
-    !props.noBackgroundColor ? 'var(--right-panel-item-background-hover-color) !important' : null};
   color: ${props => (props.disabled ? 'var(--disabled-color)' : 'inherit')};
 
   :not(:last-child) {
@@ -90,7 +87,6 @@ export type PanelButtonProps = {
   // https://styled-components.com/docs/basics#styling-any-component
   className?: string;
   disabled?: boolean;
-  noBackgroundColor?: boolean;
   children: ReactNode;
   onClick: (...args: Array<any>) => void;
   dataTestId?: string;
@@ -98,20 +94,11 @@ export type PanelButtonProps = {
 };
 
 export const PanelButton = (props: PanelButtonProps) => {
-  const {
-    className,
-    disabled = false,
-    noBackgroundColor,
-    children,
-    onClick,
-    dataTestId,
-    style,
-  } = props;
+  const { className, disabled = false, children, onClick, dataTestId, style } = props;
 
   return (
     <StyledPanelButton
       className={className}
-      noBackgroundColor={noBackgroundColor}
       disabled={disabled}
       onClick={onClick}
       style={style}

ts/components/buttons/PanelIconButton.tsx

@@ -8,15 +8,10 @@ interface PanelIconButton extends Omit<PanelButtonProps, 'children'> {
 }
 
 export const PanelIconButton = (props: PanelIconButton) => {
-  const { iconType, text, disabled = false, noBackgroundColor, onClick, dataTestId } = props;
+  const { iconType, text, disabled = false, onClick, dataTestId } = props;
 
   return (
-    <PanelButton
-      disabled={disabled}
-      noBackgroundColor={noBackgroundColor}
-      onClick={onClick}
-      dataTestId={dataTestId}
-    >
+    <PanelButton disabled={disabled} onClick={onClick} dataTestId={dataTestId}>
       <StyledContent disabled={disabled}>
         <SessionIcon iconType={iconType} iconSize="medium" />
         <StyledText>{text}</StyledText>

ts/components/buttons/PanelRadioButton.tsx

@@ -53,14 +53,12 @@ export const PanelRadioButton = (props: PanelRadioButtonProps) => {
     onSelect,
     onUnselect,
     disabled = false,
-    noBackgroundColor,
     dataTestId,
   } = props;
 
   return (
     <StyledPanelButton
       disabled={disabled}
-      noBackgroundColor={noBackgroundColor}
       onClick={() => {
         return isSelected ? onUnselect?.('bye') : onSelect?.('hi');
       }}

ts/components/conversation/right-panel/overlay/OverlayRightPanelSettings.tsx

@@ -5,8 +5,8 @@ import React, { useEffect, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import useInterval from 'react-use/lib/useInterval';
 import styled from 'styled-components';
-import { SessionIconButton } from '../../../icon';
 import { Data } from '../../../../data/data';
+import { SessionIconButton } from '../../../icon';
 
 import {
   deleteAllMessagesByConvoIdWithConfirmation,
@@ -357,7 +357,6 @@ export const OverlayRightPanelSettings = () => {
           <PanelIconButton
             iconType={'timer50'}
             text={window.i18n('disappearingMessages')}
-            noBackgroundColor={true}
             onClick={() => {
               dispatch(setRightOverlayMode('disappearing-messages'));
             }}

ts/components/conversation/right-panel/overlay/disappearing-messages/DisappearingModes.tsx

@@ -66,7 +66,6 @@ export const DisappearingModes = (props: DisappearingModesProps) => {
                 setSelected(mode as DisappearingMessageConversationModeType);
               }}
               disabled={options[mode as DisappearingMessageConversationModeType]}
-              noBackgroundColor={true}
               dataTestId={loadDataTestId(mode as DisappearingMessageConversationModeType)}
             />
           );

ts/components/conversation/right-panel/overlay/disappearing-messages/TimeOptions.tsx

@@ -33,7 +33,6 @@ export const TimeOptions = (props: TimerOptionsProps) => {
               onSelect={() => {
                 setSelected(option.value);
               }}
-              noBackgroundColor={true}
               disabled={disabled}
               dataTestId={`disappear-time-${option.value}-option`}
             />