apollo-form
Version:
Form state manager
53 lines (52 loc) • 2.33 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importDefault(require("react"));
const useField_1 = __importDefault(require("../hooks/useField"));
const FilePicker_1 = __importDefault(require("../basic/FilePicker"));
const utils_1 = require("../utils");
function FieldImage(props) {
const { compressFunc, multiple } = props;
const field = useField_1.default({
name: props.name,
validate: props.validate,
});
const [images, setImages] = react_1.default.useState([]);
return (react_1.default.createElement(FilePicker_1.default, Object.assign({ accept: ['image/jpeg', 'image/png'] }, props, { value: field.value, onChange: (e, value) => {
if (multiple) {
if (compressFunc) {
Promise.all(value.map(f => compressFunc(f))).then(compressedFiles => {
field.setFieldValue(compressedFiles);
Promise.all(compressedFiles.map(f => utils_1.blobToBase64(f))).then(base64List => {
setImages([...images, ...base64List]);
});
});
}
else {
field.setFieldValue(value);
Promise.all(value.map(f => utils_1.blobToBase64(f))).then(base64List => {
setImages([...images, ...base64List]);
});
}
}
else {
if (compressFunc) {
compressFunc(value).then(compressed => {
field.setFieldValue(compressed);
utils_1.blobToBase64(value).then(v => setImages([v]));
});
}
else {
field.setFieldValue(value);
utils_1.blobToBase64(value).then(v => setImages([v]));
}
}
}, onError: err => {
field.setFieldError(err);
} }), childProps => {
return props.children(Object.assign(Object.assign({}, childProps), { field, image: images[0], images }));
}));
}
exports.default = FieldImage;