feat: settings panel with page tabbing

1 files changed, 11 insertions, 10 deletions

diff --git a/src/lib.rs b/src/lib.rs
index 92c764d..189d050 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -1073,7 +1073,7 @@ pub fn Modal(on_background_click: impl Fn(MouseEvent) + 'static, children: Child
     }
 }
 
-#[derive(Clone, Copy, Debug)]
+#[derive(Clone, Copy, Debug, PartialEq, Eq)]
 pub enum SettingsPage {
     Account,
     Chat,
@@ -1096,17 +1096,17 @@ pub fn Settings() -> impl IntoView {
                 </div>
                 <div class="settings-main">
                     <div class="settings-sidebar">
-                        <div on:click=move |_| show_settings.set(Some(SettingsPage::Account))>Account</div>
-                        <div on:click=move |_| show_settings.set(Some(SettingsPage::Chat))>Chat</div>
-                        <div on:click=move |_| show_settings.set(Some(SettingsPage::Privacy))>Privacy</div>
-                        <div on:click=move |_| show_settings.set(Some(SettingsPage::Profile))>Profile</div>
+                        <div class:open=move || *show_settings.read() == Some(SettingsPage::Account) on:click=move |_| show_settings.set(Some(SettingsPage::Account))>Account</div>
+                        <div class:open=move || *show_settings.read() == Some(SettingsPage::Chat) on:click=move |_| show_settings.set(Some(SettingsPage::Chat))>Chat</div>
+                        <div class:open=move || *show_settings.read() == Some(SettingsPage::Privacy) on:click=move |_| show_settings.set(Some(SettingsPage::Privacy))>Privacy</div>
+                        <div class:open=move || *show_settings.read() == Some(SettingsPage::Profile) on:click=move |_| show_settings.set(Some(SettingsPage::Profile))>Profile</div>
                     </div>
-                    <div class="settings-main">
+                    <div class="settings-page">
                         {move || if let Some(page) = show_settings.get() {
                             match page {
                             SettingsPage::Account => view! { <div>"account"</div> }.into_any(),
                             SettingsPage::Chat => view! { <div>"chat"</div> }.into_any(),
-                            SettingsPage::Profile => view! { <div>"profile"</div> }.into_any(),
+                            SettingsPage::Profile => view! { <ProfileSettings /> }.into_any(),
                             SettingsPage::Privacy => view! { <div>"privacy"</div> }.into_any(),
                             }
                         } else {
@@ -1121,7 +1121,10 @@ pub fn Settings() -> impl IntoView {
 
 #[component]
 pub fn ProfileSettings() -> impl IntoView {
-    view! {}
+    view! {
+        <form>
+        </form>
+    }
 }
 
 #[component]
@@ -1796,8 +1799,6 @@ where
         {
             let store = self.inner.try_get_value().unwrap();
             let mut store = store.store.write().unwrap();
-            debug!("got store");
-            debug!("got store 2");
             if let Some((v, count)) = store.get_mut(&key) {
                 *v = value.clone();
                 *count += 1;