Format date flex-table-card when data is from a list

Configuration
1

I am new to this type of card and would like to format the date so that only the time is shown HH:MM rather than 2024-08-14T08:15:00+01:00

due: "2024-08-14T08:15:00+01:00"
service_ref: "0"
service_number: 48x
destination: City Centre, The Ce
is_live: true
stop: 0170SGB20002
buses:
  - due: "2024-08-14T08:15:00+01:00"
    service_ref: "0"
    service_number: 48x
    destination: City Centre, The Ce
    is_live: true
  - due: "2024-08-14T08:31:00+01:00"
    service_ref: "0"
    service_number: 48x
    destination: City Centre, The Ce
    is_live: true
  - due: "2024-08-14T08:31:00+01:00"
    service_ref: "0"
    service_number: 49x
    destination: City Centre, The Ce
    is_live: true
  - due: "2024-08-14T08:54:00+01:00"
    service_ref: "0"
    service_number: 49x
    destination: City Centre, The Ce
    is_live: true
  - due: "2024-08-14T09:17:00+01:00"
    service_ref: "0"
    service_number: 48x
    destination: City Centre, The Ce
    is_live: true
  - due: "2024-08-14T09:27:00+01:00"
    service_ref: "0"
    service_number: 49x
    destination: City Centre, The Ce
    is_live: false
  - due: "2024-08-14T09:46:00+01:00"
    service_ref: "0"
    service_number: 48x
    destination: City Centre, The Ce
    is_live: true
  - due: "2024-08-14T09:55:00+01:00"
    service_ref: "0"
    service_number: 49x
    destination: City Centre, The Ce
    is_live: true
data_last_updated: "2024-08-14T08:07:46.289190+01:00"
unit_of_measurement: minutes
icon: mdi:bus
friendly_name: First Bus Next Bus

and this is my card currently

type: custom:flex-table-card
clickable: true
sort_by: due
max_rows: 4
entities:
  include: sensor.first_bus*
columns:
  - name: Route
    data: buses
    modify: x.service_number
  - name: Due
    data: buses
    modify: x.due
    id: due
2

searching the forum could have brough you this

Flex-table-card - Share your Projects! / Dashboards & Frontend - Home Assistant Community (home-assistant.io)

3

i have looked at that code but couldnt get it to work, thats why i am asking for more help

i added this to the bottom of my code where the modify already is but it produced an error.

modify: |-
        if(x.length == 0)
        {"-"}
        else {
          var date = new Date(x);
          String(date.getDate()).padStart(2,'0')+"/"+
          (String(date.getMonth()+ 1).padStart(2,'0'))+"/"+
          date.getFullYear()+
          " "+
          String(date.getHours()).padStart(2,'0')+":"+
          String(date.getMinutes()).padStart(2,'0')+":"+
          String(date.getSeconds()).padStart(2,'0')
        }
4

Likely because you are within a attribute… pls post the whole code

EDIT: probably you need to use x.due instead of x

5 
type: custom:flex-table-card
clickable: true
sort_by: due
max_rows: 4
entities:
  include: sensor.first_bus*
columns:
  - name: Route
    data: buses
    modify: x.service_number
  - name: Due
    id: due
    data: buses
    modify: x.due |-
        if(x.length == 0)
        {"-"}
        else {
          var date = new Date(x);
          String(date.getDate()).padStart(2,'0')+"/"+
          (String(date.getMonth()+ 1).padStart(2,'0'))+"/"+
          date.getFullYear()+
          " "+
          String(date.getHours()).padStart(2,'0')+":"+
          String(date.getMinutes()).padStart(2,'0')+":"+
          String(date.getSeconds()).padStart(2,'0')
        }

I get an error
expected expression, got keyword ‘if’

6

try x.due.length and change the other x to x.due as x equals ‘buses’ and you need x.due as key

7

Amazing, thanks so much. That sorted it out and removed the date bits to just get the time.

    modify: |-
      if(x.due.length == 0)
      {"-"}
      else {
      var date = new Date(x.due);
       " "+
      String(date.getHours()).padStart(2,'0')+":"+
      String(date.getMinutes()).padStart(2,'0')
      }