Add photos saga work.

This commit is contained in:
Patrick Fic
2025-10-08 16:20:23 -07:00
parent 83993be284
commit 620b5135d1
5 changed files with 70 additions and 158 deletions

View File

@@ -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 || ""
}`} }`}

View File

@@ -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,
});

View File

@@ -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;
} }

View File

@@ -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)]);
} }

View File

@@ -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;