DateRange is not syncronized to the backend

[ValentinKaisermayer]

using Stipple, StippleUI

@reactive mutable struct DatePickers <: ReactiveModel
    date::R{Date} = today() + Day(30)
    daterange::R{DateRange} = DateRange(today(), (today() + Day(3)))
end

function ui(model)
  [
    page(
      model,
      class = "container",
      title = "Bug",
      partial = true,
      core_theme = true,
      [
        row(cell([h1("Date picker")]))
        row(
          [
            cell([
                datepicker(:date), 
            ])
            cell([
                datepicker(:daterange, range = true),
            ])
          ],
        )
      ],
    ),
  ]
end

model = DatePickers |> init

route("/") do
    html(ui(model), context = @__MODULE__)
end

up()

Changing the date range via the REPL updates the view model.daterange[] = DateRange(Date("2022-07-01"), Date("2022-07-05")) but the other way around does not work model.daterange[].

  [c43c736e] Genie v4.18.1
  [4acbeb90] Stipple v0.24.4
  [ec984513] StipplePlotly v0.12.4
  [a3c5d34a] StippleUI v0.19.4

[AbhimanyuAryan]

yes looks like a bug. Thanks for reporting

[cwiese]

When I change dates via the UI and it does not fire the "on" model.daterange

[AbhimanyuAryan]

thanks for reporting. I think there's something off with DateRange. I'll work on it today and debug the problem

[cwiese]

I have this issue also :

using Revise
using Stipple, StipplePlotly, StippleUI
using PlotlyBase

@reactive! mutable struct Example <: ReactiveModel
    daterange::R{DateRange} = DateRange(Date(2022, 7, 7), Date(2022, 7, 14))
end

function ui(model::Example)
    page(model, class = "container", 
    row(class = "st-module", [
        datepicker(
            :daterange, range = true,
            ),
    ]))
end

function handlers(model)
  on(model.isready) do isready
      isready || return
      push!(model)
  end

  on(model.daterange) do data
      @info "datarange" daterange
  end

  return model
end

model = init(Example, debounce=0)

route("/") do
    model |> handlers |> ui |> html
end

up(8000)

[cwiese]

never fires change in observer

[ValentinKaisermayer]

It seems to be that the back channel (view to backend) does not work properly.

[cwiese]

if I programmatically set the daterange[] it fires the observer. I was thinking the widget needs to "close" or "okay" when it sets new daterange. I have not look yet - but I intend to.

[ValentinKaisermayer]

Maybe something goes wrong in the update https://github.com/GenieFramework/Stipple.jl/blob/master/src/Stipple.jl#L836

[hhaensel]

This is meanwhile fixed. A modern app would look like this

using Stipple, StippleUI

@app begin
    @in date = today() + Day(30)
    @in daterange = DateRange(today(), (today() + Day(3)))

    @onchange date begin
        @notify("Date changed to: $date")
    end

    @onchange daterange begin
        @notify("Date range changed to: $daterange")
    end
end

ui() = [
    row(cell([h1("Date picker")]))
    row([
        cell(datepicker(:date))
        cell(datepicker(:daterange, range = true))
    ])
]

@page("/", ui, layout = Stipple.ReactiveTools.DEFAULT_LAYOUT(title = "Date Picker"))

up()

[hhaensel]