diff --git a/app/components/button/new.hbs b/app/components/button/new.hbs new file mode 100644 index 0000000000000000000000000000000000000000..1f0f5f9c2c8e7ee3ee6e64b28ff657014065f48e --- /dev/null +++ b/app/components/button/new.hbs @@ -0,0 +1,17 @@ +{{#if @route}} + <LinkTo + @route={{@route}} + class="btn btn-success"> + <i class="bi bi-plus-lg mx-1"></i> + {{this.text}} + </LinkTo> +{{else}} + <button + class="btn btn-success" + type="button" + {{on "click" @onClick}}> + <i class="bi bi-plus-lg mx-1"></i> + {{this.text}} + </button> +{{/if}} + diff --git a/app/components/button/new.js b/app/components/button/new.js new file mode 100644 index 0000000000000000000000000000000000000000..bd571eb6f38521df17c27493b5656a5b8cc1647c --- /dev/null +++ b/app/components/button/new.js @@ -0,0 +1,32 @@ +import Component from '@glimmer/component'; + + +class ButtonNewComponent extends Component { + /* + "New Button" component. Renders a button as either + html <a> tag or as <button>. + + Arguments: + @route - if `route` argument is provided, button will + be rendered as <a>. + @onClick - if `onClick` argument is provided - button + will be rendered as <button>. + @text - button's text. Default value is "New". + + Examples: + + Render component as <button> with `onClick` handler: + + <Button::New @onClick={{this.onToggleNew}} /> + + Render componet as <a> with given route: + + <Button::New @route="automates.add" /> + */ + + get text() { + return this.args.text || "New"; + } +} + +export default ButtonNewComponent; \ No newline at end of file diff --git a/app/components/tag/new.hbs b/app/components/tag/new.hbs index 865a8310a62588522f81d4f473d39f06c255797e..c35bca1b4a904c8cd5f3953cf0d34c42af62540d 100644 --- a/app/components/tag/new.hbs +++ b/app/components/tag/new.hbs @@ -1,6 +1,5 @@ -<button class="btn btn-success" type="button" {{on "click" this.onToggleNew}}> - <i class="bi bi-plus-lg mx-1"></i>New -</button> +<Button::New @onClick={{this.onToggleNew}} /> + {{#if this.form_visible}} <form> diff --git a/app/templates/automates/index.hbs b/app/templates/automates/index.hbs index 83cb76b2f8d675d0b11d249f707ca4d8b6db5dc5..4c77266a8557654870dab6089179a498e84e03d0 100644 --- a/app/templates/automates/index.hbs +++ b/app/templates/automates/index.hbs @@ -1,8 +1,4 @@ -<LinkTo - @route="automates.add" - class="btn btn-success"> - <i class="bi bi-plus-lg mx-1"></i>New -</LinkTo> +<Button::New @route="automates.add" /> <div class="tags"> <table class="table table-striped align-middle">