all repos

onasty @ f6a62ba

a one-time notes service

onasty/web/src/Layouts/Header.elm(view raw) 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
 
module Layouts.Header exposing (Model, Msg, Props, layout)

import Auth.User
import Effect exposing (Effect)
import Html as H exposing (Html)
import Html.Attributes as A
import Html.Events as E
import Layout exposing (Layout)
import Route exposing (Route)
import Route.Path
import Shared
import View exposing (View)


type alias Props =
    {}


layout : Props -> Shared.Model -> Route () -> Layout () Model Msg contentMsg
layout _ shared _ =
    Layout.new
        { init = init
        , update = update
        , view = view shared
        , subscriptions = subscriptions
        }



-- MODEL


type alias Model =
    {}


init : () -> ( Model, Effect Msg )
init _ =
    ( {}, Effect.none )



-- UPDATE


type Msg
    = UserClickedLogout


update : Msg -> Model -> ( Model, Effect Msg )
update msg model =
    case msg of
        UserClickedLogout ->
            ( model, Effect.logout )


subscriptions : Model -> Sub Msg
subscriptions _ =
    Sub.none



-- VIEW


view : Shared.Model -> { toContentMsg : Msg -> contentMsg, content : View contentMsg, model : Model } -> View contentMsg
view shared { toContentMsg, content } =
    { title = content.title
    , body =
        [ viewHeader shared.user |> H.map toContentMsg
        , H.main_ [] content.body
        ]
    }


viewHeader : Auth.User.SignInStatus -> Html Msg
viewHeader user =
    H.header [ A.class "w-full border-b border-gray-200 bg-white" ]
        [ H.div [ A.class "max-w-7xl mx-auto px-4 sm:px-6 lg:px-8" ]
            [ H.div [ A.class "flex justify-between items-center h-16" ]
                [ H.div [ A.class "flex items-center" ]
                    [ H.a
                        [ A.class "text-lg font-semibold text-black hover:text-gray-700 transition-colors"
                        , Route.Path.href Route.Path.Home_
                        ]
                        [ H.text "Onasty" ]
                    ]
                , H.nav [ A.class "flex items-center space-x-6" ] (viewNav user)
                ]
            ]
        ]


viewNav : Auth.User.SignInStatus -> List (Html Msg)
viewNav user =
    case user of
        Auth.User.SignedIn _ ->
            viewSignedInNav

        Auth.User.NotSignedIn ->
            viewNotSignedInNav

        Auth.User.RefreshingTokens ->
            viewNotSignedInNav


viewSignedInNav : List (Html Msg)
viewSignedInNav =
    [ viewLink "Profile" Route.Path.Profile_Me
    , H.button
        [ A.class "text-gray-600 hover:text-red-600 transition-colors"
        , E.onClick UserClickedLogout
        ]
        [ H.text "Logout" ]
    ]


viewNotSignedInNav : List (Html Msg)
viewNotSignedInNav =
    -- TODO: or add about page, or delete the link
    [ viewLink "About" Route.Path.Home_
    , H.a
        [ A.class "px-4 py-2 border border-gray-300 rounded-md text-black hover:bg-gray-50 transition-colors"
        , Route.Path.href Route.Path.Auth
        ]
        [ H.text "Sign In/Up" ]
    ]


viewLink : String -> Route.Path.Path -> Html Msg
viewLink text path =
    H.a
        [ A.class "text-gray-600 hover:text-black transition-colors"
        , Route.Path.href path
        ]
        [ H.text text ]