Update Layer name on componet name update

src/navigator/view/ItemView.js

@@ -90,6 +90,7 @@ export default Backbone.View.extend({
       ['change:layerable', this.updateLayerable],
       ['change:style:display', this.updateVisibility],
       ['rerender:layer', this.render],
+      ['change:name change:custom-name', this.updateName],
     ].forEach((item) => this.listenTo(model, item[0], item[1]));
     this.className = `${pfx}layer ${pfx}layer__t-${type} no-select ${ppfx}two-color`;
     this.inputNameCls = `${ppfx}layer-name`;
@@ -112,6 +113,10 @@ export default Backbone.View.extend({
     });
   },
 
+  updateName() {
+    this.getInputName().innerText = this.model.getName();
+  },
+
   getVisibilityEl() {
     if (!this.eyeEl) {
       this.eyeEl = this.$el.children(`.${this.pfx}layer-vis`);

src/styles/scss/_gjs_layers.scss

@@ -88,6 +88,7 @@ $layerNameSpacing: 5px !default;
       overflow: hidden;
       white-space: nowrap;
       margin: 0 30px 0 $layerNameSpacing;
+      max-width: 170px;
       @extend .#{$app-prefix}no-user-select;
 
       &--no-edit {