๐Ÿ‘ฉโ€๐Ÿš’ Firefighters API written in Gleam!
lustre gleam

:truck: add prefix "view" for functions returning html elements

kacaii.dev 4664080e a89fad00

verified
+42 -48
+10 -14
client/src/client.gleam
··· 155 155 156 156 // VIEW ------------------------------------------------------------------------ 157 157 158 - fn render_page( 158 + fn view_page( 159 159 model: Model, 160 160 element_view: element.Element(a), 161 161 f: fn(a) -> Msg, ··· 171 171 case model { 172 172 // LANDING PAGE ------------------------------------------------------------ 173 173 Model(session:, route: route.Landing, page: page.Landing(page_model), ..) -> 174 - render_page(model, landing.view(session, page_model), LandingMsg) 174 + view_page(model, landing.view(session, page_model), LandingMsg) 175 175 176 176 // LOGIN PAGE -------------------------------------------------------------- 177 177 Model(session:, route: route.Login, page: page.Login(page_model), ..) -> 178 - render_page(model, login.view(session, page_model), LoginMsg) 178 + view_page(model, login.view(session, page_model), LoginMsg) 179 179 180 180 // DASHBOARD PAGE ---------------------------------------------------------- 181 181 Model( ··· 183 183 route: route.Dashboard, 184 184 page: page.Dashboard(page_model), 185 185 .., 186 - ) -> render_page(model, dashboard.view(session, page_model), DashboardMsg) 186 + ) -> view_page(model, dashboard.view(session, page_model), DashboardMsg) 187 187 188 188 // SIGNUP PAGE ------------------------------------------------------------- 189 189 Model(session:, route: route.Signup, page: page.Signup(page_model), ..) -> 190 - render_page(model, signup.view(session, page_model), SignupMsg) 190 + view_page(model, signup.view(session, page_model), SignupMsg) 191 191 192 192 // FALLBACK ---------------------------------------------------------------- 193 - model -> render_page(model, not_found.view(), NotFoundMsg) 193 + model -> view_page(model, not_found.view(), NotFoundMsg) 194 194 } 195 195 } 196 196 ··· 272 272 ) 273 273 274 274 login.ServerFailedToAuthenticate(err) -> { 275 - let error_message = case err { 276 - rsvp.NetworkError -> "Connection failed" 277 - rsvp.BadBody -> "Bad request body" 278 - rsvp.BadUrl(_) -> "Bad URL" 279 - rsvp.JsonError(_) -> "Failed to decode message" 280 - rsvp.UnhandledResponse(_) -> "Unhandled response" 275 + let message = case err { 281 276 rsvp.HttpError(resp) -> resp.body 277 + rsvp.NetworkError -> "Connection not available" 278 + _ -> "Failed to authenticate user" 282 279 } 283 280 284 281 let page = 285 - login.Model(..page_model, message: error_message, loading: False) 286 - |> page.Login 282 + login.Model(..page_model, message:, loading: False) |> page.Login 287 283 288 284 #(Model(..model, page:), effect.none()) 289 285 }
+1
client/src/client/page.gleam
··· 14 14 NotFound(not_found.Model) 15 15 } 16 16 17 + /// Starts the page model based on the current route 17 18 pub fn init(route: route.Route) -> Page { 18 19 case route { 19 20 route.Landing -> Landing(landing.empty)
+5 -8
client/src/client/page/dashboard.gleam
··· 26 26 27 27 html.div(attributes, [ 28 28 html.h2([], [html.text("Dashboard Page")]), 29 - quick_access(session), 29 + view_quick_access(session), 30 30 ]) 31 31 } 32 32 33 - fn quick_access(session: session.Session) -> element.Element(Msg) { 33 + fn view_quick_access(session: session.Session) -> element.Element(Msg) { 34 34 let ul_style = class("flex flex-col") 35 35 let anchor_style = class("flex gap-2 justify-center items-center") 36 36 let li_attributes = [ ··· 38 38 class("hover:cursor-pointer hover:border-accent hover:text-accent"), 39 39 ] 40 40 41 - let signup_element = signup_element(session, anchor_style) 42 - 43 - html.ul([ul_style], [ 44 - html.li(li_attributes, [signup_element]), 45 - ]) 41 + let signup_element = view_signup_item(session, anchor_style) 42 + html.ul([ul_style], [html.li(li_attributes, [signup_element])]) 46 43 } 47 44 48 - fn signup_element( 45 + fn view_signup_item( 49 46 session: session.Session, 50 47 anchor_style: attr.Attribute(Msg), 51 48 ) -> element.Element(Msg) {
+9 -9
client/src/client/page/login.gleam
··· 89 89 let content = [ 90 90 html.section(attributes, [ 91 91 html.div(container_attr, [ 92 - fieldset(model), 93 - button(model), 94 - message_text(model), 92 + view_fieldset(model), 93 + view_login_button(model), 94 + view_message_text(model), 95 95 ]), 96 96 ]), 97 97 ] ··· 99 99 element.fragment(content) 100 100 } 101 101 102 - fn button(model: Model) -> element.Element(Msg) { 102 + fn view_login_button(model: Model) -> element.Element(Msg) { 103 103 let attributes = [ 104 104 class("flex gap-2 justify-center items-center"), 105 105 class("p-2 text-white rounded-md bg-secondary"), ··· 126 126 html.button(attributes, [icon, html.text("Login")]) 127 127 } 128 128 129 - fn message_text(model: Model) -> element.Element(Msg) { 129 + fn view_message_text(model: Model) -> element.Element(Msg) { 130 130 let style = class("text-center text-white") 131 131 132 132 case model.message { ··· 135 135 } 136 136 } 137 137 138 - fn fieldset(model: Model) -> element.Element(Msg) { 138 + fn view_fieldset(model: Model) -> element.Element(Msg) { 139 139 let style = class("flex flex-col gap-2 w-full") 140 140 141 141 html.fieldset([style], [ 142 - text_input( 142 + view_text_input( 143 143 placeholder: "user@sigo.br", 144 144 value: model.email, 145 145 icon: "md-email", ··· 148 148 input_type: "email", 149 149 ), 150 150 151 - text_input( 151 + view_text_input( 152 152 placeholder: "************", 153 153 value: model.password, 154 154 icon: "fa-key", ··· 159 159 ]) 160 160 } 161 161 162 - fn text_input( 162 + fn view_text_input( 163 163 placeholder text: String, 164 164 value value: String, 165 165 icon icon: String,
+17 -17
client/src/client/page/signup.gleam
··· 65 65 66 66 pub fn view(_session: session.Session, model: Model) -> element.Element(Msg) { 67 67 let attributes = [class(header.offset), class("flex flex-col gap-4 w-full")] 68 - html.main(attributes, [form(model), user_preview(model)]) 68 + html.main(attributes, [view_form(model), view_user_card(model)]) 69 69 } 70 70 71 71 pub fn update(model: Model, msg: Msg) -> #(Model, effect.Effect(Msg)) { ··· 137 137 } 138 138 } 139 139 140 - fn form(model: Model) -> element.Element(Msg) { 140 + fn view_form(model: Model) -> element.Element(Msg) { 141 141 let attributes = [ 142 142 class("grid grid-cols-1 gap-4 items-center"), 143 143 class("p-4 m-auto w-full max-w-md"), ··· 145 145 ] 146 146 147 147 html.section(attributes, [ 148 - form_fieldset(model), 149 - form_button(model), 150 - form_text_message(model), 148 + view_form_fieldset(model), 149 + view_signup_button(model), 150 + view_form_text_message(model), 151 151 ]) 152 152 } 153 153 154 - fn form_text_message(model: Model) -> element.Element(Msg) { 154 + fn view_form_text_message(model: Model) -> element.Element(Msg) { 155 155 case model.text_message { 156 156 "" -> element.none() 157 157 text -> html.p([class("text-center text-white")], [html.text(text)]) 158 158 } 159 159 } 160 160 161 - fn form_button(model: Model) -> element.Element(Msg) { 161 + fn view_signup_button(model: Model) -> element.Element(Msg) { 162 162 let required_fields = [ 163 163 model.user_name, 164 164 model.user_email, ··· 196 196 html.button(attributes, [icon, html.text("Register")]) 197 197 } 198 198 199 - fn form_fieldset(model: Model) -> element.Element(Msg) { 199 + fn view_form_fieldset(model: Model) -> element.Element(Msg) { 200 200 let attributes = [class("flex flex-col gap-2")] 201 201 202 202 html.fieldset(attributes, [ 203 - text_input( 203 + view_form_text_input( 204 204 placeholder: "Name", 205 205 value: model.user_name, 206 206 icon: "fa-id_badge", ··· 208 208 on_input: UserUpdatedNameField, 209 209 ), 210 210 211 - text_input( 211 + view_form_text_input( 212 212 placeholder: "user@sigo.br", 213 213 value: model.user_email, 214 214 icon: "md-email", ··· 216 216 on_input: UserUpdatedEmailField, 217 217 ), 218 218 219 - text_input( 219 + view_form_text_input( 220 220 placeholder: "0000-0000", 221 221 value: model.user_phone, 222 222 icon: "fa-phone", ··· 224 224 on_input: UserUpdatedPhoneField, 225 225 ), 226 226 227 - text_input( 227 + view_form_text_input( 228 228 placeholder: "********", 229 229 value: model.user_password, 230 230 icon: "fa-key", ··· 232 232 on_input: UserUpdatedPasswordField, 233 233 ), 234 234 235 - text_input( 235 + view_form_text_input( 236 236 placeholder: "********", 237 237 value: model.user_confirm_password, 238 238 icon: "fa-key", ··· 240 240 on_input: UserUpdatedConfirmPasswordField, 241 241 ), 242 242 243 - role_selection(model), 243 + view_form_role_selection(model), 244 244 ]) 245 245 } 246 246 247 - fn role_selection(model: Model) -> element.Element(Msg) { 247 + fn view_form_role_selection(model: Model) -> element.Element(Msg) { 248 248 let attributes = [ 249 249 class("px-2 text-white rounded-md border border-surface"), 250 250 ··· 259 259 html.select(attributes, list.map(role.all, role_to_option)) 260 260 } 261 261 262 - fn text_input( 262 + fn view_form_text_input( 263 263 placeholder placeholder: String, 264 264 value value: String, 265 265 icon icon: String, ··· 296 296 ]) 297 297 } 298 298 299 - fn user_preview(model: Model) -> element.Element(Msg) { 299 + fn view_user_card(model: Model) -> element.Element(Msg) { 300 300 let placeholder_style = class("animate-pulse bg-surface") 301 301 302 302 let attributes = [