sprocket

-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
    ).