kacaii.dev / bfd-front
this repo has no description
lustre frontent oat-ui gleam
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

๐Ÿ’„ Render spinner while waiting for authentication

kacaii.dev 413d6587 1bbcb92d

+52 -29
+52 -29
src/client/page/navbar.gleam
··· 1 1 import client/icon 2 2 import client/language 3 + import client/route 3 4 import client/session 4 5 import gleam/list 5 6 import lustre/attribute.{class} as attr ··· 12 13 } 13 14 14 15 pub fn view( 15 - _session: session.Session, 16 + session: session.Session, 16 17 lang: language.Language, 17 18 ) -> element.Element(Msg) { 18 - html.nav( 19 - [attr.data("topnav", ""), class("flex justify-between h-full border-b")], 20 - [ 21 - view_left_section(), 22 - view_middle_section(), 23 - view_right_section(lang), 24 - ], 25 - ) 19 + let style = class("flex justify-between h-full border-b md:py-4 md:px-24") 20 + html.nav([attr.data("topnav", ""), style], [ 21 + view_left_section(), 22 + view_middle_section(), 23 + view_right_section(session, lang), 24 + ]) 26 25 } 27 26 28 27 fn view_left_section() -> element.Element(Msg) { 29 - html.section([class("flex gap-2 items-center")], [ 28 + html.section([], [ 30 29 // Toggle button 31 30 icon.leaf([ 32 31 class("border-none hover:cursor-pointer stroke-emerald-500 size-8"), 33 32 attr.data("sidebar-toggle", ""), 34 33 ]), 35 34 36 - // ๏ฌ Logo 37 - icon.leaf([ 38 - class("hidden p-2 text-white md:inline size-10"), 39 - class("from-green-500 via-emerald-500 to-teal-600 bg-linear-to-r"), 40 - class("rounded-md drop-shadow-md"), 35 + // Logo with Title 36 + html.div([class("hidden gap-2 items-center md:flex")], [ 37 + // ๏ฌ Logo 38 + icon.leaf([ 39 + class("hidden p-2 text-white md:inline size-10"), 40 + class("from-green-500 via-emerald-500 to-teal-600 bg-linear-to-r"), 41 + class("rounded-lg drop-shadow-md"), 42 + ]), 43 + 44 + // ๎™Ž Title 45 + html.p( 46 + [ 47 + class("hidden my-0 text-xl font-bold md:inline"), 48 + // Gradient 49 + class("text-transparent bg-clip-text"), 50 + class("from-green-600 to-teal-600 bg-linear-to-r"), 51 + ], 52 + [html.text("Vรฉrtis Climate")], 53 + ), 41 54 ]), 42 - 43 - // ๎™Ž Title 44 - html.p( 45 - [ 46 - class("hidden my-0 text-2xl font-bold md:inline"), 47 - // Gradient 48 - class("text-transparent bg-clip-text"), 49 - class("from-green-600 to-teal-600 bg-linear-to-r"), 50 - ], 51 - [html.text("Vรฉrtis Climate")], 52 - ), 53 55 ]) 54 56 } 55 57 56 58 fn view_middle_section() -> element.Element(Msg) { 57 59 let a_style = class("hover:cursor-pointer") 58 - html.section([class("hidden space-x-4 text-sm text-gray-500 md:inline")], [ 60 + html.section([class("hidden space-x-4 text-gray-500 md:inline")], [ 59 61 html.a([a_style], [html.text("Soluรงรตes")]), 60 62 html.a([a_style], [html.text("Como Funciona")]), 61 63 html.a([a_style], [html.text("Benefรญcios")]), ··· 71 73 language.Spanish, 72 74 ] 73 75 74 - fn view_right_section(lang: language.Language) -> element.Element(Msg) { 76 + fn view_right_section( 77 + session: session.Session, 78 + lang: language.Language, 79 + ) -> element.Element(Msg) { 75 80 let id = "lang-selection" 76 81 77 - html.section([], [ 82 + html.section([class("flex gap-2 items-center")], [ 78 83 // Language Selection 79 84 element.element("ot-dropdown", [], [ 80 85 // Button ··· 96 101 }), 97 102 ), 98 103 ]), 104 + 105 + // Login link 106 + case session { 107 + session.Authenticated(_) -> 108 + html.a([attr.href(route.to_path(route.Dashboard))], [ 109 + html.text("Dashboard"), 110 + ]) 111 + 112 + session.None -> 113 + html.a([attr.href(route.to_path(route.Login))], [html.text("Login")]) 114 + 115 + session.Pending(..) -> 116 + html.div([class("flex gap-2 items-center")], [ 117 + // ๏„ Render spinner when waiting for Authentication. 118 + html.span([attr.aria_busy(True), attr.data("spinner", "small")], []), 119 + html.p([], [html.text("Loading")]), 120 + ]) 121 + }, 99 122 ]) 100 123 }