From 2efac1ed2be9b7edd3e307179c2e66408242a524 Mon Sep 17 00:00:00 2001 From: Patrick Fic <> Date: Wed, 9 Dec 2020 20:45:45 -0800 Subject: [PATCH] Added loading of documents thumbnails --- babel-translations.babel | 21 +++++ .../job-documents/job-documents.component.jsx | 79 +++++++++++++++++++ .../job-notes-item.component.jsx | 8 +- components/job-notes/job-notes.component.jsx | 23 +++--- .../screen-job-detail.component.jsx | 8 +- graphql/jobs.queries.js | 16 ++-- translations/en-US/common.json | 1 + translations/es-MX/common.json | 1 + translations/fr-CA/common.json | 1 + 9 files changed, 134 insertions(+), 24 deletions(-) create mode 100644 components/job-documents/job-documents.component.jsx diff --git a/babel-translations.babel b/babel-translations.babel index f89a285..68fe363 100644 --- a/babel-translations.babel +++ b/babel-translations.babel @@ -199,6 +199,27 @@ + + nojobnotes + false + + + + + + en-US + false + + + es-MX + false + + + fr-CA + false + + + notes false diff --git a/components/job-documents/job-documents.component.jsx b/components/job-documents/job-documents.component.jsx new file mode 100644 index 0000000..7736626 --- /dev/null +++ b/components/job-documents/job-documents.component.jsx @@ -0,0 +1,79 @@ +import { Container, Content, Thumbnail } from "native-base"; +import React, { useState } from "react"; +import { useTranslation } from "react-i18next"; +import { + FlatList, + SafeAreaView, + StyleSheet, + Text, + TouchableOpacity, + View, +} from "react-native"; +import MediaCacheOverlay from "../media-cache-overlay/media-cache-overlay.component"; + +const REACT_APP_CLOUDINARY_IMAGE_ENDPOINT = + "https://res.cloudinary.com/bodyshop/image/upload"; +const REACT_APP_CLOUDINARY_THUMB_TRANSFORMATIONS = "c_fill,f_auto,h_250,w_250"; + +export default function JobDocumentsComponent({ job, loading, refetch }) { + const { t } = useTranslation(); + const [previewVisible, setPreviewVisible] = useState(false); + const [imgIndex, setImgIndex] = useState(0); + + return ( + + + item.id} + numColumns={4} + renderItem={(object) => ( + { + // setImgIndex(object.index); + // setPreviewVisible(true); + }} + > + + + )} + /> + {job.documents.length} + + + + ); +} + +const styles = StyleSheet.create({ + container: { + flex: 1, + }, + actions: { + display: "flex", + flexDirection: "row", + justifyContent: "space-evenly", + }, + listContentContainer: { + flex: 1, + }, + thumbnail: { + width: 10, + height: 10, + backgroundColor: "tomato", + }, +}); diff --git a/components/job-notes-item/job-notes-item.component.jsx b/components/job-notes-item/job-notes-item.component.jsx index baee667..1832820 100644 --- a/components/job-notes-item/job-notes-item.component.jsx +++ b/components/job-notes-item/job-notes-item.component.jsx @@ -7,7 +7,7 @@ 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"; - +import { DateTime } from "luxon"; export default function NoteListItem({ item }) { const { t } = useTranslation(); @@ -40,7 +40,11 @@ export default function NoteListItem({ item }) { color="tomato" /> )} - {item.created_at} + + {DateTime.fromISO(item.created_at).toLocaleString( + DateTime.DATETIME_SHORT + )} + diff --git a/components/job-notes/job-notes.component.jsx b/components/job-notes/job-notes.component.jsx index 9c696ff..ebc6689 100644 --- a/components/job-notes/job-notes.component.jsx +++ b/components/job-notes/job-notes.component.jsx @@ -1,18 +1,11 @@ -import Dinero from "dinero.js"; -import { - Card, - CardItem, - H3, - Text, - View, - Container, - Content, -} from "native-base"; +import { Card, CardItem, H3, Text } from "native-base"; import React from "react"; -import { StyleSheet, RefreshControl, FlatList } from "react-native"; +import { useTranslation } from "react-i18next"; +import { FlatList, RefreshControl } from "react-native"; import JobNotesItem from "../job-notes-item/job-notes-item.component"; export default function JobNotes({ job, loading, refetch }) { + const { t } = useTranslation(); if (!!!job) { Job is not defined. @@ -22,6 +15,14 @@ export default function JobNotes({ job, loading, refetch }) { const onRefresh = async () => { return refetch(); }; + if (job.notes.length === 0) + return ( + + +

{t("jobdetail.labels.nojobnotes")}

+ + + ); return ( - Tab1 + diff --git a/graphql/jobs.queries.js b/graphql/jobs.queries.js index eed3332..841c536 100644 --- a/graphql/jobs.queries.js +++ b/graphql/jobs.queries.js @@ -329,7 +329,6 @@ export const GET_JOB_BY_PK = gql` ownr_ph1 } labor_rate_desc - rate_la1 rate_la2 rate_la3 @@ -387,15 +386,6 @@ export const GET_JOB_BY_PK = gql` lbr_amt op_code_desc } - payments { - id - amount - payer - created_at - stripeid - transactionid - memo - } notes(order_by: { created_at: desc }) { id text @@ -404,6 +394,12 @@ export const GET_JOB_BY_PK = gql` created_at updated_at } + documents(order_by: { created_at: desc }) { + id + name + key + created_at + } } } `; diff --git a/translations/en-US/common.json b/translations/en-US/common.json index 02ec98f..cf80172 100644 --- a/translations/en-US/common.json +++ b/translations/en-US/common.json @@ -19,6 +19,7 @@ "documents": "Documents", "employeeassignments": "Employee Assignments", "job": "Job", + "nojobnotes": "There are no notes.", "notes": "Notes" } }, diff --git a/translations/es-MX/common.json b/translations/es-MX/common.json index 38a778f..b11ab9c 100644 --- a/translations/es-MX/common.json +++ b/translations/es-MX/common.json @@ -19,6 +19,7 @@ "documents": "", "employeeassignments": "", "job": "", + "nojobnotes": "", "notes": "" } }, diff --git a/translations/fr-CA/common.json b/translations/fr-CA/common.json index 2cdd6a4..b27499b 100644 --- a/translations/fr-CA/common.json +++ b/translations/fr-CA/common.json @@ -19,6 +19,7 @@ "documents": "", "employeeassignments": "", "job": "", + "nojobnotes": "", "notes": "" } },