-module(docs@components@clock). -compile([no_auto_import, nowarn_unused_vars]). -export([format_time/2, clock/2]). -export_type([model/0, msg/0, clock_props/0]). -type model() :: {model, integer(), binary()}. -type msg() :: {update_time, integer()}. -type clock_props() :: {clock_props, gleam@option:option(binary()), gleam@option:option(gleam@erlang:time_unit())}. -spec update(model(), msg()) -> model(). update(Model, Msg) -> case Msg of {update_time, Time} -> erlang:setelement(2, Model, Time) end. -spec initial() -> model(). initial() -> {model, os:system_time(second), <<"UTC"/utf8>>}. -spec format_time(any(), binary()) -> binary(). format_time(Field@0, Field@1) -> 'Elixir.Sprocket':format_time(Field@0, Field@1). -spec clock(sprocket@context:context(), clock_props()) -> {sprocket@context:context(), list(sprocket@element:element())}. clock(Ctx, Props) -> {clock_props, Label, Time_unit} = Props, sprocket@hooks@reducer:reducer( Ctx, initial(), fun update/2, fun(Ctx@1, _use1) -> {state, {model, Time, _}, Dispatch} = _use1, sprocket@hooks@effect:effect( Ctx@1, fun() -> gleam@io:println(<<"Clock component mounted!"/utf8>>), none end, {with_deps, []}, fun(Ctx@2) -> Time_unit@1 = begin _pipe = Time_unit, gleam@option:unwrap(_pipe, second) end, sprocket@hooks@effect:effect( Ctx@2, fun() -> Interval_duration = case Time_unit@1 of millisecond -> 1; second -> 1000; _ -> 1000 end, Update_time = fun() -> Dispatch( {update_time, os:system_time(Time_unit@1)} ) end, Update_time(), Cancel = docs@utils@timer:interval( Interval_duration, Update_time ), {some, fun() -> Cancel() end} end, {with_deps, [sprocket@hooks:dep(Time), sprocket@hooks:dep(Time_unit@1)]}, fun(Ctx@3) -> Current_time = 'Elixir.Sprocket':format_time( Time, <<"%y-%m-%d %I:%M:%S %p"/utf8>> ), sprocket@component:render(Ctx@3, case Label of {some, Label@1} -> [sprocket@html:span( [], [sprocket@html:text(Label@1)] ), sprocket@html:span( [], [sprocket@html:text( Current_time )] )]; none -> [sprocket@html:text(Current_time)] end) end ) end ) end ).