Use folder-card. Refactor youtube play scripts

config/lovelace/home_dashboard/07_media.yaml

@@ -4,38 +4,47 @@ panel: false
 icon: mdi:youtube
 badges: []
 cards:
-  - type: entities
-    style: |
-      ha-icon {
-        color: red;
-      }
-    title: Youtube controls
-    icon: mdi:youtube
-    show_header_toggle: false
-    entities:
-      - entity: input_text.youtube_download_url
-        type: "custom:text-input-row"
-      - entity: input_text.youtube_download_name
-        type: "custom:text-input-row"
-
-  - type: horizontal-stack
+  - type: vertical-stack
     cards:
-      - type: entity-button
-        entity: script.youtube_download_selected
-        name: Download
-        icon: mdi:download
-        icon_height: 48px
+      - type: entities
+        style: |
+          ha-icon {
+            color: red;
+          }
+        title: Youtube controls
+        icon: mdi:youtube
+        show_header_toggle: false
+        entities:
+          - entity: input_text.youtube_download_url
+            type: "custom:text-input-row"
+          - entity: input_text.youtube_download_name
+            type: "custom:text-input-row"
+
+      - type: horizontal-stack
+        cards:
+          - type: entity-button
+            entity: script.youtube_download_selected
+            name: Download
+            icon: mdi:download
+            icon_height: 48px
+            tap_action:
+              action: call-service
+              service: script.youtube_download_selected
+          - type: entity-button
+            entity: script.youtube_download_and_play
+            name: Download & Play
+            icon: mdi:youtube-tv
+            icon_height: 48px
+            tap_action:
+              action: call-service
+              service: script.youtube_download_and_play
+      - type: custom:folder-card
+        entity: sensor.youtube
+        title: Available Youtube
+        icon: "mdi:youtube"
         tap_action:
           action: call-service
-          service: script.youtube_download_selected
-      - type: entity-button
-        entity: script.youtube_download_and_play
-        name: Download & Play
-        icon: mdi:youtube-tv
-        icon_height: 48px
-        tap_action:
-          action: call-service
-          service: script.youtube_download_and_play
+          service: script.youtube_play_file
 
   - type: custom:config-template-card
     entities:
@@ -54,8 +63,10 @@ cards:
             service: script.youtube_play_latest_pds
         - type: custom:text-element
           text: "${states['sensor.philip_defranco'].state}"
-
-        - type: custom:text-element
-          text: "Available:"
-        - type: custom:text-element
-          text: "${states['sensor.pds'].attributes.file_list.join('<br />')}"
+        - type: custom:folder-card
+          entity: sensor.pds
+          title: Available PDS
+          icon: "mdi:youtube"
+          tap_action:
+            action: call-service
+            service: script.youtube_play_file

config/lovelace/resources.yaml

@@ -40,3 +40,5 @@
   url: /hacsfiles/travel-time-card/travel-time-card.js
 - type: module
   url: /hacsfiles/weather-card/weather-card.js
+- type: module
+  url: /hacsfiles/lovelace-folder-card/folder-card.js