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

feat: add feature slicing

Browse Source 
Signed-off-by: kjuulh <contact@kjuulh.io>
This commit is contained in:
Kasper Juul Hermansen
2023-06-05 12:54:07 +02:00
parent 74a16b4d7c
commit 36e2766bb9
24 changed files with 526 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/graphql/schema/schema.json
View File

@@ -1735,4 +1735,4 @@
]
}
}
}
}

61
src/app.rs
View File

@@ -2,41 +2,54 @@ use leptos::*;
use leptos_meta::*;
use leptos_router::*;
use crate::common::layout::DashboardLayout;
use crate::routes::dash::home::DashHomePage;
use crate::routes::features_view::FeaturesView;
use crate::routes::home::HomePage;
#[component]
pub fn App(cx: Scope) -> impl IntoView {
// Provides context that manages stylesheets, titles, meta tags, etc.
provide_meta_context(cx);
view! {
cx,
// injects a stylesheet into the document <head>
// id=leptos means cargo-leptos will hot-reload this stylesheet
view! { cx,
<Stylesheet id="leptos" href="/pkg/como_web.css"/>
// sets the document title
<Title text="Welcome to Leptos"/>
// content for this welcome page
<Router>
<main>
<Routes>
<Route path="" view=|cx| view! { cx, <HomePage/> }/>
<Route
path=""
view=|cx| {
view! { cx, <HomePage/> }
}
/>
<Route
path="/dash"
view=|cx| {
view! { cx, <DashboardLayout/> }
}
>
<Route
path=""
view=|cx| {
view! { cx, <DashHomePage/> }
}
/>
<Route
path="home"
view=|cx| {
view! { cx, <DashHomePage/> }
}
/>
</Route>
<Route
path="/features"
view=|cx| {
view! { cx, <FeaturesView/> }
}
/>
</Routes>
</main>
</Router>
}
}
/// Renders the home page of your application.
#[component]
fn HomePage(cx: Scope) -> impl IntoView {
// Creates a reactive value to update the button
let (count, set_count) = create_signal(cx, 0);
let on_click = move |_| set_count.update(|count| *count += 1);
view! { cx,
<h1 class="text-xl text-red-50">"Welcome to Leptos!"</h1>
<button on:click=on_click>"Click Me: " {count}</button>
}
}

2
src/common.rs Normal file
View File

@@ -0,0 +1,2 @@
pub mod layout;
pub mod graphql;

1
src/common/graphql/mod.rs Normal file
View File

@@ -0,0 +1 @@
pub type UUID = uuid::Uuid;

46
src/common/layout.rs Normal file
View File

@@ -0,0 +1,46 @@
use leptos::*;
use leptos_router::*;
use crate::features::navbar_projects::NavbarProjects;
#[component]
pub fn DashNav(cx: Scope) -> impl IntoView {
view! { cx,
<nav class="absolute min-w-[200px] p-4 space-y-4 h-screen sticky top-0 select-none">
<div>
<a href="/dash/home" class="text-xl">
"como"
</a>
</div>
<div>
<a href="/dash/current" class="">
"inbox"
</a>
</div>
<div>
<p class="text-sm mb-0.5 dark:text-gray-500">"Favorites"</p>
<a href="/dash/current" class="dark:text-gray-300 pl-2">
"inbox"
</a>
</div>
<div>
<p class="text-sm mb-0.5 dark:text-gray-500">"Projects"</p>
<div class="pl-2 dark:text-gray-300">
<NavbarProjects/>
</div>
</div>
</nav>
}
}
#[component]
pub fn DashboardLayout(cx: Scope) -> impl IntoView {
view! { cx,
<div class="flex flex-row">
<DashNav/>
<div id="content" class="p-2">
<Outlet/>
</div>
</div>
}
}

1
src/features.rs Normal file
View File

@@ -0,0 +1 @@
pub mod navbar_projects;

4
src/features/navbar_projects.rs Normal file
View File

@@ -0,0 +1,4 @@
pub mod gen;
pub mod navbar_projects;
pub use navbar_projects::*;

1
src/features/navbar_projects/gen/mod.rs Normal file
View File

@@ -0,0 +1 @@
pub mod queries;

43
src/features/navbar_projects/gen/queries.rs Normal file
View File

@@ -0,0 +1,43 @@
#![allow(clippy::all, warnings)]
pub struct GetProjectsListView;
pub mod get_projects_list_view {
#![allow(dead_code)]
use std::result::Result;
pub const OPERATION_NAME: &str = "GetProjectsListView";
pub const QUERY: &str =
"query GetProjectsListView {\n getProjects {\n id\n name\n }\n}\n";
use super::*;
use serde::{Deserialize, Serialize};
#[allow(dead_code)]
type Boolean = bool;
#[allow(dead_code)]
type Float = f64;
#[allow(dead_code)]
type Int = i64;
#[allow(dead_code)]
type ID = String;
type UUID = crate::common::graphql::UUID;
#[derive(Serialize)]
pub struct Variables;
#[derive(Deserialize)]
pub struct ResponseData {
#[serde(rename = "getProjects")]
pub get_projects: Vec<GetProjectsListViewGetProjects>,
}
#[derive(Deserialize)]
pub struct GetProjectsListViewGetProjects {
pub id: UUID,
pub name: String,
}
}
impl graphql_client::GraphQLQuery for GetProjectsListView {
type Variables = get_projects_list_view::Variables;
type ResponseData = get_projects_list_view::ResponseData;
fn build_query(variables: Self::Variables) -> ::graphql_client::QueryBody<Self::Variables> {
graphql_client::QueryBody {
variables,
query: get_projects_list_view::QUERY,
operation_name: get_projects_list_view::OPERATION_NAME,
}
}
}

6
src/features/navbar_projects/graphql/queries.graphql Normal file
View File

@@ -0,0 +1,6 @@
query GetProjectsListView {
getProjects {
id
name
}
}

60
src/features/navbar_projects/navbar_projects.rs Normal file
View File

@@ -0,0 +1,60 @@
use graphql_client::{GraphQLQuery, Response};
use leptos::*;
use leptos_router::*;
use crate::features::navbar_projects::gen::queries::get_projects_list_view::{
ResponseData, Variables,
};
use crate::features::navbar_projects::gen::queries::GetProjectsListView;
use super::gen::queries::get_projects_list_view::GetProjectsListViewGetProjects;
pub async fn get_projects_list() -> anyhow::Result<Vec<GetProjectsListViewGetProjects>> {
let request_body = GetProjectsListView::build_query(Variables {});
let payload = serde_json::to_string(&request_body)?;
let res = reqwasm::http::Request::post("http://localhost:3001/graphql")
.credentials(reqwasm::http::RequestCredentials::Include)
.body(payload)
.send()
.await?;
let response_body: Response<ResponseData> = res.json().await?;
Ok(response_body.data.unwrap().get_projects)
}
#[component]
pub fn NavbarProjectsView(
cx: Scope,
projects: Resource<(), Vec<GetProjectsListViewGetProjects>>,
) -> impl IntoView {
let projects_view = move || {
projects.with(cx, |projects| {
if projects.is_empty() {
return vec![view! { cx, <div class="project-item">"No projects"</div> }.into_any()];
}
projects
.into_iter()
.map(|project| {
view! { cx,
<a href=format!("/dash/project/{}", & project.id) class="project-item">
<div class="project-item-name hover:dark:bg-blue-700 rounded-md p-0.5 px-2">
{&project.name}
</div>
</a>
}.into_any()
})
.collect::<Vec<_>>()
})
};
view! { cx, <div class="project-items space-y-1">{projects_view}</div> }
}
#[component]
pub fn NavbarProjects(cx: Scope) -> impl IntoView {
let projects =
create_local_resource(cx, || (), |_| async { get_projects_list().await.unwrap() });
view! { cx, <NavbarProjectsView projects=projects/> }
}

4
src/lib.rs
View File

@@ -1,6 +1,10 @@
pub mod api;
pub mod app;
pub mod common;
pub mod fallback;
pub mod features;
pub mod routes;
use cfg_if::cfg_if;
cfg_if! {

4
src/routes.rs Normal file
View File

@@ -0,0 +1,4 @@
pub mod dash;
pub mod features_view;
pub mod home;

1
src/routes/dash.rs Normal file
View File

@@ -0,0 +1 @@
pub mod home;

12
src/routes/dash/home.rs Normal file
View File

@@ -0,0 +1,12 @@
use leptos::*;
use crate::features::navbar_projects::NavbarProjects;
#[component]
pub fn DashHomePage(cx: Scope) -> impl IntoView {
view! { cx,
<div class="home-dash">
<NavbarProjects/>
</div>
}
}

44
src/routes/features_view.rs Normal file
View File

@@ -0,0 +1,44 @@
use leptos::*;
use uuid::Uuid;
use crate::features::navbar_projects::gen::queries::get_projects_list_view::GetProjectsListViewGetProjects;
use crate::features::navbar_projects::NavbarProjectsView;
#[component]
pub fn FeaturesView(cx: Scope) -> impl IntoView {
let projects = create_local_resource(
cx,
|| (),
|_| async {
vec![
GetProjectsListViewGetProjects {
id: Uuid::new_v4(),
name: "some-name".to_string(),
},
GetProjectsListViewGetProjects {
id: Uuid::new_v4(),
name: "some-other-name".to_string(),
},
]
},
);
let emptyProjects: Resource<(), Vec<GetProjectsListViewGetProjects>> =
create_local_resource(cx, || (), |_| async { Vec::new() });
view! { cx,
<div>
<div class="space-y-5">
<h1>"NavbarProjects"</h1>
<h2>"Projects"</h2>
<div class="feature-case">
<NavbarProjectsView projects=projects/>
</div>
<h2>"no projects"</h2>
<div class="feature-case">
<NavbarProjectsView projects=emptyProjects/>
</div>
</div>
</div>
}
}

27
src/routes/home.rs Normal file
View File

@@ -0,0 +1,27 @@
use leptos::*;
#[component]
pub fn Navbar(cx: Scope) -> impl IntoView {
view! { cx,
<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>
</div>
<div class="flex flex-row items-center space-x-4">
<div class="text-xl text-white font-bold cursor-pointer">
<a href="http://localhost:3001/auth/zitadel?return_url=http://localhost:3000/dash/home">
"Enter"
</a>
</div>
</div>
</div>
}
}
#[component]
pub fn HomePage(cx: Scope) -> impl IntoView {
view! { cx,
<Navbar/>
<h1 class="text-xl text-red-50">"Welcome to Leptos!"</h1>
}
}