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

Merge branch 'release/1.6.0' into rome/1.6.0

Browse Source
This commit is contained in:
Patrick Fic
2024-08-15 15:19:34 -07:00
parent b3a0f077e9 519efb7119
commit 984ba5e069
25 changed files with 18188 additions and 10473 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/camera-select-job/camera-select-job.component.jsx
View File

@@ -109,7 +109,7 @@ export function CameraSelectJob({
}}
>
<Button onPress={() => hideModal()}>
<Ionicons name="ios-arrow-back" size={32} color="dodgerblue" />
<Ionicons name="arrow-back" size={32} color="dodgerblue" />
</Button>
<Searchbar
style={{ flex: 1 }}
@@ -135,7 +135,7 @@ export function CameraSelectJob({
if (object.item.id !== cameraJobId) return null;
return (
<Ionicons
name="ios-checkmark-circle"
name="checkmark-circle"
size={24}
color="dodgerblue"
style={{ alignSelf: "center" }}

2
components/job-documents/job-documents-local.component.jsx
View File

@@ -8,7 +8,7 @@ import {
View,
} from "react-native";
import MediaCacheOverlay from "../media-cache-overlay/media-cache-overlay.component";
import * as Sentry from "sentry-expo";
import * as Sentry from '@sentry/react-native';
import Toast from "react-native-toast-message";
import cleanAxios from "../../util/CleanAxios";

2
components/job-list-item/job-list-item.component.jsx
View File

@@ -79,7 +79,7 @@ export function JobListItem({ setCameraJob, setCameraJobId, item }) {
>
<Ionicons
style={[style, { alignSelf: "center" }]}
name="ios-add"
name="add"
size={32}
color="dodgerblue"
/>

85
components/local-upload-progress/local-upload-progress.component.jsx
View File

@@ -1,5 +1,5 @@
import * as MediaLibrary from "expo-media-library";
import React, { useEffect, useState } from "react";
import * as MediaLibrary from 'expo-media-library';
import React, { useEffect, useState } from 'react';
import {
ActivityIndicator,
@@ -8,20 +8,20 @@ import {
StyleSheet,
Text,
View,
} from "react-native";
import { ProgressBar } from "react-native-paper";
import Toast from "react-native-toast-message";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { logImEXEvent } from "../../firebase/firebase.analytics";
} from 'react-native';
import { ProgressBar } from 'react-native-paper';
import Toast from 'react-native-toast-message';
import { connect } from 'react-redux';
import { createStructuredSelector } from 'reselect';
import { logImEXEvent } from '../../firebase/firebase.analytics';
import {
selectCurrentCameraJobId,
selectDeleteAfterUpload,
} from "../../redux/app/app.selectors";
import * as Sentry from "sentry-expo";
} from '../../redux/app/app.selectors';
import * as Sentry from '@sentry/react-native';
import { formatBytes } from "../../util/document-upload.utility";
import { handleLocalUpload } from "../../util/local-document-upload.utility";
import { formatBytes } from '../../util/document-upload.utility';
import { handleLocalUpload } from '../../util/local-document-upload.utility';
const mapStateToProps = createStructuredSelector({
selectedCameraJobId: selectCurrentCameraJobId,
@@ -54,7 +54,7 @@ export function UploadProgress({
async function handleOnSuccess({ duration, data }) {
//If it's not in production, show a toast with the time.
Toast.show({
type: "success",
type: 'success',
text1: ` Upload completed in ${duration}.`,
//
// text2: duration,
@@ -62,13 +62,28 @@ export function UploadProgress({
if (deleteAfterUpload) {
try {
await MediaLibrary.deleteAssetsAsync(data);
const album = await MediaLibrary.createAlbumAsync(
'ImEX Mobile Deleted',
data.pop(),
false
);
//Move the rest.
if (data.length > 0) {
const moveResult = await MediaLibrary.addAssetsToAlbumAsync(
data,
album,
false
);
}
const deleteResult = await MediaLibrary.deleteAlbumsAsync(album);
} catch (error) {
console.log("Unable to delete picture.", error);
console.log('Unable to delete picture.', error);
Sentry.Native.captureException(error);
}
}
logImEXEvent("imexmobile_successful_upload");
logImEXEvent('imexmobile_successful_upload');
forceRerender();
setProgress({ ...progress, speed: 0, percent: 1, uploadInProgress: false });
}
@@ -83,10 +98,10 @@ export function UploadProgress({
}
function handleOnError({ assetid, error }) {
logImEXEvent("imexmobile_upload_documents_error");
logImEXEvent('imexmobile_upload_documents_error');
Toast.show({
type: "error",
text1: "Unable to upload documents.",
type: 'error',
text1: 'Unable to upload documents.',
text2: error,
autoHide: false,
});
@@ -115,7 +130,7 @@ export function UploadProgress({
onSuccess: ({ duration }) => handleOnSuccess({ duration, data }),
context: {
jobid:
selectedCameraJobId !== "temp" ? selectedCameraJobId : "temporary",
selectedCameraJobId !== 'temp' ? selectedCameraJobId : 'temporary',
},
});
};
@@ -123,41 +138,41 @@ export function UploadProgress({
return (
<Modal
visible={progress.uploadInProgress}
animationType="slide"
animationType='slide'
transparent={true}
onRequestClose={() => {
Alert.alert("Cancel?", "Do you want to abort the upload?", [
Alert.alert('Cancel?', 'Do you want to abort the upload?', [
{
text: "Yes",
text: 'Yes',
onPress: () => {
setUploads(null);
setProgress(null);
},
},
{ text: "No" },
{ text: 'No' },
]);
}}
>
<View style={styles.modalContainer}>
<View style={styles.modal}>
<ActivityIndicator style={{ alignSelf: "center", marginTop: 16 }} />
<ActivityIndicator style={{ alignSelf: 'center', marginTop: 16 }} />
<ProgressBar
progress={progress.percent}
style={{ alignSelf: "center", marginTop: 16 }}
color={progress.percent === 1 ? "green" : "blue"}
style={{ alignSelf: 'center', marginTop: 16 }}
color={progress.percent === 1 ? 'green' : 'blue'}
/>
<Text style={{ alignSelf: "center", marginTop: 16 }}>{`${formatBytes(
<Text style={{ alignSelf: 'center', marginTop: 16 }}>{`${formatBytes(
progress.speed
)}/sec`}</Text>
<Text
style={{ alignSelf: "center", marginTop: 16 }}
style={{ alignSelf: 'center', marginTop: 16 }}
>{`Avg. ${formatBytes(
progress.loaded / ((new Date() - progress.start) / 1000)
)}/sec`}</Text>
<Text
style={{ alignSelf: "center", marginTop: 16 }}
style={{ alignSelf: 'center', marginTop: 16 }}
>{`Total Uploaded ${formatBytes(progress.loaded)}`}</Text>
<Text style={{ alignSelf: "center", marginTop: 16 }}>{`Duration ${(
<Text style={{ alignSelf: 'center', marginTop: 16 }}>{`Duration ${(
(new Date() - progress.start) /
1000
).toFixed(1)} sec`}</Text>
@@ -168,19 +183,19 @@ export function UploadProgress({
}
const styles = StyleSheet.create({
modalContainer: {
display: "flex",
display: 'flex',
flex: 1,
justifyContent: "center",
justifyContent: 'center',
},
modal: {
// flex: 1,
display: "flex",
display: 'flex',
marginLeft: 20,
marginRight: 20,
backgroundColor: "white",
backgroundColor: 'white',
borderRadius: 20,
padding: 18,
shadowColor: "#000",
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 2,

8
components/screen-main/screen-main.component.jsx
View File

@@ -92,7 +92,7 @@ const JobsTabNavigator = connect(
navigation.navigate("MediaBrowserTab");
}}
>
<Ionicons name="ios-add" size={32} color="dodgerblue" />
<Ionicons name="add" size={32} color="dodgerblue" />
</Button>
),
})}
@@ -191,11 +191,11 @@ const BottomTabsNavigator = () => (
tabBarIcon: ({ color, size }) => {
let iconName;
if (route.name === "JobTab") {
iconName = "ios-list";
iconName = "list";
} else if (route.name === "MoreTab") {
iconName = "ios-settings";
iconName = "settings";
} else if (route.name === "MediaBrowserTab") {
iconName = "ios-camera";
iconName = "camera";
} else if (route.name === "TimeTicketBrowserTab") {
iconName = "ios-stopwatch-outline";
} else {

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

@@ -1,26 +1,40 @@
import { Ionicons } from "@expo/vector-icons";
import { AssetsSelector } from "expo-images-picker";
import React, { useCallback, useMemo, useState } from "react";
import { useTranslation } from "react-i18next";
import { StyleSheet, Text, View } from "react-native";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { logImEXEvent } from "../../firebase/firebase.analytics";
import { selectCurrentCameraJobId } from "../../redux/app/app.selectors";
import CameraSelectJob from "../camera-select-job/camera-select-job.component";
import JobSpaceAvailable from "../job-space-available/job-space-available.component";
import UploadDeleteSwitch from "../upload-delete-switch/upload-delete-switch.component";
import UploadProgress from "../upload-progress/upload-progress.component";
import { MediaType } from "expo-media-library";
import { selectBodyshop } from "../../redux/user/user.selectors";
import LocalUploadProgress from "../local-upload-progress/local-upload-progress.component";
import { Ionicons } from '@expo/vector-icons';
import { AssetsSelector } from 'expo-images-picker';
import { MediaType } from 'expo-media-library';
import React, { useCallback, useMemo, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { StyleSheet, Text, View } from 'react-native';
import { connect } from 'react-redux';
import { createStructuredSelector } from 'reselect';
import { logImEXEvent } from '../../firebase/firebase.analytics';
import { toggleDeleteAfterUpload } from '../../redux/app/app.actions';
import {
selectCurrentCameraJobId,
selectDeleteAfterUpload,
} from '../../redux/app/app.selectors';
import { selectBodyshop } from '../../redux/user/user.selectors';
import CameraSelectJob from '../camera-select-job/camera-select-job.component';
import JobSpaceAvailable from '../job-space-available/job-space-available.component';
import LocalUploadProgress from '../local-upload-progress/local-upload-progress.component';
import UploadDeleteSwitch from '../upload-delete-switch/upload-delete-switch.component';
import UploadProgress from '../upload-progress/upload-progress.component';
const mapStateToProps = createStructuredSelector({
selectedCameraJobId: selectCurrentCameraJobId,
bodyshop: selectBodyshop,
deleteAfterUpload: selectDeleteAfterUpload,
});
export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
const mapDispatchToProps = (dispatch) => ({
toggleDeleteAfterUpload: () => dispatch(toggleDeleteAfterUpload()),
});
export function ImageBrowserScreen({
bodyshop,
selectedCameraJobId,
//toggleDeleteAfterUpload,
// deleteAfterUpload,
}) {
const { t } = useTranslation();
const [uploads, setUploads] = useState(null);
const [tick, setTick] = useState(0);
@@ -29,18 +43,18 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
}, []);
const onDone = (data) => {
logImEXEvent("imexmobile_upload_documents", { count: data.length });
logImEXEvent('imexmobile_upload_documents', { count: data.length });
if (data.length !== 0) setUploads(data);
};
const widgetErrors = useMemo(
() => ({
errorTextColor: "black",
errorTextColor: 'black',
errorMessages: {
hasErrorWithPermissions: "Please Allow media gallery permissions.",
hasErrorWithLoading: "There was an error while loading images.",
hasErrorWithResizing: "There was an error while loading images.",
hasNoAssets: "No images found.",
hasErrorWithPermissions: 'Please Allow media gallery permissions.',
hasErrorWithLoading: 'There was an error while loading images.',
hasErrorWithResizing: 'There was an error while loading images.',
hasNoAssets: 'No images found.',
},
}),
[]
@@ -64,28 +78,28 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
width: 50,
compress: 0.7,
base64: false,
saveTo: "jpeg",
saveTo: 'jpeg',
}),
[]
);
const _textStyle = {
color: "white",
color: 'white',
};
const _buttonStyle = {
backgroundColor: "orange",
backgroundColor: 'orange',
borderRadius: 5,
};
const widgetNavigator = useMemo(
() => ({
Texts: {
finish: t("mediabrowser.actions.upload"),
back: t("mediabrowser.actions.refresh"),
selected: "selected",
finish: t('mediabrowser.actions.upload'),
back: t('mediabrowser.actions.refresh'),
selected: 'selected',
},
midTextColor: "black",
midTextColor: 'black',
minSelection: 1,
buttonTextStyle: styles.textStyle,
buttonStyle: styles.buttonStyle,
@@ -100,20 +114,20 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
const widgetStyles = useMemo(
() => ({
margin: 2,
bgColor: "white",
spinnerColor: "blue",
bgColor: 'white',
spinnerColor: 'blue',
widgetWidth: 99,
videoIcon: {
Component: Ionicons,
iconName: "ios-videocam",
color: "white",
iconName: 'videocam',
color: 'white',
size: 20,
},
selectedIcon: {
Component: Ionicons,
iconName: "ios-checkmark-circle-outline",
color: "white",
bg: "rgba(35,35,35, 0.75)",
iconName: 'checkmark-circle-outline',
color: 'white',
bg: 'rgba(35,35,35, 0.75)',
size: 32,
},
}),
@@ -125,7 +139,7 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
<CameraSelectJob />
{bodyshop.uselocalmediaserver ? (
<Text style={{ margin: 10 }}>
{t("mediabrowser.labels.localserver", {
{t('mediabrowser.labels.localserver', {
url: bodyshop.localmediaserverhttp,
})}
</Text>
@@ -133,15 +147,25 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
<JobSpaceAvailable jobid={selectedCameraJobId} key={`${tick}-space`} />
)}
<UploadDeleteSwitch />
{
// <Button
// onPress={() => {
// //Mutate the state
// toggleDeleteAfterUpload();
// }}
// >
// <Text>{`From screen. ${deleteAfterUpload}`}</Text>
// </Button>
}
{!selectedCameraJobId && (
<View
style={{
flex: 1,
justifyContent: "center",
alignItems: "center",
justifyContent: 'center',
alignItems: 'center',
}}
>
<Text>{t("mediabrowser.labels.selectjobassetselector")}</Text>
<Text>{t('mediabrowser.labels.selectjobassetselector')}</Text>
</View>
)}
{selectedCameraJobId && (
@@ -176,7 +200,7 @@ const styles = StyleSheet.create({
flex: 1,
},
container: {
display: "flex",
display: 'flex',
// position: "relative",
},
buttonStyle: {
@@ -184,11 +208,11 @@ const styles = StyleSheet.create({
},
// eslint-disable-next-line react-native/no-color-literals
textStyle: {
color: "dodgerblue",
color: 'dodgerblue',
},
});
export default connect(mapStateToProps, null)(ImageBrowserScreen);
export default connect(mapStateToProps, mapDispatchToProps)(ImageBrowserScreen);
// options={{
// assetsType: ["photo", "video"],

2
components/screen-settings/screen-settings.component.jsx
View File

@@ -25,7 +25,7 @@ export default function ScreenSettingsComponent() {
})}
</Title>
<Text>Release Channel {Updates.releaseChannel}</Text>
<Text>Release Channel {Updates.channel}</Text>
<SignOutButton />
{/* <Button title="Purge State" onPress={() => purgeStoredState()} /> */}
</View>

2
components/screen-sign-in/screen-sign-in.component.jsx
View File

@@ -90,7 +90,7 @@ export function SignIn({ emailSignInStart, signingIn }) {
</View>
<Text style={{ padding: 10, alignSelf: "center" }}>
{t("settings.labels.version", {
number: Constants.manifest.version,
number: Constants.expoConfig.version,
})}
</Text>
</View>

38
components/upload-delete-switch/upload-delete-switch.component.jsx
View File

@@ -1,11 +1,11 @@
import React from "react";
import { useTranslation } from "react-i18next";
import { StyleSheet, Switch, Text, View } from "react-native";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import { logImEXEvent } from "../../firebase/firebase.analytics";
import { toggleDeleteAfterUpload } from "../../redux/app/app.actions";
import { selectDeleteAfterUpload } from "../../redux/app/app.selectors";
import React from 'react';
import { useTranslation } from 'react-i18next';
import { StyleSheet, Text, View } from 'react-native';
import { Checkbox } from 'react-native-paper';
import { connect } from 'react-redux';
import { createStructuredSelector } from 'reselect';
import { toggleDeleteAfterUpload } from '../../redux/app/app.actions';
import { selectDeleteAfterUpload } from '../../redux/app/app.selectors';
const mapStateToProps = createStructuredSelector({
deleteAfterUpload: selectDeleteAfterUpload,
@@ -21,29 +21,29 @@ export function UploadDeleteSwitch({
}) {
const { t } = useTranslation();
console.log('🚀 ~ deleteAfterUpload:', deleteAfterUpload);
return (
<View style={styles.container}>
<Text style={styles.text}>
{t("mediabrowser.labels.deleteafterupload")}
{t('mediabrowser.labels.deleteafterupload')}
</Text>
<Switch
trackColor={{ false: "#767577", true: "#81b0ff" }}
thumbColor={deleteAfterUpload ? "tomato" : "#f4f3f4"}
ios_backgroundColor="#3e3e3e"
onValueChange={() => {
logImEXEvent("imexmobile_toggle_delete_after_upload");
<Checkbox
// trackColor={{ false: '#767577', true: '#81b0ff' }}
// thumbColor={deleteAfterUpload ? 'tomato' : '#f4f3f4'}
// ios_backgroundColor='#3e3e3e'
onPress={() => {
toggleDeleteAfterUpload();
}}
value={deleteAfterUpload}
status={deleteAfterUpload ? 'checked' : 'unchecked'}
/>
</View>
);
}
const styles = StyleSheet.create({
container: {
display: "flex",
flexDirection: "row",
alignItems: "center",
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
margin: 10,
},

143
components/upload-progress/upload-progress.component.jsx
View File

@@ -1,8 +1,8 @@
import { useApolloClient } from "@apollo/client";
import * as FileSystem from "expo-file-system";
import * as MediaLibrary from "expo-media-library";
import React, { useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { useApolloClient } from '@apollo/client';
import * as FileSystem from 'expo-file-system';
import * as MediaLibrary from 'expo-media-library';
import React, { useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next';
import {
ActivityIndicator,
Alert,
@@ -11,23 +11,23 @@ import {
StyleSheet,
Text,
View,
} from "react-native";
import { Divider, ProgressBar } from "react-native-paper";
import Toast from "react-native-toast-message";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import * as Sentry from "sentry-expo";
import { logImEXEvent } from "../../firebase/firebase.analytics";
import { GET_DOC_SIZE_TOTALS } from "../../graphql/documents.queries";
} from 'react-native';
import { Divider, ProgressBar } from 'react-native-paper';
import Toast from 'react-native-toast-message';
import { connect } from 'react-redux';
import { createStructuredSelector } from 'reselect';
import * as Sentry from '@sentry/react-native';
import { logImEXEvent } from '../../firebase/firebase.analytics';
import { GET_DOC_SIZE_TOTALS } from '../../graphql/documents.queries';
import {
selectCurrentCameraJobId,
selectDeleteAfterUpload,
} from "../../redux/app/app.selectors";
} from '../../redux/app/app.selectors';
import {
selectBodyshop,
selectCurrentUser,
} from "../../redux/user/user.selectors";
import { formatBytes, handleUpload } from "../../util/document-upload.utility";
} from '../../redux/user/user.selectors';
import { formatBytes, handleUpload } from '../../util/document-upload.utility';
const mapStateToProps = createStructuredSelector({
currentUser: selectCurrentUser,
@@ -110,10 +110,10 @@ export function UploadProgress({
});
}
function handleOnError(error) {
logImEXEvent("imexmobile_upload_documents_error", { error });
logImEXEvent('imexmobile_upload_documents_error', { error });
Toast.show({
type: "error",
text1: "Unable to upload document.",
type: 'error',
text1: 'Unable to upload document.',
text2: error,
autoHide: false,
});
@@ -124,7 +124,7 @@ export function UploadProgress({
return {
...progress,
uploadInProgress: true,
statusText: "Preparing upload...",
statusText: 'Preparing upload...',
};
});
@@ -138,10 +138,10 @@ export function UploadProgress({
return (await acc) + info.size;
}, 0);
if (selectedCameraJobId !== "temp") {
if (selectedCameraJobId !== 'temp') {
const queryData = await client.query({
query: GET_DOC_SIZE_TOTALS,
fetchPolicy: "network-only",
fetchPolicy: 'network-only',
variables: {
jobId: selectedCameraJobId,
},
@@ -161,8 +161,8 @@ export function UploadProgress({
uploadInProgress: false,
}));
Alert.alert(
t("mediabrowser.labels.storageexceeded_title"),
t("mediabrowser.labels.storageexceeded")
t('mediabrowser.labels.storageexceeded_title'),
t('mediabrowser.labels.storageexceeded')
);
return;
}
@@ -203,56 +203,41 @@ export function UploadProgress({
//Everything is uploaded, delete the succesful ones.
if (deleteAfterUpload) {
try {
console.log("Trying to Delete", filesToDelete);
if (Platform.OS === "android") {
console.log('Trying to Delete', filesToDelete);
if (Platform.OS === 'android') {
//Create a new asset with the first file to delete.
console.log("Trying new delete.");
// console.log('Trying new delete.');
await MediaLibrary.getPermissionsAsync(false);
const delres = await MediaLibrary.removeAssetsFromAlbumAsync(
filesToDelete,
filesToDelete[0].albumId
const album = await MediaLibrary.createAlbumAsync(
'ImEX Mobile Deleted',
filesToDelete.pop(),
false
);
//Move the rest.
if (filesToDelete.length > 0) {
const moveResult = await MediaLibrary.addAssetsToAlbumAsync(
filesToDelete,
album,
false
);
}
const deleteResult = await MediaLibrary.deleteAlbumsAsync(album);
// const album = await MediaLibrary.createAlbumAsync(
// "Deleted",
// filesToDelete.pop(),
// false
// );
// console.log(
// "🚀 ~ file: upload-progress.component.jsx ~ line 215 ~ album",
// album
// );
// //Move the rest.
// const moveResult = await MediaLibrary.addAssetsToAlbumAsync(
// filesToDelete,
// album.id,
// false
// );
// console.log(
// "🚀 ~ file: upload-progress.component.jsx ~ line 221 ~ moveResult",
// moveResult
// );
// //Delete the album.
//Delete the album.
// const deleteResult = await MediaLibrary.deleteAlbumsAsync(
// album.id,
// true
// );
// console.log(
// "🚀 ~ file: upload-progress.component.jsx ~ line 228 ~ deleteResult",
// deleteResult
// );
//This defaults to delete all assets in the album.
} else {
await MediaLibrary.deleteAssetsAsync(filesToDelete.map((f) => f.id));
}
} catch (error) {
console.log("Unable to delete picture.", error);
console.log('Unable to delete picture.', error);
Sentry.Native.captureException(error);
}
}
filesToDelete = [];
Toast.show({
type: "success",
type: 'success',
text1: ` Upload completed.`,
//
// text2: duration,
@@ -284,7 +269,7 @@ export function UploadProgress({
},
{
bodyshop: bodyshop,
jobId: selectedCameraJobId !== "temp" ? selectedCameraJobId : null,
jobId: selectedCameraJobId !== 'temp' ? selectedCameraJobId : null,
uploaded_by: currentUser.email,
photo: p,
}
@@ -294,12 +279,12 @@ export function UploadProgress({
return (
<Modal
visible={progress.uploadInProgress}
animationType="slide"
animationType='slide'
transparent={true}
onRequestClose={() => {
Alert.alert("Cancel?", "Do you want to abort the upload?", [
Alert.alert('Cancel?', 'Do you want to abort the upload?', [
{
text: "Yes",
text: 'Yes',
onPress: () => {
setUploads(null);
setProgress({
@@ -314,7 +299,7 @@ export function UploadProgress({
});
},
},
{ text: "No" },
{ text: 'No' },
]);
}}
>
@@ -329,13 +314,13 @@ export function UploadProgress({
<ProgressBar
progress={progress.files[key].percent}
style={styles.progress}
color={progress.files[key].percent === 1 ? "green" : "blue"}
color={progress.files[key].percent === 1 ? 'green' : 'blue'}
/>
<View
style={{
display: "flex",
flexDirection: "row",
alignItems: "center",
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
}}
>
<Text>{`${formatBytes(
@@ -377,19 +362,19 @@ export function UploadProgress({
}
const styles = StyleSheet.create({
modalContainer: {
display: "flex",
display: 'flex',
flex: 1,
justifyContent: "center",
justifyContent: 'center',
},
modal: {
//flex: 1,
display: "flex",
display: 'flex',
marginLeft: 20,
marginRight: 20,
backgroundColor: "white",
backgroundColor: 'white',
borderRadius: 20,
padding: 18,
shadowColor: "#000",
shadowColor: '#000',
shadowOffset: {
width: 0,
height: 2,
@@ -399,14 +384,14 @@ const styles = StyleSheet.create({
elevation: 5,
},
centeredView: {
justifyContent: "center",
alignItems: "center",
justifyContent: 'center',
alignItems: 'center',
marginTop: 22,
},
progressItem: {
display: "flex",
flexDirection: "row",
alignItems: "center",
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
marginBottom: 12,
marginLeft: 12,
marginRight: 12,