Skip to content

Commit

Permalink
refactor: improve frontend code
Browse files Browse the repository at this point in the history
  • Loading branch information
@ghivert
ghivert committed Jul 23, 2024
1 parent 85865a7 commit a9e3c87
Show file tree
Hide file tree
Showing 3 changed files with 144 additions and 264 deletions.
166 changes: 40 additions & 126 deletions apps/frontend/src/frontend/view/body/body.gleam
View file
Original file line number Diff line number Diff line change
Expand Up @@ -145,122 +145,16 @@ fn sidebar(model: Model) {
]),
h.div([a.class("sidebar-filter")], [el.text("Filters")]),
h.div([a.class("sidebar-filters")], [
h.label([a.class("sidebar-filter-line")], [
el.fragment([
h.div(
[
a.class("sidebar-checkbox-1"),
a.style([
#("background", case model.keep_functions {
True -> "#ffaff3"
False -> "var(--input-background)"
}),
]),
],
[],
),
h.input([
a.class("sidebar-checkbox-2"),
a.type_("checkbox"),
a.checked(model.keep_functions),
e.on_check(msg.OnCheckFilter(msg.Functions, _)),
]),
]),
h.div([a.class("sidebar-filter-name")], [el.text("Functions")]),
]),
h.label([a.class("sidebar-filter-line")], [
el.fragment([
h.div(
[
a.class("sidebar-checkbox-1"),
a.style([
#("background", case model.keep_types {
True -> "#ffaff3"
False -> "var(--input-background)"
}),
]),
],
[],
),
h.input([
a.class("sidebar-checkbox-2"),
a.type_("checkbox"),
a.checked(model.keep_types),
e.on_check(msg.OnCheckFilter(msg.Types, _)),
]),
]),
h.div([a.class("sidebar-filter-name")], [el.text("Types")]),
]),
h.label([a.class("sidebar-filter-line")], [
el.fragment([
h.div(
[
a.class("sidebar-checkbox-1"),
a.style([
#("background", case model.keep_aliases {
True -> "#ffaff3"
False -> "var(--input-background)"
}),
]),
],
[],
),
h.input([
a.class("sidebar-checkbox-2"),
a.type_("checkbox"),
a.checked(model.keep_aliases),
e.on_check(msg.OnCheckFilter(msg.Aliases, _)),
]),
]),
h.div([a.class("sidebar-filter-name")], [el.text("Aliases")]),
]),
checkbox(model.keep_functions, msg.Functions, "Functions"),
checkbox(model.keep_types, msg.Types, "Types"),
checkbox(model.keep_aliases, msg.Aliases, "Aliases"),
h.div([a.class("filter-separator")], []),
h.label([a.class("sidebar-filter-line")], [
el.fragment([
h.div(
[
a.class("sidebar-checkbox-1"),
a.style([
#("background", case model.keep_documented {
True -> "#ffaff3"
False -> "var(--input-background)"
}),
]),
],
[],
),
h.input([
a.class("sidebar-checkbox-2"),
a.type_("checkbox"),
a.checked(model.keep_documented),
e.on_check(msg.OnCheckFilter(msg.Documented, _)),
]),
]),
h.div([a.class("sidebar-filter-name")], [el.text("Documented")]),
]),
h.label([a.class("sidebar-filter-line")], [
el.fragment([
h.div(
[
a.class("sidebar-checkbox-1"),
a.style([
#("background", case model.show_old_packages {
True -> "#ffaff3"
False -> "var(--input-background)"
}),
]),
],
[],
),
h.input([
a.class("sidebar-checkbox-2"),
a.type_("checkbox"),
a.checked(model.show_old_packages),
e.on_check(msg.OnCheckFilter(msg.ShowOldPackages, _)),
]),
]),
h.div([a.class("sidebar-filter-name")], [el.text("Show old versions")]),
]),
checkbox(model.keep_documented, msg.Documented, "Documented"),
checkbox(
model.show_old_packages,
msg.ShowOldPackages,
"Show old versions",
),
]),
h.div([a.class("sidebar-spacer")], []),
h.div([a.class("sidebar-links")], [
Expand All @@ -276,22 +170,42 @@ fn sidebar(model: Model) {
// s.sidebar_icon([], [icons.gift()]),
// s.sidebar_link([], [el.text("Resources")]),
// ]),
h.a(
[
a.class("sidebar-link-wrapper"),
a.href("https://github.com/sponsors/ghivert"),
a.target("_blank"),
a.rel("noreferrer noopener"),
],
[
h.div([a.class("sidebar-icon")], [icons.heart()]),
h.div([a.class("sidebar-link")], [el.text("Sponsor")]),
],
sidebar_link(
href: "https://github.com/sponsors/ghivert",
title: "Sponsor",
icon: icons.heart(),
),
]),
])
}

fn checkbox(active: Bool, msg: msg.Filter, name: String) {
let bg = case active {
True -> "#ffaff3"
False -> "var(--input-background)"
}
h.label([a.class("sidebar-filter-line")], [
el.fragment([
h.div([a.class("sidebar-checkbox-1"), a.style([#("background", bg)])], []),
h.input([
a.class("sidebar-checkbox-2"),
a.type_("checkbox"),
a.checked(active),
e.on_check(msg.OnCheckFilter(msg, _)),
]),
]),
h.div([a.class("sidebar-filter-name")], [el.text(name)]),
])
}

fn sidebar_link(href href: String, title title: String, icon icon) {
let class = a.class("sidebar-link-wrapper")
h.a([class, a.href(href), a.target("_blank"), a.rel("noreferrer noopener")], [
h.div([a.class("sidebar-icon")], [icon]),
h.div([a.class("sidebar-link")], [el.text(title)]),
])
}

pub fn body(model: Model) {
case model.route {
router.Home -> h.main([a.class("main")], [view_search_input(model)])
Expand Down
26 changes: 4 additions & 22 deletions apps/frontend/src/frontend/view/body/cache.gleam
View file
Original file line number Diff line number Diff line change
@@ -1,35 +1,17 @@
import data/implementations
import data/kind
import data/msg
import data/search_result
import frontend/colors/palette
import frontend/icons
import frontend/strings as frontend_strings
import frontend/view/body/signature
import frontend/view/documentation
import frontend/view/body/search_result as sr
import frontend/view/types as t
import gleam/bool
import gleam/coerce.{coerce}
import gleam/dict
import gleam/io
import gleam/list
import gleam/option
import lustre
import lustre/attribute as a
import lustre/effect as eff
import lustre/element as el
import lustre/element/html as h
import lustre/event as e
import sketch/lustre as sketch_lustre
import sketch/options as sketch_options

fn view_search_results(search_results: List(search_result.SearchResult)) {
el.fragment({
list.map(search_results, fn(item) {
el.element("search-result", [a.property("item", item)], [])
})
|> list.intersperse(h.div([a.class("search-result-separator")], []))
})
list.map(search_results, sr.view)
|> list.intersperse(h.div([a.class("search-result-separator")], []))
|> el.fragment
}

fn sidebar(
Expand Down
Loading

0 comments on commit a9e3c87

Please sign in to comment.