Rearrange ui for separate plan and editing sections

This commit is contained in:
Jeremy Wall 2022-10-30 18:39:05 -04:00
parent 496e633034
commit 3bf9af6f1e
12 changed files with 131 additions and 72 deletions

View File

@ -18,8 +18,10 @@ use sycamore::prelude::*;
pub fn Header<G: Html>(cx: Scope) -> View<G> {
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" } }
}

View File

@ -14,27 +14,23 @@
use sycamore::prelude::*;
use tracing::debug;
use super::Header;
#[derive(Clone, Prop)]
pub struct TabState<G: GenericNode> {
pub inner: View<G>,
#[derive(Prop)]
pub struct TabState<'a, G: Html> {
pub children: Children<'a, G>,
pub selected: Option<String>,
tablist: Vec<(&'static str, &'static str)>,
}
#[component]
pub fn TabbedView<G: Html>(cx: Scope, state: TabState<G>) -> View<G> {
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<G> {
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<G: Html>(cx: Scope, state: TabState<G>) -> View<G> {
}
}
main(class=".conatiner-fluid") {
(inner)
(children)
}
}
}

View File

@ -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<G: Html>(cx: Scope) -> View<G> {
#[component]
pub fn LoginPage<G: Html>(cx: Scope) -> View<G> {
view! {cx,
TabbedView(TabState {
inner: view! {cx, LoginForm { } },
selected: None,
})
LoginForm()
}
}

View File

@ -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<G: Html>(cx: Scope) -> View<G> {
view! {cx,
TabbedView(TabState {
inner: view! {cx,
Categories { }
},
selected: Some("Categories".to_owned()),
})
ManagePage(
selected=Some("Categories".to_owned()),
) { Categories() }
}
}

View File

@ -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<String>,
}
#[component]
pub fn ManagePage<'a, G: Html>(cx: Scope<'a>, state: PageState<'a, G>) -> View<G> {
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) }
}
}

View File

@ -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::*;

View File

@ -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<G: Html>(cx: Scope) -> View<G> {
view! {cx,
TabbedView(TabState {
inner: view! {cx,
RecipeList { }
},
selected: Some("Cook".to_owned()),
})
PlanningPage(
selected=Some("Cook".to_owned()),
) { RecipeList() }
}
}

View File

@ -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<G: Html>(cx: Scope) -> View<G> {
view! {cx,
TabbedView(TabState {
inner: view! {cx,
ShoppingList {}
},
selected: Some("Inventory".to_owned()),
})
PlanningPage(
selected=Some("Inventory".to_owned()),
) { ShoppingList() }
}
}

View File

@ -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<String>,
}
#[component]
pub fn PlanningPage<'a, G: Html>(cx: Scope<'a>, state: PageState<'a, G>) -> View<G> {
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) }
}
}

View File

@ -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<G: Html>(cx: Scope) -> View<G> {
view! {cx,
TabbedView(TabState {
inner: view! {cx,
RecipeSelector()
},
selected: Some("Plan".to_owned()),
})
PlanningPage(
selected=Some("Plan".to_owned()),
) { RecipeSelector() }
}
}

View File

@ -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<G: Html>(cx: Scope, props: RecipePageProps) -> View<G> {
view! {cx,
TabbedView(TabState {
inner: view! {cx,
Recipe(props.recipe)
},
selected: None,
})
}
}

View File

@ -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<G: Html>(cx: Scope, route: &ReadSignal<Routes>) -> View<G> {
@ -67,6 +68,7 @@ pub fn UI<G: Html>(cx: Scope) -> View<G> {
};
view.set(view! { cx,
div(class="app") {
Header { }
Router(RouterProps {
route: Routes::Plan,
route_select: route_switch,