Add photos saga work.
This commit is contained in:
@@ -4,15 +4,16 @@ import { Button, List, Text, useTheme } from "react-native-paper";
|
|||||||
import { connect } from "react-redux";
|
import { connect } from "react-redux";
|
||||||
import { createStructuredSelector } from "reselect";
|
import { createStructuredSelector } from "reselect";
|
||||||
import { logImEXEvent } from "../../firebase/firebase.analytics";
|
import { logImEXEvent } from "../../firebase/firebase.analytics";
|
||||||
import { setCameraJob, setCameraJobId } from "../../redux/app/app.actions";
|
import { setCameraJobId } from "../../redux/app/app.actions";
|
||||||
|
import { openImagePicker } from "../../redux/photos/photos.actions";
|
||||||
|
|
||||||
const mapStateToProps = createStructuredSelector({});
|
const mapStateToProps = createStructuredSelector({});
|
||||||
const mapDispatchToProps = (dispatch) => ({
|
const mapDispatchToProps = (dispatch) => ({
|
||||||
setCameraJobId: (id) => dispatch(setCameraJobId(id)),
|
setCameraJobId: (id) => dispatch(setCameraJobId(id)),
|
||||||
setCameraJob: (job) => dispatch(setCameraJob(job)),
|
openImagePicker: (id) => dispatch(openImagePicker(id)),
|
||||||
});
|
});
|
||||||
|
|
||||||
export function JobListItem({ setCameraJob, setCameraJobId, item }) {
|
export function JobListItem({ openImagePicker, item }) {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const theme = useTheme();
|
const theme = useTheme();
|
||||||
@@ -26,11 +27,13 @@ export function JobListItem({ setCameraJob, setCameraJobId, item }) {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleUpload = () => {};
|
const handleUpload = () => {
|
||||||
|
openImagePicker(item.id);
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<List.Item
|
<List.Item
|
||||||
onPress={onPress}
|
onPress={onPress}
|
||||||
title={`${item.ownr_fn || ""} ${item.ownr_ln || ""} ${
|
title={`${item.ownr_fn || ""} ${item.ownr_ln || ""} ${
|
||||||
item.ownr_co_nm || ""
|
item.ownr_co_nm || ""
|
||||||
}`}
|
}`}
|
||||||
|
|||||||
@@ -1,33 +1,11 @@
|
|||||||
import PhotosActionTypes from "./photos.types";
|
import PhotosActionTypes from "./photos.types";
|
||||||
|
|
||||||
export const addPhoto = (photo) => ({
|
export const openImagePicker = (jobid) => ({
|
||||||
type: PhotosActionTypes.ADD_PHOTO,
|
type: PhotosActionTypes.OPEN_IMAGE_PICKER,
|
||||||
payload: photo,
|
payload: jobid
|
||||||
});
|
});
|
||||||
|
|
||||||
export const removePhotos = (photoIds) => ({
|
export const mediaUploadStart = (imagePickerResult) => ({
|
||||||
type: PhotosActionTypes.REMOVE_PHOTOS,
|
type: PhotosActionTypes.MEDIA_UPLOAD_START,
|
||||||
payload: photoIds,
|
payload: imagePickerResult,
|
||||||
});
|
})
|
||||||
|
|
||||||
export const removeAllPhotos = () => ({
|
|
||||||
type: PhotosActionTypes.REMOVE_ALL_PHOTOS,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const uploadAllPhotos = () => ({
|
|
||||||
type: PhotosActionTypes.UPLOAD_ALL_PHOTOS_START,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const uploadSelectedPhotos = (photoIds) => ({
|
|
||||||
type: PhotosActionTypes.UPLOAD_SELECTED_PHOTOS_START,
|
|
||||||
payload: photoIds,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const uploadPhotosSuccess = () => ({
|
|
||||||
type: PhotosActionTypes.UPLOAD_PHOTO_SUCCESS,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const uploadPhotosFailure = (error) => ({
|
|
||||||
type: PhotosActionTypes.UPLOAD_PHOTO_FAILURE,
|
|
||||||
payload: error,
|
|
||||||
});
|
|
||||||
@@ -8,40 +8,14 @@ const INITIAL_STATE = {
|
|||||||
|
|
||||||
const photosReducer = (state = INITIAL_STATE, action) => {
|
const photosReducer = (state = INITIAL_STATE, action) => {
|
||||||
switch (action.type) {
|
switch (action.type) {
|
||||||
case PhotosActionTypes.ADD_PHOTO:
|
case PhotosActionTypes.MEDIA_UPLOAD_START:
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
photos: [...state.photos, action.payload],
|
|
||||||
};
|
|
||||||
case PhotosActionTypes.REMOVE_ALL_PHOTOS:
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
uploadInProgress: false,
|
|
||||||
photos: [],
|
|
||||||
};
|
|
||||||
case PhotosActionTypes.REMOVE_PHOTOS:
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
photos: state.photos.filter((p) => !action.payload.includes(p.id)),
|
|
||||||
};
|
|
||||||
case PhotosActionTypes.UPLOAD_PHOTO_FAILURE:
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
uploadInProgress: false,
|
|
||||||
uploadError: action.payload,
|
|
||||||
};
|
|
||||||
case PhotosActionTypes.UPLOAD_PHOTO_SUCCESS:
|
|
||||||
return {
|
|
||||||
...state,
|
|
||||||
uploadInProgress: false,
|
|
||||||
};
|
|
||||||
case PhotosActionTypes.UPLOAD_ALL_PHOTOS_START:
|
|
||||||
case PhotosActionTypes.UPLOAD_SELECTED_PHOTOS_START:
|
|
||||||
return {
|
return {
|
||||||
...state,
|
...state,
|
||||||
|
photos: action.payload,
|
||||||
uploadInProgress: true,
|
uploadInProgress: true,
|
||||||
uploadError: null,
|
uploadError: null,
|
||||||
};
|
};
|
||||||
|
|
||||||
default:
|
default:
|
||||||
return state;
|
return state;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,106 +1,65 @@
|
|||||||
import * as FileSystem from "expo-file-system";
|
import Constants from "expo-constants";
|
||||||
|
import * as ImagePicker from "expo-image-picker";
|
||||||
import { all, call, put, select, takeLatest } from "redux-saga/effects";
|
import { all, call, put, select, takeLatest } from "redux-saga/effects";
|
||||||
import { handleUpload } from "../../util/document-upload.utility";
|
import { selectBodyshop } from "../user/user.selectors";
|
||||||
import {
|
import { mediaUploadStart } from "./photos.actions";
|
||||||
uploadPhotosFailure,
|
|
||||||
uploadPhotosSuccess,
|
|
||||||
removeAllPhotos,
|
|
||||||
} from "./photos.actions";
|
|
||||||
import PhotosActionTypes from "./photos.types";
|
import PhotosActionTypes from "./photos.types";
|
||||||
|
|
||||||
export function* onRemovePhotos() {
|
export function* onOpenImagePicker() {
|
||||||
yield takeLatest(PhotosActionTypes.REMOVE_PHOTOS, removePhotosAction);
|
yield takeLatest(PhotosActionTypes.OPEN_IMAGE_PICKER, openImagePickerAction);
|
||||||
}
|
}
|
||||||
export function* removePhotosAction({ payload: photoIdsToRemove }) {
|
export function* openImagePickerAction(jobid) {
|
||||||
try {
|
try {
|
||||||
const photos = yield select((state) => state.photos.photos);
|
if (Constants.platform.ios) {
|
||||||
const fps = photos
|
const cameraRollStatus =
|
||||||
.filter((p) => !photoIdsToRemove.includes(p.id))
|
yield ImagePicker.requestMediaLibraryPermissionsAsync();
|
||||||
.map((p) => p.uri);
|
const cameraStatus = yield ImagePicker.requestCameraPermissionsAsync();
|
||||||
|
if (
|
||||||
const all = [];
|
cameraRollStatus.status !== "granted" ||
|
||||||
fps.forEach((f) => all.push(FileSystem.deleteAsync(f)));
|
cameraStatus.status !== "granted"
|
||||||
|
) {
|
||||||
yield Promise.all(all);
|
alert("Sorry, we need these permissions to make this work!");
|
||||||
} catch (error) {
|
return;
|
||||||
console.log("Saga Error: removePhotos", error);
|
}
|
||||||
}
|
}
|
||||||
}
|
let result = yield ImagePicker.launchImageLibraryAsync({
|
||||||
|
mediaTypes: ["images", "videos"],
|
||||||
export function* onRemoveAllPhotos() {
|
aspect: [4, 3],
|
||||||
yield takeLatest(PhotosActionTypes.REMOVE_ALL_PHOTOS, removeAllPhotosAction);
|
quality: 1,
|
||||||
}
|
allowsMultipleSelection: true,
|
||||||
export function* removeAllPhotosAction() {
|
|
||||||
try {
|
|
||||||
//Physically delete all photosSagas.
|
|
||||||
const fps = (yield FileSystem.readDirectoryAsync(
|
|
||||||
FileSystem.documentDirectory + "photos"
|
|
||||||
)).map((f) => {
|
|
||||||
return FileSystem.documentDirectory + "photos/" + f;
|
|
||||||
});
|
});
|
||||||
const all = [];
|
if (!(result.canceled)) {
|
||||||
fps.forEach((f) => all.push(FileSystem.deleteAsync(f)));
|
yield put(mediaUploadStart(result.assets));
|
||||||
yield Promise.all(all);
|
}
|
||||||
|
|
||||||
console.log("All photos deleted.");
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log("Saga Error: onRemoveAllPhotos", error);
|
console.log("Saga Error: open Picker", error);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
export function* onMediaUploadStart() {
|
||||||
export function* onUploadAllPhotos() {
|
yield takeLatest(PhotosActionTypes.MEDIA_UPLOAD_START, mediaUploadStartAction);
|
||||||
yield takeLatest(
|
|
||||||
PhotosActionTypes.UPLOAD_ALL_PHOTOS_START,
|
|
||||||
uploadAllPhotosAction
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
export function* mediaUploadStartAction(photos) {
|
||||||
export function* uploadAllPhotosAction() {
|
|
||||||
try {
|
try {
|
||||||
const photos = yield select((state) => state.photos.photos);
|
console.log("Got to the Photo Saga.", photos);
|
||||||
const bodyshop = yield select((state) => state.user.bodyshop);
|
|
||||||
const user = yield select((state) => state.user);
|
console.log("upload", photos)
|
||||||
const actions = [];
|
|
||||||
photos.forEach(function (p) {
|
//get bodyshop state
|
||||||
actions.push(
|
const bodyshop = yield select(selectBodyshop);
|
||||||
call(
|
if (bodyshop.uselocalmediaserver) {
|
||||||
handleUpload,
|
//upload to LMS
|
||||||
...[
|
} else {
|
||||||
{
|
//Upload to img proxy
|
||||||
uri: p.uri,
|
}
|
||||||
onError: handleOnError,
|
|
||||||
onProgress: handleOnProgress,
|
|
||||||
onSuccess: handleOnSuccess,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
bodyshop: bodyshop,
|
|
||||||
jobId: p.jobId,
|
|
||||||
uploaded_by: user.currentUser.email,
|
|
||||||
photo: p,
|
|
||||||
},
|
|
||||||
]
|
|
||||||
)
|
|
||||||
);
|
|
||||||
});
|
|
||||||
yield all(actions);
|
|
||||||
yield put(removeAllPhotos());
|
|
||||||
yield put(uploadPhotosSuccess());
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.log("Saga Error: uploadAllPhotosAction", error);
|
console.log("Saga Error: open upload", error);
|
||||||
yield put(uploadPhotosFailure(error));
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleOnError(...props) {
|
|
||||||
console.log("HandleOnError", props);
|
|
||||||
}
|
|
||||||
function handleOnProgress(...props) {
|
|
||||||
console.log("HandleOnProgress", props);
|
|
||||||
}
|
|
||||||
function handleOnSuccess(...props) {
|
|
||||||
console.log("handleOnSuccess", props);
|
|
||||||
}
|
|
||||||
|
|
||||||
export function* photosSagas() {
|
export function* photosSagas() {
|
||||||
yield all([call(onRemoveAllPhotos), call(onUploadAllPhotos)]);
|
yield all([call(onOpenImagePicker), call(onMediaUploadStart)]);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,10 +1,8 @@
|
|||||||
const PhotosActionTypes = {
|
const PhotosActionTypes = {
|
||||||
ADD_PHOTO: "ADD_PHOTO",
|
OPEN_IMAGE_PICKER: "OPEN_IMAGE_PICKER",
|
||||||
REMOVE_PHOTOS: "REMOVE_PHOTOS",
|
MEDIA_UPLOAD_START: "MEDIA_UPLOAD_START",
|
||||||
REMOVE_ALL_PHOTOS: "REMOVE_ALL_PHOTOS",
|
MEDIUA_UPLOAD_SUCCESS: "MEDIA_UPLOAD_SUCCESS",
|
||||||
UPLOAD_SELECTED_PHOTOS_START: "UPLOAD_SELECTED_PHOTOS_START",
|
MEDIA_UPLOAD_FAILURE: "MEDIA_UPLOAD_FAILURE",
|
||||||
UPLOAD_ALL_PHOTOS_START: "UPLOAD_ALL_PHOTOS_START",
|
MEDIA_UPLOAD_PROGRESS_UPDATE: "MEDIA_UPLOAD_PROGRESS_UPDATE",
|
||||||
UPLOAD_PHOTO_SUCCESS: "UPLOAD_PHOTO_SUCCESS",
|
|
||||||
UPLOAD_PHOTO_FAILURE: "UPLOAD_PHOTO_FAILURE",
|
|
||||||
};
|
};
|
||||||
export default PhotosActionTypes;
|
export default PhotosActionTypes;
|
||||||
|
|||||||
Reference in New Issue
Block a user