From 3bf9af6f1e969fce2e814034cc817d08451d0f92 Mon Sep 17 00:00:00 2001 From: Jeremy Wall Date: Sun, 30 Oct 2022 18:39:05 -0400 Subject: [PATCH] Rearrange ui for separate plan and editing sections --- web/src/components/header.rs | 4 ++- web/src/components/tabs.rs | 30 +++++++--------- web/src/pages/login.rs | 7 +--- web/src/pages/{ => manage}/categories.rs | 11 +++--- web/src/pages/manage/mod.rs | 37 +++++++++++++++++++ web/src/pages/mod.rs | 14 ++++---- web/src/pages/{ => planning}/cook.rs | 14 ++++---- web/src/pages/{ => planning}/inventory.rs | 14 ++++---- web/src/pages/planning/mod.rs | 43 +++++++++++++++++++++++ web/src/pages/{ => planning}/plan.rs | 12 +++---- web/src/pages/recipe.rs | 9 ++--- web/src/web.rs | 8 +++-- 12 files changed, 131 insertions(+), 72 deletions(-) rename web/src/pages/{ => manage}/categories.rs (80%) create mode 100644 web/src/pages/manage/mod.rs rename web/src/pages/{ => planning}/cook.rs (76%) rename web/src/pages/{ => planning}/inventory.rs (76%) create mode 100644 web/src/pages/planning/mod.rs rename web/src/pages/{ => planning}/plan.rs (76%) diff --git a/web/src/components/header.rs b/web/src/components/header.rs index 8dafd5f..339833d 100644 --- a/web/src/components/header.rs +++ b/web/src/components/header.rs @@ -18,8 +18,10 @@ use sycamore::prelude::*; pub fn Header(cx: Scope) -> View { view! {cx, nav(class="no-print") { - h1(class="title") { "Meal Plan" } + h1(class="title") { "Kitchen" } ul { + li { a(href="/ui/plan") { "MealPlan" } } + li { a(href="/ui/categories") { "Manage" } } li { a(href="/ui/login") { "Login" } } li { a(href="https://github.com/zaphar/kitchen") { "Github" } } } diff --git a/web/src/components/tabs.rs b/web/src/components/tabs.rs index 69ddb89..906defe 100644 --- a/web/src/components/tabs.rs +++ b/web/src/components/tabs.rs @@ -14,27 +14,23 @@ use sycamore::prelude::*; use tracing::debug; -use super::Header; -#[derive(Clone, Prop)] -pub struct TabState { - pub inner: View, +#[derive(Prop)] +pub struct TabState<'a, G: Html> { + pub children: Children<'a, G>, pub selected: Option, + tablist: Vec<(&'static str, &'static str)>, } #[component] -pub fn TabbedView(cx: Scope, state: TabState) -> View { - let tablist = create_signal( - cx, - vec![ - ("/ui/plan", "Plan"), - ("/ui/inventory", "Inventory"), - ("/ui/cook", "Cook"), - ("/ui/categories", "Categories"), - ], - ); - let TabState { inner, selected } = state; +pub fn TabbedView<'a, G: Html>(cx: Scope<'a>, state: TabState<'a, G>) -> View { + let TabState { + children, + selected, + tablist, + } = state; + let tablist = create_signal(cx, tablist.clone()); + let children = children.call(cx); view! {cx, - Header { } nav { ul(class="tabs") { Indexed( @@ -54,7 +50,7 @@ pub fn TabbedView(cx: Scope, state: TabState) -> View { } } main(class=".conatiner-fluid") { - (inner) + (children) } } } diff --git a/web/src/pages/login.rs b/web/src/pages/login.rs index fd7a400..844a382 100644 --- a/web/src/pages/login.rs +++ b/web/src/pages/login.rs @@ -11,8 +11,6 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -use crate::components::tabs::*; - use base64; use reqwasm::http; use sycamore::{futures::spawn_local_scoped, prelude::*}; @@ -80,9 +78,6 @@ pub fn LoginForm(cx: Scope) -> View { #[component] pub fn LoginPage(cx: Scope) -> View { view! {cx, - TabbedView(TabState { - inner: view! {cx, LoginForm { } }, - selected: None, - }) + LoginForm() } } diff --git a/web/src/pages/categories.rs b/web/src/pages/manage/categories.rs similarity index 80% rename from web/src/pages/categories.rs rename to web/src/pages/manage/categories.rs index d69bc83..c95bd37 100644 --- a/web/src/pages/categories.rs +++ b/web/src/pages/manage/categories.rs @@ -11,8 +11,8 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. +use super::ManagePage; use crate::components::categories::*; -use crate::components::tabs::*; use sycamore::prelude::*; use tracing::instrument; @@ -21,11 +21,8 @@ use tracing::instrument; #[component()] pub fn CategoryPage(cx: Scope) -> View { view! {cx, - TabbedView(TabState { - inner: view! {cx, - Categories { } - }, - selected: Some("Categories".to_owned()), - }) + ManagePage( + selected=Some("Categories".to_owned()), + ) { Categories() } } } diff --git a/web/src/pages/manage/mod.rs b/web/src/pages/manage/mod.rs new file mode 100644 index 0000000..262d051 --- /dev/null +++ b/web/src/pages/manage/mod.rs @@ -0,0 +1,37 @@ +// Copyright 2022 Jeremy Wall (Jeremy@marzhilsltudios.com) +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +use crate::components::tabs::*; +use sycamore::prelude::*; + +pub mod categories; + +#[derive(Prop)] +pub struct PageState<'a, G: Html> { + pub children: Children<'a, G>, + pub selected: Option, +} + +#[component] +pub fn ManagePage<'a, G: Html>(cx: Scope<'a>, state: PageState<'a, G>) -> View { + let PageState { children, selected } = state; + let children = children.call(cx); + let manage_tabs: Vec<(&'static str, &'static str)> = vec![("/ui/categories", "Categories")]; + + view! {cx, + TabbedView( + selected=selected, + tablist=manage_tabs, + ) { (children) } + } +} diff --git a/web/src/pages/mod.rs b/web/src/pages/mod.rs index b803642..ab72881 100644 --- a/web/src/pages/mod.rs +++ b/web/src/pages/mod.rs @@ -11,16 +11,14 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -mod categories; -mod cook; -mod inventory; mod login; -mod plan; +mod manage; +mod planning; mod recipe; -pub use categories::*; -pub use cook::*; -pub use inventory::*; pub use login::*; -pub use plan::*; +pub use manage::categories::*; +pub use planning::cook::*; +pub use planning::inventory::*; +pub use planning::plan::*; pub use recipe::*; diff --git a/web/src/pages/cook.rs b/web/src/pages/planning/cook.rs similarity index 76% rename from web/src/pages/cook.rs rename to web/src/pages/planning/cook.rs index 183ab34..60100b5 100644 --- a/web/src/pages/cook.rs +++ b/web/src/pages/planning/cook.rs @@ -11,18 +11,16 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -use crate::components::{recipe_list::*, tabs::*}; - use sycamore::prelude::*; +use super::PlanningPage; +use crate::components::recipe_list::*; + #[component] pub fn CookPage(cx: Scope) -> View { view! {cx, - TabbedView(TabState { - inner: view! {cx, - RecipeList { } - }, - selected: Some("Cook".to_owned()), - }) + PlanningPage( + selected=Some("Cook".to_owned()), + ) { RecipeList() } } } diff --git a/web/src/pages/inventory.rs b/web/src/pages/planning/inventory.rs similarity index 76% rename from web/src/pages/inventory.rs rename to web/src/pages/planning/inventory.rs index ff3b881..953503d 100644 --- a/web/src/pages/inventory.rs +++ b/web/src/pages/planning/inventory.rs @@ -11,18 +11,16 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -use crate::components::{shopping_list::*, tabs::*}; - use sycamore::prelude::*; +use super::PlanningPage; +use crate::components::shopping_list::*; + #[component] pub fn InventoryPage(cx: Scope) -> View { view! {cx, - TabbedView(TabState { - inner: view! {cx, - ShoppingList {} - }, - selected: Some("Inventory".to_owned()), - }) + PlanningPage( + selected=Some("Inventory".to_owned()), + ) { ShoppingList() } } } diff --git a/web/src/pages/planning/mod.rs b/web/src/pages/planning/mod.rs new file mode 100644 index 0000000..dbabf0c --- /dev/null +++ b/web/src/pages/planning/mod.rs @@ -0,0 +1,43 @@ +// Copyright 2022 Jeremy Wall (Jeremy@marzhilsltudios.com) +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +use crate::components::tabs::*; +use sycamore::prelude::*; + +pub mod cook; +pub mod inventory; +pub mod plan; + +#[derive(Prop)] +pub struct PageState<'a, G: Html> { + pub children: Children<'a, G>, + pub selected: Option, +} + +#[component] +pub fn PlanningPage<'a, G: Html>(cx: Scope<'a>, state: PageState<'a, G>) -> View { + let PageState { children, selected } = state; + let children = children.call(cx); + let planning_tabs: Vec<(&'static str, &'static str)> = vec![ + ("/ui/plan", "Plan"), + ("/ui/inventory", "Inventory"), + ("/ui/cook", "Cook"), + ]; + + view! {cx, + TabbedView( + selected=selected, + tablist=planning_tabs, + ) { (children) } + } +} diff --git a/web/src/pages/plan.rs b/web/src/pages/planning/plan.rs similarity index 76% rename from web/src/pages/plan.rs rename to web/src/pages/planning/plan.rs index a486d9e..86f23cb 100644 --- a/web/src/pages/plan.rs +++ b/web/src/pages/planning/plan.rs @@ -11,18 +11,16 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -use crate::components::{recipe_selector::*, tabs::*}; +use super::PlanningPage; +use crate::components::recipe_selector::*; use sycamore::prelude::*; #[component] pub fn PlanPage(cx: Scope) -> View { view! {cx, - TabbedView(TabState { - inner: view! {cx, - RecipeSelector() - }, - selected: Some("Plan".to_owned()), - }) + PlanningPage( + selected=Some("Plan".to_owned()), + ) { RecipeSelector() } } } diff --git a/web/src/pages/recipe.rs b/web/src/pages/recipe.rs index 55d7bd4..83cc7ab 100644 --- a/web/src/pages/recipe.rs +++ b/web/src/pages/recipe.rs @@ -11,7 +11,7 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -use crate::components::{recipe::Recipe, tabs::*}; +use crate::components::recipe::Recipe; use sycamore::prelude::*; use tracing::instrument; @@ -25,11 +25,6 @@ pub struct RecipePageProps { #[component()] pub fn RecipePage(cx: Scope, props: RecipePageProps) -> View { view! {cx, - TabbedView(TabState { - inner: view! {cx, - Recipe(props.recipe) - }, - selected: None, - }) + Recipe(props.recipe) } } diff --git a/web/src/web.rs b/web/src/web.rs index f103356..a564a7d 100644 --- a/web/src/web.rs +++ b/web/src/web.rs @@ -11,11 +11,12 @@ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. // See the License for the specific language governing permissions and // limitations under the License. -use crate::pages::*; -use crate::{api, app_state::*, router_integration::*}; +use sycamore::{futures::spawn_local_scoped, prelude::*}; use tracing::{error, info, instrument}; -use sycamore::{futures::spawn_local_scoped, prelude::*}; +use crate::components::Header; +use crate::pages::*; +use crate::{api, app_state::*, router_integration::*}; #[instrument] fn route_switch(cx: Scope, route: &ReadSignal) -> View { @@ -67,6 +68,7 @@ pub fn UI(cx: Scope) -> View { }; view.set(view! { cx, div(class="app") { + Header { } Router(RouterProps { route: Routes::Plan, route_select: route_switch,