import React from 'react';
import { LinearGradient } from 'expo-linear-gradient';
import { SBox } from '../s-components/layout/s-box';
import { theme } from '../../app/theme';

type TProps = {
  pictureSize: number;
};

export const NoPicGradient: React.FC<TProps> = props => {
  const { pictureSize } = props;

  return (
    <SBox
      position="relative"
      bg="transparent"
      height={pictureSize}
      width={pictureSize}
    >
      <LinearGradient
        colors={theme.gradients.pictureHolderDark}
        style={{
          position: 'absolute',
          top: 0,
          left: 0,
          right: 0,
          height: '100%',
        }}
      />
    </SBox>
  );
};