import React from 'react';
import {StyleSheet, ViewProps} from 'react-native';
import {Image, Text, View} from 'react-native-animatable';
import {getUniversityClass} from '../../utils';

export interface UniversityIconProps extends ViewProps {
  university: string;
  university_class: number;
}

/**
 * Component to display university icon and class
 */
const UniversityIcon: React.FC<UniversityIconProps> = ({
  style,
  university,
  university_class,
}) => {
  var universityIcon;
  switch (university) {
    case 'brown':
      universityIcon = require('../../assets/universities/brown.png');
      break;
    default:
      universityIcon = require('../../assets/universities/brown.png');
      break;
  }

  return (
    <View style={[styles.container, style]}>
      <Image source={universityIcon} style={styles.icon} />
      <Text style={styles.univClass}>
        {getUniversityClass(university_class)}
      </Text>
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'column',
    flexWrap: 'wrap',
    justifyContent: 'center',
  },
  univClass: {
    fontSize: 13,
    fontWeight: '500',
  },
  icon: {
    alignSelf: 'center',
    width: 17,
    height: 19,
  },
});

export default UniversityIcon;
