Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

DEV: Convert form template modals to new component-based API (#22196)

This commit is contained in:
Keegan George 2023-07-04 12:42:36 -07:00 committed by GitHub
parent e09ce99884
commit 904450594d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 69 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app/assets/javascripts/admin/addon/components/form-template/form.hbs
View File

@ -69,3 +69,10 @@
{{/if}}
</div>
</div>
{{#if this.showFormTemplateFormPreview}}
<Modal::FormTemplateFormPreview
@closeModal={{fn (mut this.showFormTemplateFormPreview) false}}
@content={{this.templateContent}}
/>
{{/if}}

7
app/assets/javascripts/admin/addon/components/form-template/form.js
View File

@ -14,6 +14,7 @@ export default class FormTemplateForm extends Component {
@tracked formSubmitted = false;
@tracked templateContent = this.args.model?.template || "";
@tracked templateName = this.args.model?.name || "";
@tracked showFormTemplateFormPreview;
isEditing = this.args.model?.id ? true : false;
quickInsertFields = [
{
@ -129,11 +130,7 @@ export default class FormTemplateForm extends Component {
FormTemplate.validateTemplate(data)
.then(() => {
return showModal("form-template-form-preview", {
model: {
content: this.templateContent,
},
});
this.showFormTemplateFormPreview = true;
})
.catch(popupAjaxError);
}

10
app/assets/javascripts/admin/addon/components/form-template/row-item.hbs
View File

@ -10,7 +10,7 @@
@title="admin.form_templates.list_table.actions.view"
@icon="far-eye"
@class="btn-view-template"
@action={{this.viewTemplate}}
@action={{fn (mut this.showViewTemplateModal) true}}
/>
<DButton
@title="admin.form_templates.list_table.actions.edit"
@ -26,3 +26,11 @@
/>
</td>
</tr>
{{#if this.showViewTemplateModal}}
<Modal::CustomizeFormTemplateView
@closeModal={{fn (mut this.showViewTemplateModal) false}}
@model={{@template}}
@refreshModel={{@refreshModel}}
/>
{{/if}}

9
app/assets/javascripts/admin/addon/components/form-template/row-item.js
View File

@ -1,6 +1,5 @@
import Component from "@glimmer/component";
import { action } from "@ember/object";
import showModal from "discourse/lib/show-modal";
import { inject as service } from "@ember/service";
import { ajax } from "discourse/lib/ajax";
import { popupAjaxError } from "discourse/lib/ajax-error";
@ -17,14 +16,6 @@ export default class FormTemplateRowItem extends Component {
);
}
@action
viewTemplate() {
showModal("customize-form-template-view", {
model: this.args.template,
refreshModel: this.args.refreshModel,
});
}
@action
editTemplate() {
this.router.transitionTo(

37
app/assets/javascripts/discourse/app/components/modal/customize-form-template-view.hbs Normal file
View File

@ -0,0 +1,37 @@
<DModal
@title={{@model.name}}
@closeModal={{@closeModal}}
class="customize-form-template-view-modal"
>
<:body>
<div class="control-group">
<DToggleSwitch
class="form-templates__preview-toggle"
@state={{this.showPreview}}
@label="admin.form_templates.view_template.toggle_preview"
{{on "click" this.togglePreview}}
/>
</div>
{{#if this.showPreview}}
<FormTemplateField::Wrapper @id={{@model.id}} />
{{else}}
<HighlightedCode @lang="yaml" @code={{@model.template}} />
{{/if}}
</:body>
<:footer>
<DButton
class="btn-primary"
@action={{this.editTemplate}}
@icon="pencil-alt"
@label="admin.form_templates.view_template.edit"
/>
<DModalCancel @close={{@closeModal}} />
<DButton
class="btn-danger"
@action={{this.deleteTemplate}}
@icon="trash-alt"
@label="admin.form_templates.view_template.delete"
/>
</:footer>
</DModal>

9
app/assets/javascripts/discourse/app/controllers/customize-form-template-view.js → app/assets/javascripts/discourse/app/components/modal/customize-form-template-view.js
View File

@ -1,5 +1,4 @@
import Controller from "@ember/controller";
import ModalFunctionality from "discourse/mixins/modal-functionality";
import Component from "@glimmer/component";
import { action } from "@ember/object";
import { inject as service } from "@ember/service";
import I18n from "I18n";
@ -7,9 +6,7 @@ import { popupAjaxError } from "discourse/lib/ajax-error";
import { ajax } from "discourse/lib/ajax";
import { tracked } from "@glimmer/tracking";
export default class AdminCustomizeFormTemplateView extends Controller.extend(
ModalFunctionality
) {
export default class CustomizeFormTemplateViewModal extends Component {
@service router;
@service dialog;
@tracked showPreview = false;
@ -35,7 +32,7 @@ export default class AdminCustomizeFormTemplateView extends Controller.extend(
type: "DELETE",
})
.then(() => {
this.refreshModel();
this.args.refreshModel();
})
.catch(popupAjaxError);
},

9
app/assets/javascripts/discourse/app/components/modal/form-template-form-preview.hbs Normal file
View File

@ -0,0 +1,9 @@
<DModal
@closeModal={{@closeModal}}
@title={{i18n "admin.form_templates.preview_modal.title"}}
class="form-template-form-preview-modal"
>
<:body>
<FormTemplateField::Wrapper @content={{@content}} />
</:body>
</DModal>

6
app/assets/javascripts/discourse/app/controllers/form-template-form-preview.js
View File

@ -1,6 +0,0 @@
import Controller from "@ember/controller";
import ModalFunctionality from "discourse/mixins/modal-functionality";
export default class AdminFormTemplateValidationOptions extends Controller.extend(
ModalFunctionality
) {}

33
app/assets/javascripts/discourse/app/templates/modal/customize-form-template-view.hbs
View File

@ -1,33 +0,0 @@
<DModalBody @rawTitle={{this.model.name}}>
<div class="control-group">
<DToggleSwitch
class="form-templates__preview-toggle"
@state={{this.showPreview}}
@label="admin.form_templates.view_template.toggle_preview"
{{on "click" this.togglePreview}}
/>
</div>
{{#if this.showPreview}}
<FormTemplateField::Wrapper @id={{this.model.id}} />
{{else}}
<HighlightedCode @lang="yaml" @code={{this.model.template}} />
{{/if}}
</DModalBody>
<div class="modal-footer">
<DButton
class="btn-primary"
@action={{this.editTemplate}}
@icon="pencil-alt"
@label="admin.form_templates.view_template.edit"
/>
<DButton
@action={{route-action "closeModal"}}
@label="admin.form_templates.view_template.close"
/>
<DButton
class="btn-danger"
@action={{this.deleteTemplate}}
@icon="trash-alt"
@label="admin.form_templates.view_template.delete"
/>
</div>

6
app/assets/javascripts/discourse/app/templates/modal/form-template-form-preview.hbs
View File

@ -1,6 +0,0 @@
<DModalBody
@class="form-templates__validation-options"
@title="admin.form_templates.preview_modal.title"
>
<FormTemplateField::Wrapper @content={{this.model.content}} />
</DModalBody>