Merge pull request #15 from BakerNet/feature/watch-or-join

Feature: active & recent games

web/migrations/0009_games_timed_out_seconds.sql

@@ -0,0 +1,2 @@
+alter table games add column timed_out integer null;
+alter table games add column seconds integer null;

web/src/app/error_template.rs

@@ -59,21 +59,26 @@ pub fn ErrorTemplate(
     }
 
     view! {
-        <h1>{if errors.len() > 1 { "Errors" } else { "Error" }}</h1>
-        <For
-            // a function that returns the items we're iterating over; a signal is fine
-            each=move || { errors.clone().into_iter().enumerate() }
-            // a unique key for each item as a reference
-            key=|(index, _error)| *index
-            // renders each item to a view
-            children=move |error| {
-                let error_string = error.1.to_string();
-                let error_code = error.1.status_code();
-                view! {
-                    <h2>{error_code.to_string()}</h2>
-                    <p>"Error: " {error_string}</p>
+        <div class="flex-1 flex flex-col items-center justify-center py-12 px-4 space-y-4">
+
+            <h1 class="text-4xl my-4 text-gray-900 dark:text-gray-200">
+                {if errors.len() > 1 { "Errors" } else { "Error" }}
+            </h1>
+            <For
+                // a function that returns the items we're iterating over; a signal is fine
+                each=move || { errors.clone().into_iter().enumerate() }
+                // a unique key for each item as a reference
+                key=|(index, _error)| *index
+                // renders each item to a view
+                children=move |error| {
+                    let error_string = error.1.to_string();
+                    let error_code = error.1.status_code();
+                    view! {
+                        <h2>{error_code.to_string()}</h2>
+                        <p>"Error: " {error_string}</p>
+                    }
                 }
-            }
-        />
+            />
+        </div>
     }
 }

web/src/app/header.rs

