Using: React Native - Styled Components - Linear Gradient

Hi so normally this is what I do for gradient backgrounds:

import Gradient from 'react-native-linear-gradient';

export const GradientBGNormal = styled(Gradient).attrs({
    colors: ['#583EF4', '#2ACEC2'],
    start: { x: 0, y: -0.5 },
    end: { x: 0, y: 1 },
    locations: [0.1, 1],
    angle: 183.27,
})`
   
    width: 40px,
    height: 40px;

`;

How do I do it here with a condition?

import Gradient from 'react-native-linear-gradient';

export const GradientBGCondition = styled.TouchableOpacity<{ condition: boolean }>`
    width: 40px;
    height: 40px
    background-color: white;


    ${({ condition }) =>
        condition &&
        css`
               width: 20px;
               height: 20px;
               background-color: blue;
               /* how to put gradient on background-color here? */
        `}
`;