From 8cd8c3aeaa8387d521627e4e15e80766890feafb Mon Sep 17 00:00:00 2001 From: Angus McLeod Date: Mon, 20 Apr 2020 21:40:32 +1000 Subject: [PATCH] Add field and action messages --- .../components/wizard-custom-action.js.es6 | 21 +++++- .../components/wizard-custom-field.js.es6 | 13 +++- .../components/wizard-message.js.es6 | 16 +++++ .../controllers/admin-wizards-wizard.js.es6 | 16 ++--- .../routes/admin-wizards-wizard-show.js.es6 | 9 ++- .../templates/admin-wizards-wizard.hbs | 22 ++---- .../components/wizard-custom-action.hbs | 9 ++- .../components/wizard-custom-field.hbs | 69 ++++++++++--------- .../templates/components/wizard-message.hbs | 12 ++++ assets/stylesheets/common/wizard-admin.scss | 21 +++--- config/locales/client.en.yml | 47 +++++++++---- 11 files changed, 168 insertions(+), 87 deletions(-) create mode 100644 assets/javascripts/discourse/components/wizard-message.js.es6 create mode 100644 assets/javascripts/discourse/templates/components/wizard-message.hbs diff --git a/assets/javascripts/discourse/components/wizard-custom-action.js.es6 b/assets/javascripts/discourse/components/wizard-custom-action.js.es6 index e0756650..28a361c3 100644 --- a/assets/javascripts/discourse/components/wizard-custom-action.js.es6 +++ b/assets/javascripts/discourse/components/wizard-custom-action.js.es6 @@ -1,5 +1,5 @@ import { default as discourseComputed } from 'discourse-common/utils/decorators'; -import { equal, empty, or } from "@ember/object/computed"; +import { equal, empty, or, and } from "@ember/object/computed"; import { generateName, selectKitContent } from '../lib/wizard'; import { computed } from "@ember/object"; import wizardSchema from '../lib/wizard-schema'; @@ -10,7 +10,6 @@ export default Component.extend(UndoChanges, { componentType: 'action', classNameBindings: [':wizard-custom-action', 'visible'], visible: computed('currentActionId', function() { return this.action.id === this.currentActionId }), - actionTypes: Object.keys(wizardSchema.action.types).map(t => ({ id: t, name: generateName(t) })), createTopic: equal('action.type', 'create_topic'), updateProfile: equal('action.type', 'update_profile'), sendMessage: equal('action.type', 'send_message'), @@ -21,10 +20,28 @@ export default Component.extend(UndoChanges, { apiEmpty: empty('action.api'), groupPropertyTypes: selectKitContent(['id', 'name']), hasAdvanced: or('hasCustomFields', 'routeTo'), + showAdvanced: and('hasAdvanced', 'action.type'), hasCustomFields: or('basicTopicFields', 'updateProfile'), basicTopicFields: or('createTopic', 'sendMessage', 'openComposer'), publicTopicFields: or('createTopic', 'openComposer'), showSkipRedirect: or('createTopic', 'sendMessage'), + actionTypes: Object.keys(wizardSchema.action.types).map(type => { + return { + id: type, + name: I18n.t(`admin.wizard.action.${type}.label`) + }; + }), + + messageUrl: 'https://thepavilion.io/t/2810', + + @discourseComputed('action.type') + messageKey(type) { + let key = 'type'; + if (type) { + key = 'edit'; + } + return key; + }, @discourseComputed('wizard.steps') runAfterContent(steps) { diff --git a/assets/javascripts/discourse/components/wizard-custom-field.js.es6 b/assets/javascripts/discourse/components/wizard-custom-field.js.es6 index 660150b1..d7d53e00 100644 --- a/assets/javascripts/discourse/components/wizard-custom-field.js.es6 +++ b/assets/javascripts/discourse/components/wizard-custom-field.js.es6 @@ -1,5 +1,5 @@ import { default as discourseComputed } from 'discourse-common/utils/decorators'; -import { equal, or } from "@ember/object/computed"; +import { equal, or, alias } from "@ember/object/computed"; import { computed } from "@ember/object"; import { selectKitContent } from '../lib/wizard'; import UndoChanges from '../mixins/undo-changes'; @@ -22,6 +22,17 @@ export default Component.extend(UndoChanges, { showLimit: or('isCategory', 'isTag'), showMinLength: or('isText', 'isTextarea', 'isUrl', 'isComposer'), categoryPropertyTypes: selectKitContent(['id', 'slug']), + showAdvanced: alias('field.type'), + messageUrl: 'https://thepavilion.io/t/2809', + + @discourseComputed('field.type') + messageKey(type) { + let key = 'type'; + if (type) { + key = 'edit'; + } + return key; + }, setupTypeOutput(fieldType, options) { const selectionType = { diff --git a/assets/javascripts/discourse/components/wizard-message.js.es6 b/assets/javascripts/discourse/components/wizard-message.js.es6 new file mode 100644 index 00000000..1f1c56ef --- /dev/null +++ b/assets/javascripts/discourse/components/wizard-message.js.es6 @@ -0,0 +1,16 @@ +import { default as discourseComputed } from 'discourse-common/utils/decorators'; +import Component from "@ember/component"; + +export default Component.extend({ + classNames: 'wizard-message', + + @discourseComputed('key', 'component') + message(key, component) { + return I18n.t(`admin.wizard.message.${component}.${key}`); + }, + + @discourseComputed('component') + documentation(component) { + return I18n.t(`admin.wizard.message.${component}.documentation`); + } +}) \ No newline at end of file diff --git a/assets/javascripts/discourse/controllers/admin-wizards-wizard.js.es6 b/assets/javascripts/discourse/controllers/admin-wizards-wizard.js.es6 index b09e2ecd..79741328 100644 --- a/assets/javascripts/discourse/controllers/admin-wizards-wizard.js.es6 +++ b/assets/javascripts/discourse/controllers/admin-wizards-wizard.js.es6 @@ -11,15 +11,15 @@ export default Controller.extend({ }, @discourseComputed('creating', 'wizardId') - message(creating, wizardId) { - let type = 'select'; - + messageKey(creating, wizardId) { + let key = 'select'; if (creating) { - type = 'create'; + key = 'create'; } else if (wizardId) { - type = 'edit'; + key = 'edit'; } - - return I18n.t(`admin.wizard.message.${type}`); - } + return key; + }, + + messageUrl: "https://thepavilion.io/c/knowledge/custom-wizard" }); \ No newline at end of file diff --git a/assets/javascripts/discourse/routes/admin-wizards-wizard-show.js.es6 b/assets/javascripts/discourse/routes/admin-wizards-wizard-show.js.es6 index 14fb07e4..1700bf6c 100644 --- a/assets/javascripts/discourse/routes/admin-wizards-wizard-show.js.es6 +++ b/assets/javascripts/discourse/routes/admin-wizards-wizard-show.js.es6 @@ -1,7 +1,6 @@ import CustomWizard from '../models/custom-wizard'; import { ajax } from 'discourse/lib/ajax'; import DiscourseRoute from "discourse/routes/discourse"; -import { selectKitContent } from '../lib/wizard'; export default DiscourseRoute.extend({ model(params) { @@ -21,10 +20,16 @@ export default DiscourseRoute.extend({ setupController(controller, model) { const parentModel = this.modelFor('adminWizardsWizard'); const wizard = CustomWizard.create((!model || model.create) ? {} : model); + const fieldTypes = Object.keys(parentModel.field_types).map(type => { + return { + id: type, + name: I18n.t(`admin.wizard.field.type.${type}`) + }; + }) let props = { wizardList: parentModel.wizard_list, - fieldTypes: selectKitContent(Object.keys(parentModel.field_types)), + fieldTypes, userFields: parentModel.userFields, apis: parentModel.apis, themes: parentModel.themes, diff --git a/assets/javascripts/discourse/templates/admin-wizards-wizard.hbs b/assets/javascripts/discourse/templates/admin-wizards-wizard.hbs index a02c5324..049184e2 100644 --- a/assets/javascripts/discourse/templates/admin-wizards-wizard.hbs +++ b/assets/javascripts/discourse/templates/admin-wizards-wizard.hbs @@ -13,24 +13,10 @@ icon="plus"}} -
-
- {{d-icon 'info-circle'}} - {{message}} -
- -
- {{d-icon 'question-circle'}} - - - {{i18n 'admin.wizard.message.documentation'}} - - - {{!-- - {{i18n 'admin.wizard.message.contact'}} - --}} -
-
+{{wizard-message + key=messageKey + url=messageUrl + component='wizard'}}
{{outlet}} diff --git a/assets/javascripts/discourse/templates/components/wizard-custom-action.hbs b/assets/javascripts/discourse/templates/components/wizard-custom-action.hbs index bbd35d5f..c91df873 100644 --- a/assets/javascripts/discourse/templates/components/wizard-custom-action.hbs +++ b/assets/javascripts/discourse/templates/components/wizard-custom-action.hbs @@ -17,7 +17,7 @@ content=actionTypes onChange=(action "changeType") options=(hash - none="admin.wizard.field.type" + none="admin.wizard.select_type" )}}
@@ -35,6 +35,11 @@ +{{wizard-message + key=messageKey + url=messageUrl + component='action'}} + {{#if basicTopicFields}}
@@ -267,7 +272,7 @@
{{/if}} -{{#if hasAdvanced}} +{{#if showAdvanced}} {{wizard-advanced-toggle showAdvanced=action.showAdvanced}} {{#if action.showAdvanced}} diff --git a/assets/javascripts/discourse/templates/components/wizard-custom-field.hbs b/assets/javascripts/discourse/templates/components/wizard-custom-field.hbs index ad3589bb..c7827c1e 100644 --- a/assets/javascripts/discourse/templates/components/wizard-custom-field.hbs +++ b/assets/javascripts/discourse/templates/components/wizard-custom-field.hbs @@ -60,11 +60,16 @@ content=fieldTypes onChange=(action "changeType") options=(hash - none="admin.wizard.field.type" + none="admin.wizard.select_type" )}}
+{{wizard-message + key=messageKey + url=messageUrl + component='field'}} + {{#if showMinLength}}
@@ -137,41 +142,43 @@
{{/if}} -{{wizard-advanced-toggle showAdvanced=field.showAdvanced}} +{{#if showAdvanced}} + {{wizard-advanced-toggle showAdvanced=field.showAdvanced}} -{{#if field.showAdvanced}} -
- - {{#if isCategory}} + {{#if field.showAdvanced}} +
+ + {{#if isCategory}} +
+
+ +
+ +
+ {{combo-box + value=field.property + content=categoryPropertyTypes + onChange=(action (mut field.property)) + options=(hash + none='admin.wizard.selector.placeholder.property' + )}} +
+
+ {{/if}} +
- +
- -
- {{combo-box - value=field.property - content=categoryPropertyTypes - onChange=(action (mut field.property)) - options=(hash - none='admin.wizard.selector.placeholder.property' - )}} +
+ {{input + name="key" + value=field.key + class="medium" + placeholderKey="admin.wizard.translation_placeholder"}}
- {{/if}} - -
-
- -
-
- {{input - name="key" - value=field.key - class="medium" - placeholderKey="admin.wizard.translation_placeholder"}} -
+
- -
+ {{/if}} {{/if}} diff --git a/assets/javascripts/discourse/templates/components/wizard-message.hbs b/assets/javascripts/discourse/templates/components/wizard-message.hbs new file mode 100644 index 00000000..9f66fc77 --- /dev/null +++ b/assets/javascripts/discourse/templates/components/wizard-message.hbs @@ -0,0 +1,12 @@ +
+ {{d-icon 'info-circle'}} + {{message}} +
+ +
+ {{d-icon 'question-circle'}} + + + {{documentation}} + +
\ No newline at end of file diff --git a/assets/stylesheets/common/wizard-admin.scss b/assets/stylesheets/common/wizard-admin.scss index a96a7c36..3bb66e4c 100644 --- a/assets/stylesheets/common/wizard-admin.scss +++ b/assets/stylesheets/common/wizard-admin.scss @@ -7,15 +7,21 @@ align-items: center; justify-content: space-between; margin-bottom: 20px; + + &+ .wizard-message + div { + margin-top: 20px; + } } -.admin-wizard-message { +.wizard-message { background-color: $primary-low; + width: 100%; padding: 10px; + box-sizing: border-box; display: flex; justify-content: space-between; - .wizard-message { + .message-block { .d-icon { margin-right: 4px; } @@ -26,10 +32,10 @@ margin-left: 5px; } } -} - -.admin-wizard-container { - margin-top: 20px; + + & + div { + margin-top: 30px; + } } .wizard-submissions { @@ -55,7 +61,6 @@ } .wizard-settings-parent { - margin-bottom: 30px; padding: 20px; border: 1px solid $primary-low; } @@ -419,7 +424,7 @@ } .wizard-links { - margin: 20px 0; + margin: 40px 0 20px 0; display: inline-block; width: 100%; diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml index 01de81fa..7a0b526e 100644 --- a/config/locales/client.en.yml +++ b/config/locales/client.en.yml @@ -55,13 +55,23 @@ en: advanced: "Advanced" undo: "Undo" clear: "Clear" + select_type: "Select a type" message: - select: "Select a wizard, or create a new one" - edit: "You're editing a wizard" - create: "You're creating a new wizard" - documentation: "Check out the documentation" - contact: "Contact the developer" + wizard: + select: "Select a wizard, or create a new one" + edit: "You're editing a wizard" + create: "You're creating a new wizard" + documentation: "Check out the wizard documentation" + contact: "Contact the developer" + field: + type: "Select a field type" + edit: "You're editing a field" + documentation: "Check out the field documentation" + action: + type: "Select an action type" + edit: "You're editing an action" + documentation: "Check out the action documentation" editor: show: "Show" @@ -124,7 +134,6 @@ en: label: "Params" field: - type: "Choose a type" header: "Fields" label: "Label" description: "Description" @@ -135,12 +144,25 @@ en: min_length: "Min Length" min_length_placeholder: "Minimum length in characters" file_types: "File Types" - tag: "Tag" - category: "Category" limit: "Limit" property: "Property" prefill: "Prefill" content: "Content" + + type: + text: "Text" + textarea: Textarea + composer: Composer + text_only: Text Only + number: Number + checkbox: Checkbox + url: Url + upload: Upload + dropdown: Dropdown + tag: Tag + category: Category + group: Group + user_selector: User Selector connector: and: "and" @@ -166,7 +188,6 @@ en: run_after: label: "Run After" wizard_completion: "Wizard Completion" - custom_fields: label: "Custom" key: "field" @@ -180,6 +201,8 @@ en: label: "Create Topic" category: "Category" tags: "Tags" + open_composer: + label: "Open Composer" update_profile: label: "Fields" key: "field" @@ -195,12 +218,6 @@ en: label: "Route To" url: "Url" code: "Code" - custom_title: "Custom Title" - custom_category: - label: "Custom Category" - user_field: "User Field" - custom_tag: - label: "Custom Tag" send_to_api: label: "Send to API" api: "API"