@@ -39,33 +39,41 @@ fn logo() -> impl IntoView {
 
 #[component]
 pub fn Header(user: Resource<Option<FrontendUser>, JsonSerdeCodec>) -> impl IntoView {
-    let user_info = move |user: Option<FrontendUser>| {
-        let aclass = "text-gray-700 dark:text-gray-400 hover:text-sky-800 dark:hover:text-sky-500";
-        match user {
-            None => Either::Left(view! {
+    let aclass = "text-gray-700 dark:text-gray-400 hover:text-sky-800 dark:hover:text-sky-500";
+
+    let user_info = move |user: Option<FrontendUser>| match user {
+        None => Either::Left(view! {
+            <span>
+                "Guest (" <A href="/auth/login" attr:class=aclass>
+                    "Log in"
+                </A> ")"
+            </span>
+        }),
+        Some(user) => {
+            let name = FrontendUser::display_name_or_anon(user.display_name.as_ref(), true);
+            Either::Right(view! {
                 <span>
-                    "Guest (" <A href="/auth/login" attr:class=aclass>
-                        "Log in"
+                    {name} " (" <A href="/profile" attr:class=aclass>
+                        "Profile"
                     </A> ")"
                 </span>
-            }),
-            Some(user) => {
-                let name = FrontendUser::display_name_or_anon(user.display_name.as_ref(), true);
-                Either::Right(view! {
-                    <span>
-                        {name} " (" <A href="/profile" attr:class=aclass>
-                            "Profile"
-                        </A> ")"
-                    </span>
-                })
-            }
+            })
         }
     };
     view! {
-        <header class="flex flex-wrap space-y-2 items-center justify-between px-4 py-2 border-b border-gray-800">
+        <header class="flex flex-wrap space-y-2 space-x-4 items-center justify-between px-4 py-2 border-b border-gray-800">
             <A href="/" attr:class="flex items-center space-x-2">
                 <h1>{logo()}</h1>
             </A>
+            <div class="flex items-center space-x-2">
+                <A href="/active" attr:class=format!("{} text-lg", aclass)>
+                    "Active Games"
+                </A>
+                <span>"|"</span>
+                <A href="/recent" attr:class=format!("{} text-lg", aclass)>
+                    "Recent Games"
+                </A>
+            </div>
             <div class="flex grow justify-end items-center space-x-2">
                 <Transition fallback=move || ()>
                     {move || Suspend::new(async move {

web/src/app/minesweeper.rs

@@ -2,13 +2,15 @@ mod cell;
 mod client;
 mod entry;
 mod game;
+mod games;
 mod players;
 mod replay;
 mod widgets;
 
 use chrono::{DateTime, Utc};
 pub use entry::{GameMode, JoinOrCreateGame};
 pub use game::{GameView, GameWrapper, ReplayView};
+pub use games::{ActiveGames, RecentGames};
 
 use serde::{Deserialize, Serialize};
 

web/src/app/minesweeper/entry.rs

@@ -29,23 +29,23 @@ pub enum GameMode {
 impl GameMode {
     pub fn short_name(self) -> &'static str {
         match self {
-            GameMode::ClassicBeginner => "Beginner",
-            GameMode::ClassicIntermediate => "Intermediate",
-            GameMode::ClassicExpert => "Expert",
-            GameMode::SmallMultiplayer => "Small",
-            GameMode::LargeMultiplayer => "Large",
-            GameMode::Custom => "Custom",
+            Self::ClassicBeginner => "Beginner",
+            Self::ClassicIntermediate => "Intermediate",
+            Self::ClassicExpert => "Expert",
+            Self::SmallMultiplayer => "Small",
+            Self::LargeMultiplayer => "Large",
+            Self::Custom => "Custom",
         }
     }
 
     pub fn long_name(self) -> &'static str {
         match self {
-            GameMode::ClassicBeginner => "Classic Beginner",
-            GameMode::ClassicIntermediate => "Classic Intermediate",
-            GameMode::ClassicExpert => "Classic Expert",
-            GameMode::SmallMultiplayer => "Multiplayer Small",
-            GameMode::LargeMultiplayer => "Multiplayer Large",
-            GameMode::Custom => "Custom",
+            Self::ClassicBeginner => "Classic Beginner",
+            Self::ClassicIntermediate => "Classic Intermediate",
+            Self::ClassicExpert => "Classic Expert",
+            Self::SmallMultiplayer => "Multiplayer Small",
+            Self::LargeMultiplayer => "Multiplayer Large",
+            Self::Custom => "Custom",
         }
     }
 }
@@ -59,32 +59,32 @@ impl Default for GameMode {
 impl From<&GameMode> for GameSettings {
     fn from(value: &GameMode) -> Self {
         match value {
-            GameMode::ClassicBeginner => GameSettings {
+            GameMode::ClassicBeginner => Self {
                 rows: 9,
                 cols: 9,
                 num_mines: 10,
                 max_players: 1,
             },
-            GameMode::ClassicIntermediate => GameSettings {
+            GameMode::ClassicIntermediate => Self {
                 rows: 16,
                 cols: 16,
                 num_mines: 40,
                 max_players: 1,
             },
-            GameMode::ClassicExpert => GameSettings {
+            GameMode::ClassicExpert => Self {
                 rows: 16,
                 cols: 30,
                 num_mines: 99,
                 max_players: 1,
             },
-            GameMode::SmallMultiplayer => GameSettings {
+            GameMode::SmallMultiplayer => Self {
                 rows: 16,
                 cols: 30,
                 num_mines: 80,
                 max_players: 2,
             },
-            GameMode::LargeMultiplayer => GameSettings::default(),
-            GameMode::Custom => GameSettings::default(),
+            GameMode::LargeMultiplayer => Self::default(),
+            GameMode::Custom => Self::default(),
         }
     }
 }
@@ -103,32 +103,32 @@ impl From<&GameSettings> for GameMode {
                 cols: 9,
                 num_mines: 10,
                 max_players: 1,
-            } => GameMode::ClassicBeginner,
+            } => Self::ClassicBeginner,
             GameSettings {
                 rows: 16,
                 cols: 16,
                 num_mines: 40,
                 max_players: 1,
-            } => GameMode::ClassicIntermediate,
+            } => Self::ClassicIntermediate,
             GameSettings {
                 rows: 16,
                 cols: 30,
                 num_mines: 99,
                 max_players: 1,
-            } => GameMode::ClassicExpert,
+            } => Self::ClassicExpert,
             GameSettings {
                 rows: 16,
                 cols: 30,
                 num_mines: 80,
                 max_players: 2,
-            } => GameMode::SmallMultiplayer,
+            } => Self::SmallMultiplayer,
             GameSettings {
                 rows: 50,
                 cols: 50,
                 num_mines: 500,
                 max_players: 8,
-            } => GameMode::LargeMultiplayer,
-            _ => GameMode::Custom,
+            } => Self::LargeMultiplayer,
+            _ => Self::Custom,
         }
     }
 }