import React from 'react';
import {View} from 'react-native';
import {CardContainer, Skeleton} from '@components';
import {useTheme} from '@shared/theme';

import {styles} from './styles';

export function PerformanceReviewFormSK() {
  const {theme, spacing} = useTheme();

  return (
    <Skeleton
      style={[
        styles.formContainer,
        {backgroundColor: theme.background.layout.default},
      ]}>
      <Skeleton.Item height={spacing.x6} />
      {Array.from(Array(5).keys()).map(item => (
        <CardContainer key={item}>
          <View style={styles.row}>
            <View style={styles.rightContent}>
              <Skeleton.Item height={spacing.x6} />
            </View>
          </View>
        </CardContainer>
      ))}
    </Skeleton>
  );
}