import { View, Text, StyleSheet } from 'react-native';

interface EnvironmentCardProps {
  name: string;
  publicUrl: string;
  status: number;
  url: string;
}

export default function EnvironmentCard({ name, publicUrl, status, url }: EnvironmentCardProps) {
  return (
    <View style={styles.card}>
      <Text style={styles.title}>{name}</Text>
      {publicUrl && <Text>Public URL: {publicUrl}</Text>}
      {status === 1 && <Text>Status: Running</Text>}
      {status === 2 && <Text>Status: Stopped</Text>}
      {status === 3 && <Text>Status: Pending</Text>}
      <Text>URL: {url}</Text>
    </View>
  );
}

const styles = StyleSheet.create({
  card: {
    backgroundColor: 'white',
    borderRadius: 8,
    padding: 16,
    marginBottom: 16,
    shadowColor: '#000',
    shadowOffset: {
      width: 0,
      height: 2,
    },
    shadowOpacity: 0.25,
    shadowRadius: 3.84,
    elevation: 5,
  },
  title: {
    fontSize: 18,
    fontWeight: 'bold',
    marginBottom: 8,
  },
});