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

:dizzy: add loading state feedback by changing the cursor

kacaii.dev 4e0d8c81 605af83f

verified
+28 -5
+7 -2
client/src/client/page/login.gleam
··· 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"), 106 - class("hover:cursor-pointer hover:bg-accent hover:text-primary"), 106 + class("hover:bg-accent hover:text-primary"), 107 107 108 108 class("disabled:text-primary disabled:placeholder:text-surface"), 109 109 class("disabled:bg-surface"), 110 110 class("disabled:cursor-not-allowed"), 111 111 112 - attr.disabled(model.email == "" || model.password == "" || model.loading), 112 + case model.loading { 113 + True -> class("hover:cursor-progress") 114 + False -> class("hover:cursor-point") 115 + }, 116 + 117 + attr.disabled(model.email == "" || model.password == ""), 113 118 event.on_click(UserSentRequest), 114 119 ] 115 120
+7 -3
client/src/client/page/signup.gleam
··· 167 167 ] 168 168 169 169 let disabled = 170 - model.loading 171 - || model.user_password != model.user_confirm_password 170 + model.user_password != model.user_confirm_password 172 171 || list.any(required_fields, string.is_empty) 173 172 174 173 let icon = case model.loading { ··· 180 179 class("p-2 font-bold text-white rounded-md bg-secondary"), 181 180 class("flex gap-2 justify-center items-center"), 182 181 183 - class("hover:cursor-pointer hover:bg-accent hover:text-primary"), 182 + class("hover:bg-accent hover:text-primary"), 184 183 185 184 class("disabled:cursor-not-allowed"), 186 185 class("disabled:text-primary disabled:bg-surface"), 186 + 187 + case model.loading { 188 + True -> class("hover:cursor-progress") 189 + False -> class("hover:cursor-point") 190 + }, 187 191 188 192 event.on_click(UserSentRequest), 189 193 attr.disabled(disabled),
+14
justfile
··· 52 52 just init-database 53 53 just build-backend 54 54 just init-backend 55 + @echo {{ GREEN }}"Listening on http://0.0.0.0:8000"{{ NORMAL }} 55 56 57 + [group("podman")] 56 58 down: 57 59 podman pod stop {{ pod_name }} 58 60 podman pod rm {{ pod_name }} ··· 64 66 {{ pg_health_cmd }} {{ pg_health_conf }} {{ pg_health_start_period }} \ 65 67 {{ pg_volume }} {{ pg_image }} 66 68 69 + # Init the application container 67 70 [group("podman")] 68 71 @init-backend: 69 72 podman run -d \ ··· 72 75 -e DATABASE_URL -e SECRET_KEY \ 73 76 backend 74 77 78 + # Build application container 75 79 [group("podman")] 76 80 @build-backend: 77 81 podman build -t backend . 78 82 83 + # Create pod 79 84 [group("podman")] 80 85 @create-pod: 86 + podman pod exists {{ pod_name }} ||\ 81 87 podman pod create \ 82 88 --name {{ pod_name }} \ 83 89 -p 8000:8000 90 + 91 + # Creates a pod exposing the Database port 92 + [group("podman"), group("dev")] 93 + @create-pod-expose-db: 94 + podman pod exists {{ pod_name }} ||\ 95 + podman pod create \ 96 + --name {{ pod_name }} \ 97 + -p 5432:5432