From 7780ae8f76bec76636282d1c08c2ad62273f4111 Mon Sep 17 00:00:00 2001
From: Paul Bottein <paul.bottein@gmail.com>
Date: Thu, 22 Dec 2022 13:03:14 +0100
Subject: [PATCH] Fixes select selector filter (#14850)

---
 .../ha-selector/ha-selector-select.ts         | 25 +++++++++++++------
 1 file changed, 17 insertions(+), 8 deletions(-)

diff --git a/src/components/ha-selector/ha-selector-select.ts b/src/components/ha-selector/ha-selector-select.ts
index 9e91b65fbe..ac2ba9d63b 100644
--- a/src/components/ha-selector/ha-selector-select.ts
+++ b/src/components/ha-selector/ha-selector-select.ts
@@ -88,6 +88,10 @@ export class HaSelectSelector extends LitElement {
       const value =
         !this.value || this.value === "" ? [] : (this.value as string[]);
 
+      const optionItems = options.filter(
+        (option) => !option.disabled && !value?.includes(option.value)
+      );
+
       return html`
         ${value?.length
           ? html`<ha-chip-set>
@@ -118,13 +122,11 @@ export class HaSelectSelector extends LitElement {
           .disabled=${this.disabled}
           .required=${this.required && !value.length}
           .value=${this._filter}
-          .items=${options}
-          .filteredItems=${options.filter(
-            (option) => !option.disabled && !value?.includes(option.value)
-          )}
+          .items=${optionItems}
           .allowCustomValue=${this.selector.select.custom_value ?? false}
           @filter-changed=${this._filterChanged}
           @value-changed=${this._comboBoxValueChanged}
+          @opened-changed=${this._openedChanged}
         ></ha-combo-box>
       `;
     }
@@ -132,11 +134,14 @@ export class HaSelectSelector extends LitElement {
     if (this.selector.select?.custom_value) {
       if (
         this.value !== undefined &&
+        !Array.isArray(this.value) &&
         !options.find((option) => option.value === this.value)
       ) {
         options.unshift({ value: this.value, label: this.value });
       }
 
+      const optionItems = options.filter((option) => !option.disabled);
+
       return html`
         <ha-combo-box
           item-value-path="value"
@@ -146,10 +151,11 @@ export class HaSelectSelector extends LitElement {
           .helper=${this.helper}
           .disabled=${this.disabled}
           .required=${this.required}
-          .items=${options.filter((item) => !item.disabled)}
+          .items=${optionItems}
           .value=${this.value}
           @filter-changed=${this._filterChanged}
           @value-changed=${this._comboBoxValueChanged}
+          @opened-changed=${this._openedChanged}
         ></ha-combo-box>
       `;
     }
@@ -273,13 +279,16 @@ export class HaSelectSelector extends LitElement {
     });
   }
 
+  private _openedChanged(ev?: CustomEvent): void {
+    if (ev?.detail.value) {
+      this._filterChanged();
+    }
+  }
+
   private _filterChanged(ev?: CustomEvent): void {
     this._filter = ev?.detail.value || "";
 
     const filteredItems = this.comboBox.items?.filter((item) => {
-      if (this.selector.select?.multiple && this.value?.includes(item.value)) {
-        return false;
-      }
       const label = item.label || item.value;
       return label.toLowerCase().includes(this._filter?.toLowerCase());
     });