import { DateTime } from "luxon";
import React from "react";
import { View } from "react-native";
import { Text } from "react-native-paper";

export default function DataLabelComponent({
  label,
  content,
  dateTime,
  noTextWrap,
  ...restProps
}) {
  let theContent = content;

  if (dateTime && content)
    theContent = DateTime.fromISO(content).toLocaleString(
      DateTime.DATETIME_SHORT
    );
  const { key, ...rest } = restProps;
  return (
    <View key={key} {...rest} style={{ margin: 4, ...restProps.style }}>
      <Text style={{ fontWeight: "bold" }}>{label}</Text>

      {noTextWrap ? content : <Text>{theContent}</Text>}
    </View>
  );
}
