Advice need on table/calendar creation

Hello everyone,

I’m creating a feature where the user can see its airbnb listing price day per day for a month.
Something like that:

So I was thinking of using a bootstrap table.
Pretty easy for the rows with a repeat row but how should I handle the dynamic column range (30/31 days per month)

I’m using a 3rd party api for the data and their output looks like this:

{
  "data": {
    "listing1": {
      "2019-01-15": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      },
      "2019-01-16": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      },
      "2019-01-17": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      }
    },
    "listing2": {
      "2019-01-15": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      },
      "2019-01-16": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      },
      "2019-01-17": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      }
    },
    "listing3": {
      "2019-01-15": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      },
      "2019-01-16": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      },
      "2019-01-17": {
        "price": 444,
        "min_length_of_stay": 2,
        "available": 1
      }
    }
  }
}

So I could easily do a repeat column by day for each row (listing).
But that would mean if I have for exemple 10 listings. I would have 10 repeat rows with each 30 repeat columns.

Would that be an issue or a mistake performance wise ?

Thanks a lot,

Community Page
Last updated: