diff --git a/client/src/components/StreamField/blocks/BaseSequenceBlock.js b/client/src/components/StreamField/blocks/BaseSequenceBlock.js index bef55f6068..9f3cdf3a76 100644 --- a/client/src/components/StreamField/blocks/BaseSequenceBlock.js +++ b/client/src/components/StreamField/blocks/BaseSequenceBlock.js @@ -6,11 +6,16 @@ import EventEmitter from 'events'; import { escapeHtml as h } from '../../../utils/text'; class ActionButton { - constructor(sequenceChild, iconName, label) { + constructor(sequenceChild) { this.sequenceChild = sequenceChild; + } + + render(container) { + const label = this.sequenceChild.strings[this.labelIdentifier] || this.labelIdentifier; + this.dom = $(` `); @@ -18,9 +23,7 @@ class ActionButton { if (this.onClick) this.onClick(); return false; // don't propagate to header's onclick event (which collapses the block) }); - } - render(container) { $(container).append(this.dom); if (this.enableEvent) { @@ -52,6 +55,8 @@ class MoveUpButton extends ActionButton { enableEvent = 'enableMoveUp'; disableEvent = 'disableMoveUp'; initiallyDisabled = true; + icon = 'arrow-up'; + labelIdentifier = 'MOVE_UP'; onClick() { this.sequenceChild.moveUp(); @@ -62,6 +67,8 @@ class MoveDownButton extends ActionButton { enableEvent = 'enableMoveDown'; disableEvent = 'disableMoveDown'; initiallyDisabled = true; + icon = 'arrow-down'; + labelIdentifier = 'MOVE_DOWN'; onClick() { this.sequenceChild.moveDown(); @@ -71,6 +78,8 @@ class MoveDownButton extends ActionButton { class DuplicateButton extends ActionButton { enableEvent = 'enableDuplication'; disableEvent = 'disableDuplication'; + icon = 'duplicate'; + labelIdentifier = 'DUPLICATE'; onClick() { this.sequenceChild.duplicate({ animate: true }); @@ -78,6 +87,9 @@ class DuplicateButton extends ActionButton { } class DeleteButton extends ActionButton { + icon = 'bin'; + labelIdentifier = 'DELETE'; + onClick() { this.sequenceChild.delete({ animate: true }); } @@ -94,7 +106,7 @@ export class BaseSequenceChild extends EventEmitter { const animate = opts && opts.animate; this.collapsed = opts && opts.collapsed; - const strings = (opts && opts.strings) || {}; + this.strings = (opts && opts.strings) || {}; const dom = $(`