admin/imexmobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improved uploads & handling for temp jobs. IO-399 IO-398 IO-69

Browse Source
This commit is contained in:
Patrick Fic
2021-02-11 15:38:59 -08:00
parent 519e7a347a
commit 3231097b29
13 changed files with 441 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files

146
components/screen-media-browser/screen-media-browser.component.jsx
View File

@@ -1,11 +1,12 @@
import { Ionicons } from "@expo/vector-icons";
import { useNavigation } from "@react-navigation/native";
import { AssetsSelector } from "expo-images-picker";
import * as MediaLibrary from "expo-media-library";
import _ from "lodash";
import { H3 } from "native-base";
import React, { useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
import { StyleSheet, Text, View } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import {
@@ -36,7 +37,6 @@ export function ImageBrowserScreen({
deleteAfterUpload,
}) {
const { t } = useTranslation();
const navigation = useNavigation();
const [uploads, setUploads] = useState({});
function handleOnProgress(uri, percent) {
setUploads((prevUploads) => ({ ...prevUploads, [uri]: { percent } }));
@@ -72,7 +72,7 @@ export function ImageBrowserScreen({
},
{
bodyshop: bodyshop,
jobId: selectedCameraJobId,
jobId: selectedCameraJobId !== "temp" ? selectedCameraJobId : null,
uploaded_by: currentUser.email,
photo: p,
}
@@ -85,63 +85,93 @@ export function ImageBrowserScreen({
};
return (
<View style={[styles.flex, styles.container]}>
<CameraSelectJob />
<UploadDeleteSwitch />
{selectedCameraJobId && (
<AssetsSelector
style={{ flex: 1 }}
key={tick}
options={{
// manipulate: {
// //width: 512,
// compress: 0.7,
// base64: false,
// saveTo: "jpeg",
// },
assetsType: ["photo", "video"],
//maxSelections: 5,
margin: 3,
portraitCols: 4,
landscapeCols: 5,
widgetWidth: 100,
widgetBgColor: "white",
selectedBgColor: "#adadad",
spinnerColor: "#c8c8c8",
videoIcon: {
Component: Ionicons,
iconName: "ios-videocam",
color: "white",
size: 20,
},
selectedIcon: {
Component: Ionicons,
iconName: "ios-checkmark-circle-outline",
color: "white",
bg: "rgba(35,35,35, 0.75)",
size: 32,
},
defaultTopNavigator: {
continueText: t("mediabrowser.actions.upload"),
goBackText: t("mediabrowser.actions.refresh"),
buttonStyle: styles.buttonStyle,
textStyle: styles.textStyle,
<SafeAreaView style={[styles.flex, styles.container]}>
<View style={[styles.flex, styles.container]}>
<CameraSelectJob />
<UploadDeleteSwitch />
{!selectedCameraJobId && (
<View
style={{
flex: 1,
justifyContent: "center",
alignItems: "center",
}}
>
<H3>{t("mediabrowser.labels.selectjobassetselector")}</H3>
</View>
)}
{selectedCameraJobId && (
<AssetsSelector
style={{ flex: 1 }}
key={tick}
options={{
// manipulate: {
// //width: 512,
// compress: 0.7,
// base64: false,
// saveTo: "jpeg",
// },
assetsType: ["photo", "video"],
//maxSelections: 5,
margin: 3,
portraitCols: 4,
landscapeCols: 5,
widgetWidth: 100,
widgetBgColor: "white",
selectedBgColor: "#adadad",
spinnerColor: "#c8c8c8",
videoIcon: {
Component: Ionicons,
iconName: "ios-videocam",
color: "white",
size: 20,
},
selectedIcon: {
Component: Ionicons,
iconName: "ios-checkmark-circle-outline",
color: "white",
bg: "rgba(35,35,35, 0.75)",
size: 32,
},
defaultTopNavigator: {
continueText: t("mediabrowser.actions.upload"),
goBackText: t("mediabrowser.actions.refresh"),
buttonStyle: styles.buttonStyle,
textStyle: styles.textStyle,
backFunction: () => {
forceRerender();
},
doneFunction: onDone,
},
backFunction: () => {
forceRerender();
noAssets: {
Component: function NoAsset() {
return (
<View
style={{
display: "flex",
flex: 1,
height: 200,
marginHorizontal: 20,
alignItems: "center",
justifyContent: "center",
}}
>
<Ionicons name="ios-photos" size={72} />
<Text style={{ textAlign: "center", marginTop: 10 }}>
{t("mediabrowser.labels.nomedia")}
</Text>
</View>
);
},
},
doneFunction: onDone,
},
noAssets: {
Component: function NoAsset() {
return <Text>{`Looks like there's nothing here...`}</Text>;
},
},
}}
/>
)}
<UploadProgress uploads={uploads} />
</View>
}}
/>
)}
<UploadProgress uploads={uploads} />
</View>
</SafeAreaView>
);
}