kjuulh/como-web
1
0
Fork 0
Code Issues 1 Pull Requests 5 Packages Projects Releases Wiki Activity

feat: update to newest leptos

Browse Source 
Signed-off-by: kjuulh <contact@kjuulh.io>
This commit is contained in:
Kasper Juul Hermansen 2023-10-20 23:06:21 +02:00
parent 8ee2ca5c14
commit a7986e304c
Signed by: kjuulh
GPG Key ID: 57B6E1465221F912
15 changed files with 733 additions and 831 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1325
Cargo.lock generated
View File

File diff suppressed because it is too large Load Diff

16
Cargo.toml
View File

@ -19,18 +19,18 @@ console_error_panic_hook = "0.1"
console_log = "0.2"
cfg-if = "1"
lazy_static = "1"
leptos = { version = "*", default-features = false, features = ["serde"] }
leptos_dom = { version = "*", default-features = false }
leptos_meta = { version = "*", default-features = false }
leptos_axum = { version = "*", default-features = false, optional = true }
leptos_router = { version = "*", default-features = false }
leptos = { version = "*", features = ["serde"] }
leptos_dom = { version = "*" }
leptos_meta = { version = "*" }
leptos_axum = { version = "*", optional = true }
leptos_router = { version = "*" }
log = "0.4"
simple_logger = "4"
thiserror = "1"
axum = { version = "0.6.1", optional = true }
tower = { version = "0.4.13", optional = true }
tower-http = { version = "0.3.4", features = ["fs"], optional = true }
tokio = { version = "1", features = ["time"], optional = true }
tokio = { version = "1", features = ["rt-multi-thread", "macros", "time"], optional = true }
wasm-bindgen = "0.2"
tracing-subscriber = { version = "0.3.16", optional = true, features = [
"env-filter",
@ -61,6 +61,10 @@ ssr = [
"dep:tracing",
]
[package.metadata.cargo-all-features]
denylist = ["axum", "tower", "tower-http", "tokio", "sqlx", "leptos_axum"]
skip_feature_sets = [["ssr", "hydrate"]]
[package.metadata.leptos]
# The name used by wasm-bindgen/cargo-leptos for the JS/WASM bundle. Defaults to the crate name
output-name = "como_web"

18
scripts/dev.sh
View File

@ -1,20 +1,6 @@
#!/bin/bash
tmux new-window -n dev
zellij run -- sh -c "cuddle x leptos:dev"
# allow for user input
tmux split-window -h
# leptos
tmux send-keys -t dev "cuddle x leptos:dev" C-m
tmux split-window -v
# tailwind
tmux send-keys -t dev "cuddle x tailwind:watch" C-m
# set user input to first
tmux select-pane -t 0
tmux attach-session -t dev
zellij run -- sh -c "cuddle x tailwind:watch"

26
src/app.rs
View File

@ -8,44 +8,44 @@ use crate::routes::features_view::FeaturesView;
use crate::routes::home::HomePage;
#[component]
pub fn App(cx: Scope) -> impl IntoView {
pub fn App() -> impl IntoView {
// Provides context that manages stylesheets, titles, meta tags, etc.
provide_meta_context(cx);
provide_meta_context();
view! { cx,
view! {
<Stylesheet id="leptos" href="/pkg/como_web.css"/>
<Router>
<main>
<Routes>
<Route
path=""
view=|cx| {
view! { cx, <HomePage/> }
view=|| {
view! { <HomePage/> }
}
/>
<Route
path="/dash"
view=|cx| {
view! { cx, <DashboardLayout/> }
view=|| {
view! { <DashboardLayout/> }
}
>
<Route
path=""
view=|cx| {
view! { cx, <DashHomePage/> }
view=|| {
view! { <DashHomePage/> }
}
/>
<Route
path="home"
view=|cx| {
view! { cx, <DashHomePage/> }
view=|| {
view! { <DashHomePage/> }
}
/>
</Route>
<Route
path="/features"
view=|cx| {
view! { cx, <FeaturesView/> }
view=|| {
view! { <FeaturesView/> }
}
/>
</Routes>

8
src/common/layout.rs
View File

@ -5,8 +5,8 @@ use crate::features::command_line::CommandLine;
use crate::features::navbar_projects::NavbarProjects;
#[component]
pub fn DashNav(cx: Scope) -> impl IntoView {
view! { cx,
pub fn DashNav() -> impl IntoView {
view! {
<nav class="min-w-[200px] p-4 space-y-4 h-screen sticky top-0 select-none bg-gray-800">
<div>
<a href="/dash/home" class="text-xl">
@ -35,8 +35,8 @@ pub fn DashNav(cx: Scope) -> impl IntoView {
}
#[component]
pub fn DashboardLayout(cx: Scope) -> impl IntoView {
view! { cx,
pub fn DashboardLayout() -> impl IntoView {
view! {
<div class="flex flex-row">
<DashNav/>
<div id="content" class="px-0.5 flex-grow">

12
src/fallback.rs
View File

@ -3,19 +3,17 @@ use cfg_if::cfg_if;
cfg_if! { if #[cfg(feature = "ssr")] {
use axum::{
body::{boxed, Body, BoxBody},
extract::Extension,
extract::State,
response::IntoResponse,
http::{Request, Response, StatusCode, Uri},
};
use axum::response::Response as AxumResponse;
use tower::ServiceExt;
use tower_http::services::ServeDir;
use std::sync::Arc;
use leptos::{LeptosOptions, Errors, view};
use crate::app::{App, AppProps};
use leptos::{LeptosOptions, view};
use crate::app::App;
pub async fn file_and_error_handler(uri: Uri, Extension(options): Extension<Arc<LeptosOptions>>, req: Request<Body>) -> AxumResponse {
let options = &*options;
pub async fn file_and_error_handler(uri: Uri, State(options): State<LeptosOptions>, req: Request<Body>) -> AxumResponse {
let root = options.site_root.clone();
let res = get_static_file(uri.clone(), &root).await.unwrap();
@ -24,7 +22,7 @@ cfg_if! { if #[cfg(feature = "ssr")] {
} else{
let handler = leptos_axum::render_app_to_stream(
options.to_owned(),
move |cx| view!{ cx, <App/> }
move || view!{ <App/> }
);
handler(req).await.into_response()
}

32
src/features/command_line/mod.rs
View File

@ -6,50 +6,50 @@ pub struct CommandLineState {
}
#[component]
pub fn CommandLineModalView(cx: Scope) -> impl IntoView {
view! { cx, <div>"modal"</div> }
pub fn CommandLineModalView() -> impl IntoView {
view! { <div>"modal"</div> }
}
#[component]
pub fn CommandLineModal(cx: Scope) -> impl IntoView {
pub fn CommandLineModal() -> impl IntoView {
let state =
use_context::<RwSignal<CommandLineState>>(cx).expect("command line state must be provided");
use_context::<RwSignal<CommandLineState>>().expect("command line state must be provided");
let (hidden, _) = create_slice(cx, state, |state| state.hidden, |state, n| state.hidden = n);
let (hidden, _) = create_slice(state, |state| state.hidden, |state, n| state.hidden = n);
view! { cx,
view! {
{move || {
if !hidden.get() {
view! { cx, <CommandLineModalView/> }
view! { <CommandLineModalView/> }
} else {
view! { cx, }
view! { }.into_view()
}
}}
}
}
#[component]
pub fn CommandLine(cx: Scope, children: Children) -> impl IntoView {
let state = create_rw_signal(cx, CommandLineState { hidden: true });
provide_context(cx, state);
pub fn CommandLine(children: Children) -> impl IntoView {
let state = create_rw_signal(CommandLineState { hidden: true });
provide_context(state);
let (hidden, set_hidden) =
create_slice(cx, state, |state| state.hidden, |state, n| state.hidden = n);
create_slice(state, |state| state.hidden, |state, n| state.hidden = n);
leptos_dom::helpers::window_event_listener(ev::keypress, move |event| {
if event.ctrl_key() {
match event.code().as_str() {
"KeyK" => {
set_hidden(!hidden.get());
log!("toggle command")
set_hidden.set(!hidden.get());
//log!("toggle command")
}
_ => {}
}
}
});
view! { cx,
view! {
<div>
<div>{children(cx)}</div>
<div>{children()}</div>
<CommandLineModal/>
</div>
}

36
src/features/dashboard_list_view/dashboard_list_view.rs
View File

@ -24,16 +24,13 @@ pub async fn get_projects_list() -> anyhow::Result<Vec<GetProjectsListViewGetPro
}
#[component]
pub fn DashboardItemView(cx: Scope, item: GetProjectsListViewGetProjectsItems) -> impl IntoView {
view! { cx, <div class="dashboard-list-item dashboard-item">{item.title}</div> }
pub fn DashboardItemView(item: GetProjectsListViewGetProjectsItems) -> impl IntoView {
view! { <div class="dashboard-list-item dashboard-item">{item.title}</div> }
}
#[component]
pub fn DashboardProjectItemView(
cx: Scope,
project: GetProjectsListViewGetProjects,
) -> impl IntoView {
view! { cx,
pub fn DashboardProjectItemView(project: GetProjectsListViewGetProjects) -> impl IntoView {
view! {
<div class="dashboard-list-item dashboard-list-project">
<a href=format!("/dash/project/{}", & project.id) class="project-item flex flex-row">
<div class="space-x-2">
@ -48,20 +45,24 @@ pub fn DashboardProjectItemView(
#[component]
pub fn DashboardListView(
cx: Scope,
projects: Resource<(), Vec<GetProjectsListViewGetProjects>>,
) -> impl IntoView {
let projects_view = move || {
projects.with(cx, |projects| {
projects.with(|projects| {
if projects.is_none() {
return Vec::new();
}
let projects = projects.as_ref().unwrap();
if projects.is_empty() {
return vec![view! { cx, <div class="project-item">"No projects"</div> }.into_any()];
return vec![view! { <div class="project-item">"No projects"</div> }.into_any()];
}
projects
.into_iter()
.filter(|project| !project.items.is_empty())
.map(|project| {
view! { cx,
view! {
<div>
<DashboardProjectItemView project=project.clone()/>
{&project
@ -69,10 +70,10 @@ pub fn DashboardListView(
.clone()
.into_iter()
.map(|item| {
view! { cx, <DashboardItemView item=item/> }
view! { <DashboardItemView item=item/> }
})
.collect::<Vec<_>>()
.into_view(cx)}
.into_view()}
</div>
}
.into_any()
@ -81,13 +82,12 @@ pub fn DashboardListView(
})
};
view! { cx, <div class="project-items">{projects_view}</div> }
view! {<div class="project-items">{projects_view}</div> }
}
#[component]
pub fn DashboardList(cx: Scope) -> impl IntoView {
let projects =
create_local_resource(cx, || (), |_| async { get_projects_list().await.unwrap() });
pub fn DashboardList() -> impl IntoView {
let projects = create_local_resource(|| (), |_| async { get_projects_list().await.unwrap() });
view! { cx, <DashboardListView projects=projects/> }
view! {<DashboardListView projects=projects/> }
}

20
src/features/navbar_projects/navbar_projects.rs
View File

@ -25,20 +25,24 @@ pub async fn get_projects_list() -> anyhow::Result<Vec<GetProjectsListViewGetPro
#[component]
pub fn NavbarProjectsView(
cx: Scope,
projects: Resource<(), Vec<GetProjectsListViewGetProjects>>,
) -> impl IntoView {
let projects_view = move || {
projects.with(cx, |projects| {
projects.with(|projects| {
if projects.is_none() {
return Vec::new()
}
let projects = projects.as_ref().unwrap();
if projects.is_empty() {
return vec![view! { cx, <div class="project-item">"No projects"</div> }.into_any()];
return vec![view! { <div class="project-item">"No projects"</div> }.into_any()];
}
projects
.into_iter()
.map(|project| {
view! { cx,
view! {
<a href=format!("/dash/project/{}", & project.id) class="project-item">
@ -53,13 +57,13 @@ pub fn NavbarProjectsView(
})
};
view! { cx, <div class="project-items space-y-1">{projects_view}</div> }
view! { <div class="project-items space-y-1">{projects_view}</div> }
}
#[component]
pub fn NavbarProjects(cx: Scope) -> impl IntoView {
pub fn NavbarProjects() -> impl IntoView {
let projects =
create_local_resource(cx, || (), |_| async { get_projects_list().await.unwrap() });
create_local_resource(|| (), |_| async { get_projects_list().await.unwrap() });
view! { cx, <NavbarProjectsView projects=projects/> }
view! { <NavbarProjectsView projects=projects/> }
}

4
src/lib.rs
View File

@ -19,8 +19,8 @@ if #[cfg(feature = "hydrate")] {
console_error_panic_hook::set_once();
leptos::mount_to_body(move |cx| {
view! { cx, <App/> }
leptos::mount_to_body(move || {
view! { <App/> }
});
}
}

8
src/main.rs
View File

@ -18,19 +18,19 @@ async fn main() {
let addr = conf.leptos_options.site_addr;
let leptos_options = conf.leptos_options;
// Generate the list of routes in your Leptos App
let routes = generate_route_list(|cx| view! { cx, <App/> }).await;
let routes = generate_route_list(App);
como_web::api::register();
let app = Router::new()
.route("/api/*fn_name", post(leptos_axum::handle_server_fns))
.leptos_routes(leptos_options.clone(), routes, |cx| view! { cx, <App/> })
.leptos_routes(&leptos_options.clone(), routes, || view! { <App/> })
.fallback(file_and_error_handler)
.layer(Extension(Arc::new(leptos_options)));
.with_state(leptos_options);
// run our app with hyper
// `axum::Server` is a re-export of `hyper::Server`
log!("listening on http://{}", &addr);
// log!("listening on http://{}", &addr);
axum::Server::bind(&addr)
.serve(app.into_make_service())
.await

4
src/routes/dash/home.rs
View File

@ -3,8 +3,8 @@ use leptos::*;
use crate::features::dashboard_list_view::DashboardList;
#[component]
pub fn DashHomePage(cx: Scope) -> impl IntoView {
view! { cx,
pub fn DashHomePage() -> impl IntoView {
view! {
<div class="home-dash">
<DashboardList/>
</div>

7
src/routes/features_view.rs
View File

@ -5,9 +5,8 @@ use crate::features::navbar_projects::gen::queries::get_projects_list_view::GetP
use crate::features::navbar_projects::NavbarProjectsView;
#[component]
pub fn FeaturesView(cx: Scope) -> impl IntoView {
pub fn FeaturesView() -> impl IntoView {
let projects = create_local_resource(
cx,
|| (),
|_| async {
vec![
@ -24,9 +23,9 @@ pub fn FeaturesView(cx: Scope) -> impl IntoView {
);
let emptyProjects: Resource<(), Vec<GetProjectsListViewGetProjects>> =
create_local_resource(cx, || (), |_| async { Vec::new() });
create_local_resource(|| (), |_| async { Vec::new() });
view! { cx,
view! {
<div>
<div class="space-y-5 p-2">
<h1>"NavbarProjects"</h1>

8
src/routes/home.rs
View File

@ -1,8 +1,8 @@
use leptos::*;
#[component]
pub fn Navbar(cx: Scope) -> impl IntoView {
view! { cx,
pub fn Navbar() -> impl IntoView {
view! {
<div class="flex flex-row justify-between items-center bg-gray-800 p-4">
<div class="flex flex-row items-center">
<div class="text-2xl text-white font-bold">"Como - Todo"</div>
@ -19,8 +19,8 @@ pub fn Navbar(cx: Scope) -> impl IntoView {
}
#[component]
pub fn HomePage(cx: Scope) -> impl IntoView {
view! { cx,
pub fn HomePage() -> impl IntoView {
view! {
<Navbar/>
<h1 class="text-xl text-red-50">"Welcome to Leptos!"</h1>
}

14
style/output.css
View File

@ -1,5 +1,5 @@
/*
! tailwindcss v3.3.2 | MIT License | https://tailwindcss.com
! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com
*/
/*
@ -191,6 +191,10 @@ select,
textarea {
font-family: inherit;
/* 1 */
font-feature-settings: inherit;
/* 1 */
font-variation-settings: inherit;
/* 1 */
font-size: 100%;
/* 1 */
font-weight: inherit;
@ -341,6 +345,14 @@ menu {
padding: 0;
}
/*
Reset default styling for dialogs.
*/
dialog {
padding: 0;
}
/*
Prevent resizing textareas horizontally by default.
*/