From f5653d0da55cb6c4f4e17434c64b1126f71e936e Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Thu, 12 Mar 2020 20:37:33 +0100
Subject: [PATCH] Show if helper can be edited (#5174)

Fixes #5173
Fixes #5171
---
 src/components/data-table/ha-data-table.ts    |  4 +++
 .../config/helpers/ha-config-helpers.ts       | 30 ++++++++++++++++---
 2 files changed, 30 insertions(+), 4 deletions(-)

diff --git a/src/components/data-table/ha-data-table.ts b/src/components/data-table/ha-data-table.ts
index 859be8cec3..6fef89eb4a 100644
--- a/src/components/data-table/ha-data-table.ts
+++ b/src/components/data-table/ha-data-table.ts
@@ -534,6 +534,10 @@ export class HaDataTable extends LitElement {
         flex-shrink: 0;
       }
 
+      .mdc-data-table__cell.mdc-data-table__cell--icon {
+        overflow: initial;
+      }
+
       .mdc-data-table__header-cell--checkbox,
       .mdc-data-table__cell--checkbox {
         /* @noflip */
diff --git a/src/panels/config/helpers/ha-config-helpers.ts b/src/panels/config/helpers/ha-config-helpers.ts
index 7dafdb725e..25366851a1 100644
--- a/src/panels/config/helpers/ha-config-helpers.ts
+++ b/src/panels/config/helpers/ha-config-helpers.ts
@@ -29,6 +29,7 @@ import { configSections } from "../ha-panel-config";
 import { showEntityEditorDialog } from "../entities/show-dialog-entity-editor";
 import { showHelperDetailDialog } from "./show-dialog-helper-detail";
 import { HELPER_DOMAINS } from "./const";
+import { domainIcon } from "../../../common/entity/domain_icon";
 
 @customElement("ha-config-helpers")
 export class HaConfigHelpers extends LitElement {
@@ -44,8 +45,8 @@ export class HaConfigHelpers extends LitElement {
         icon: {
           title: "",
           type: "icon",
-          template: (icon) => html`
-            <ha-icon slot="item-icon" .icon=${icon}></ha-icon>
+          template: (icon, helper: any) => html`
+            <ha-icon .icon=${icon || domainIcon(helper.type)}></ha-icon>
           `,
         },
         name: {
@@ -76,7 +77,7 @@ export class HaConfigHelpers extends LitElement {
           ),
           sortable: true,
           filterable: true,
-          width: "30%",
+          width: "25%",
         };
       }
       columns.type = {
@@ -84,7 +85,7 @@ export class HaConfigHelpers extends LitElement {
           "ui.panel.config.helpers.picker.headers.type"
         ),
         sortable: true,
-        width: "30%",
+        width: "25%",
         filterable: true,
         template: (type) =>
           html`
@@ -92,6 +93,27 @@ export class HaConfigHelpers extends LitElement {
               type}
           `,
       };
+      columns.editable = {
+        title: "",
+        type: "icon",
+        template: (editable) => html`
+          ${!editable
+            ? html`
+                <div
+                  tabindex="0"
+                  style="display:inline-block; position: relative;"
+                >
+                  <ha-icon icon="hass:pencil-off"></ha-icon>
+                  <paper-tooltip position="left">
+                    ${this.hass.localize(
+                      "ui.panel.config.entities.picker.status.readonly"
+                    )}
+                  </paper-tooltip>
+                </div>
+              `
+            : ""}
+        `,
+      };
       return columns;
     }
   );