@prisma-cms/front-editor
Version:
99 lines (98 loc) • 4.29 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.GalleryFiles = void 0;
const react_1 = __importDefault(require("react"));
const EditorComponent_1 = __importDefault(require("../../../EditorComponent"));
const EditableObject_1 = __importDefault(require("../../form/EditableObject"));
const context_1 = require("../../../context");
const react_apollo_1 = require("react-apollo");
const graphql_tag_1 = __importDefault(require("graphql-tag"));
class GalleryFiles extends EditorComponent_1.default {
renderPanelView(content) {
return super.renderPanelView(content || (react_1.default.createElement("div", { className: "editor-component--panel-icon" }, "GalleryFiles")));
}
getRootElement() {
return super.getRootElement();
}
canBeParent(parent) {
return (super.canBeParent(parent) &&
this.findInParent(parent, (parent) => parent instanceof EditableObject_1.default));
}
canBeChild(child) {
return super.canBeChild(child);
}
renderChildren() {
const { Image } = this.context;
const { inEditMode } = this.getEditorContext();
const { name,
// ...other
} = this.getComponentProps(this);
const children = super.renderChildren();
if (inEditMode) {
return children;
}
/**
* Проблема заключается в том, что надо соблюдать сортировку для новых файлов и имеющихся.
*/
return (react_1.default.createElement(context_1.EditableObjectContext.Consumer, { key: "GalleryFiles" }, (editableObjectContext) => {
const { object, getObjectWithMutations, _dirty } = editableObjectContext;
if (!getObjectWithMutations) {
return null;
}
const { [name]: files } = object || {};
const { [name]: dirty_files } = _dirty || {};
let Files = [].concat(files || []);
if (dirty_files &&
dirty_files.connect &&
Array.isArray(dirty_files.connect)) {
// Files = Files.concat(dirty_files.connect);
Files = Files.concat(dirty_files.connect.map((n) => ({
connect: {
id: n.id,
},
})));
}
return Files.map((n, index) => {
let item = null;
const { id, path, connect } = n;
const src = path;
if (connect && typeof connect === 'object') {
const { id: newFileId } = connect;
if (newFileId) {
const query = graphql_tag_1.default `
query file($where: FileWhereUniqueInput!) {
object: file(where: $where) {
...file
}
}
fragment file on File {
id
path
}
`;
item = (react_1.default.createElement(react_apollo_1.Query, { key: id || index, query: query, variables: {
where: {
id: newFileId,
},
} }, ({ data }) => {
const { path } = (data && data.object) || {};
return path ? (react_1.default.createElement(Image, { key: id || index, src: path })) : null;
}));
}
}
if (src) {
item = react_1.default.createElement(Image, { key: id || index, src: src });
}
return item;
}).filter((n) => n);
}));
}
}
exports.GalleryFiles = GalleryFiles;
GalleryFiles.Name = 'GalleryFiles';
GalleryFiles.defaultProps = Object.assign(Object.assign({}, EditorComponent_1.default.defaultProps), { name: 'Files' });
exports.default = GalleryFiles;
//# sourceMappingURL=index.js.map