import { default as discourseComputed } from "discourse-common/utils/decorators"; import { equal, or } from "@ember/object/computed"; import { computed } from "@ember/object"; import { selectKitContent } from "../lib/wizard"; import UndoChanges from "../mixins/undo-changes"; import Component from "@ember/component"; import wizardSchema from "../lib/wizard-schema"; export default Component.extend(UndoChanges, { componentType: "field", classNameBindings: [":wizard-custom-field", "visible"], visible: computed("currentFieldId", function () { return this.field.id === this.currentFieldId; }), isDropdown: equal("field.type", "dropdown"), isUpload: equal("field.type", "upload"), isCategory: equal("field.type", "category"), isTopic: equal("field.type", "topic"), isGroup: equal("field.type", "group"), isTag: equal("field.type", "tag"), isText: equal("field.type", "text"), isTextarea: equal("field.type", "textarea"), isUrl: equal("field.type", "url"), isComposer: equal("field.type", "composer"), showPrefill: or( "isText", "isCategory", "isTag", "isGroup", "isDropdown", "isTopic" ), showContent: or("isCategory", "isTag", "isGroup", "isDropdown", "isTopic"), showLimit: or("isCategory", "isTag", "isTopic"), isTextType: or("isText", "isTextarea", "isComposer"), isComposerPreview: equal("field.type", "composer_preview"), categoryPropertyTypes: selectKitContent(["id", "slug"]), messageUrl: "https://pavilion.tech/products/discourse-custom-wizard-plugin/documentation/field-settings", @discourseComputed("field.type") validations(type) { const applicableToField = []; for (let validation in wizardSchema.field.validations) { if (wizardSchema.field.validations[validation]["types"].includes(type)) { applicableToField.push(validation); } } return applicableToField; }, @discourseComputed("field.type") isDateTime(type) { return ["date_time", "date", "time"].indexOf(type) > -1; }, @discourseComputed("field.type") messageKey(type) { let key = "type"; if (type) { key = "edit"; } return key; }, setupTypeOutput(fieldType, options) { const selectionType = { category: "category", tag: "tag", group: "group", }[fieldType]; if (selectionType) { options[`${selectionType}Selection`] = "output"; options.outputDefaultSelection = selectionType; } return options; }, @discourseComputed("field.type") contentOptions(fieldType) { let options = { wizardFieldSelection: true, textSelection: "key,value", userFieldSelection: "key,value", context: "field", }; options = this.setupTypeOutput(fieldType, options); if (this.isDropdown) { options.wizardFieldSelection = "key,value"; options.userFieldOptionsSelection = "output"; options.textSelection = "key,value"; options.inputTypes = "association,conditional,assignment"; options.pairConnector = "association"; options.keyPlaceholder = "admin.wizard.key"; options.valuePlaceholder = "admin.wizard.value"; } return options; }, @discourseComputed("field.type") prefillOptions(fieldType) { let options = { wizardFieldSelection: true, textSelection: true, userFieldSelection: "key,value", context: "field", }; return this.setupTypeOutput(fieldType, options); }, @discourseComputed("step.index") fieldConditionOptions(stepIndex) { const options = { inputTypes: "validation", context: "field", textSelection: "value", userFieldSelection: true, groupSelection: true, }; if (stepIndex > 0) { options.wizardFieldSelection = true; options.wizardActionSelection = true; } return options; }, @discourseComputed("step.index") fieldIndexOptions(stepIndex) { const options = { context: "field", userFieldSelection: true, groupSelection: true, }; if (stepIndex > 0) { options.wizardFieldSelection = true; options.wizardActionSelection = true; } return options; }, actions: { imageUploadDone(upload) { this.setProperties({ "field.image": upload.url, "field.image_upload_id": upload.id, }); }, imageUploadDeleted() { this.setProperties({ "field.image": null, "field.image_upload_id": null, }); }, changeCategory(category) { this.set("field.category", category?.id); }, }, });