Updates to client

AobaClient/src/components/basic/button.rs

@@ -0,0 +1,20 @@
+use dioxus::prelude::*;
+
+#[derive(PartialEq, Clone, Props)]
+pub struct ButtonProps {
+	variant: Option<ButtonVariant>,
+	text: String,
+}
+
+#[derive(PartialEq, Clone)]
+pub enum ButtonVariant {
+	Base,
+	Muted,
+	Accented,
+}
+
+pub fn Button(props: ButtonProps) -> Element {
+	rsx! {
+		button { "{props.text}" }
+	}
+}

AobaClient/src/components/basic/input.rs

@@ -0,0 +1,27 @@
+use dioxus::prelude::*;
+
+#[derive(PartialEq, Clone, Props)]
+pub struct InputProps {
+	pub r#type: Option<String>,
+	pub value: Option<String>,
+	pub label: Option<String>,
+	pub placeholder: Option<String>,
+	pub name: String,
+}
+
+#[component]
+pub fn Input(props: InputProps) -> Element {
+	let label = props.label.unwrap_or("".into());
+	let ph = props.placeholder.unwrap_or(label.clone());
+	rsx! {
+		label {
+			"{label}",
+			input {
+				type : props.r#type.unwrap_or("text".into()),
+				value: props.value,
+				name: props.name,
+				placeholder:ph
+			}
+		}
+	}
+}

AobaClient/src/components/basic/mod.rs

@@ -0,0 +1,4 @@
+mod button;
+mod input;
+pub use button::*;
+pub use input::*;

AobaClient/src/components/main_layout.rs

@@ -1,11 +0,0 @@
-use dioxus::prelude::*;
-
-use crate::{components::Navbar, Route};
-
-#[component]
-pub fn MainLayout() -> Element {
-	rsx! {
-		Navbar {}
-		Outlet::<Route> {}
-	}
-}

AobaClient/src/components/media_grid.rs

@@ -0,0 +1,39 @@
+use dioxus::prelude::*;
+
+#[component]
+pub fn MediaGrid() -> Element {
+	rsx! {
+		div{
+			class: "mediaGrid",
+			{(0..50).map(|_| rsx!{
+				MediaItem {}
+			})}
+		}
+	}
+}
+
+#[component]
+pub fn MediaItem() -> Element {
+	rsx! {
+		div{
+			class: "mediaItem",
+			img{}
+			div {
+				class: "info",
+				span{
+					class: "name",
+					"Filename"
+				},
+				div{
+					class: "details",
+					span{
+						"Type"
+					},
+					span{
+						"View Count"
+					},
+				}
+			}
+		}
+	}
+}

AobaClient/src/components/mod.rs

@@ -1,4 +1,7 @@
-mod main_layout;
+pub mod basic;
+mod media_grid;
 mod navbar;
-pub use main_layout::MainLayout;
-pub use navbar::Navbar;
+mod search;
+pub use media_grid::*;
+pub use navbar::*;
+pub use search::*;

AobaClient/src/components/search.rs

@@ -0,0 +1,14 @@
+use dioxus::prelude::*;
+
+#[component]
+pub fn Search() -> Element {
+	rsx! {
+		div{
+			class: "searchBar",
+			input {
+				type: "search",
+				placeholder: "Search Files"
+			}
+		}
+	}
+}