Files
imexmobile/components/job-notes-item/job-notes-item.component.jsx
2020-08-17 15:54:15 -07:00

65 lines
1.9 KiB
JavaScript

import { Ionicons } from "@expo/vector-icons";
import { useNavigation } from "@react-navigation/native";
import { Card, CardItem, Text, View, Row } from "native-base";
import React from "react";
import { useTranslation } from "react-i18next";
import { TouchableOpacity } from "react-native-gesture-handler";
import Swipeable from "react-native-gesture-handler/Swipeable";
import styles from "../styles";
import { AntDesign } from "@expo/vector-icons";
export default function NoteListItem({ item }) {
const { t } = useTranslation();
return (
<Swipeable renderRightActions={() => <RenderRightAction />}>
<Card>
<CardItem bordered>
<View style={{ display: "flex", flex: 1 }}>
<Text>{item.text}</Text>
<View
style={{
flexDirection: "row",
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_at}</Text>
</View>
</View>
</CardItem>
</Card>
</Swipeable>
);
}
const RenderRightAction = (props) => {
const navigation = useNavigation();
const { t } = useTranslation();
return (
<TouchableOpacity
style={[styles.swipe_view, styles.swipe_view_blue]}
onPress={() => navigation.push("JobCamera")}
>
<Ionicons name="ios-camera" size={24} color="white" />
<Text style={styles.swipe_text}>{t("joblist.actions.swipecamera")}</Text>
</TouchableOpacity>
);
};