import { AntDesign } from "@expo/vector-icons";
import { DateTime } from "luxon";
import { Card, CardItem, Text, View } from "native-base";
import React from "react";

export default function NoteListItem({ item }) {
  return (
    <Card>
      <CardItem bordered>
        <View style={{ display: "flex", flex: 1 }}>
          <Text>{item.text}</Text>
          <View
            style={{
              flexDirection: "column",
              alignSelf: "flex-end",
              alignItems: "center",
            }}
          >
            {item.private && (
              <AntDesign
                name="eyeo"
                style={{ margin: 4 }}
                size={24}
                color="black"
              />
            )}
            {item.critical && (
              <AntDesign
                name="warning"
                style={{ margin: 4 }}
                size={24}
                color="tomato"
              />
            )}
            <Text style={{ fontSize: 12 }}>{item.created_by}</Text>
            <Text style={{ fontSize: 12 }}>
              {DateTime.fromISO(item.created_at).toLocaleString(
                DateTime.DATETIME_SHORT
              )}
            </Text>
          </View>
        </View>
      </CardItem>
    </Card>
  );
}