From 5ddb5edf1b70cd864d3a66b38c955a3fd6ff39c6 Mon Sep 17 00:00:00 2001
From: Frank <frankhvidbjerg@gmail.com>
Date: Wed, 20 Nov 2024 09:05:59 +0100
Subject: [PATCH] Fix adding tasks (#160)

* Fix adding tasks

Display was set to none which was either always broken or then it broke recently
but the whole add-task-row was hidden.
Also removed the default value on the date-input, since the date is optional
if you set it to something, you can't set it back to nothing.

* Make the add-task-row hidden by default
---
 grocy-chores-card.js | 19 +++++++++----------
 1 file changed, 9 insertions(+), 10 deletions(-)

diff --git a/grocy-chores-card.js b/grocy-chores-card.js
index 514b39e..b13bba8 100644
--- a/grocy-chores-card.js
+++ b/grocy-chores-card.js
@@ -387,7 +387,7 @@ class GrocyChoresCard extends LitElement {
 
     _renderAddTask() {
         return html`
-            <div style="display: none;" id="add-task-row" class="add-row">
+            <div id="add-task-row" class="add-row hidden-class">
                 <mwc-button @click=${() => this._addTask()}>
                     <ha-icon class="add-icon" icon="mdi:plus"></ha-icon>
                 </mwc-button>
@@ -400,8 +400,7 @@ class GrocyChoresCard extends LitElement {
                         id="add-date"
                         class="add-input"
                         .locale=${this._hass.locale}
-                        .label=${this._translate("Optional due date")}
-                        .value="${this._taskDueDateInputFormat()}">
+                        .label=${this._translate("Optional due date")}>
                 </ha-date-input>
             </div>
         `
@@ -745,14 +744,14 @@ class GrocyChoresCard extends LitElement {
     }
 
     _toggleAddTask() {
-        const x = this.shadowRoot.getElementById("add-task-row");
-        const icon = this.shadowRoot.getElementById("add-task-icon");
-        if (x.style.display === "none") {
-            x.style.display = "flex";
-            icon.icon = "mdi:chevron-up";
+        const addTaskRow = this.shadowRoot.getElementById("add-task-row");
+        const addTaskIcon = this.shadowRoot.getElementById("add-task-icon");
+        if (addTaskRow.classList.contains('hidden-class')) {
+            addTaskRow.classList.remove('hidden-class');
+            addTaskIcon.icon = "mdi:chevron-up";
         } else {
-            x.style.display = "none";
-            icon.icon = "mdi:chevron-down";
+            addTaskRow.classList.add('hidden-class');
+            addTaskIcon.icon = "mdi:chevron-down";
         }
     }