Display cards during game result

This uses the Hand widget which is not working well for vertical hands
yet.

2 files changed, 77 insertions, 12 deletions

diff --git a/protocol/src/bridge_engine.rs b/protocol/src/bridge_engine.rs
index 75a51ba..44e5c91 100644
--- a/protocol/src/bridge_engine.rs
+++ b/protocol/src/bridge_engine.rs
@@ -739,6 +739,13 @@ impl PlayResult {
             PlayResult::Played(r) => r.deal(),
         }
     }
+
+    pub fn bidding(&self) -> &Bidding {
+        match self {
+            PlayResult::PassedOut(r) => &r.bidding,
+            PlayResult::Played(r) => &r.bidding,
+        }
+    }
 }
 
 #[derive(Debug, Clone, Serialize, Deserialize, PartialEq, Eq)]
diff --git a/webapp/src/components/table.rs b/webapp/src/components/table.rs
index b9fe45d..a751bc1 100644
--- a/webapp/src/components/table.rs
+++ b/webapp/src/components/table.rs
@@ -4,8 +4,8 @@ use crate::{services, use_app_context};
 use futures::FutureExt;
 use log::info;
 use protocol::bridge_engine::{
-    Bid, BiddingStatePlayerView, GameStatePlayerView, PlayStatePlayerView,
-    Player, TableStatePlayerView,
+    Bid, BiddingStatePlayerView, GameStatePlayerView, PlayResult,
+    PlayStatePlayerView, Player, TableStatePlayerView,
 };
 use protocol::card::Card;
 use yew::prelude::*;
@@ -65,6 +65,67 @@ impl OnlineTableInner {
         );
     }
 
+    fn view_result(
+        &self,
+        ctx: &yew::Context<Self>,
+        result: &PlayResult,
+    ) -> Html {
+        let leave_table = {
+            let ctx = ctx.props().app_ctx.clone();
+            Callback::from(move |_| ctx.leave_table())
+        };
+
+        let center = html! {
+            <>
+                <div class="sidebar">
+                  <div>
+                    <h2>{"Contract"}</h2>
+                    <p>{format!("todo")}</p>
+                  </div>
+                  <div>
+                    <h2>{"Bidding"}</h2>
+                    <BiddingTable bidding={result.bidding().clone()} />
+                  </div>
+                  <div>
+                    <h2>{"Trick Count"}</h2>
+                    <p>{format!("todo")}</p>
+                  </div>
+                </div>
+                <div class="center">
+               </div>
+                <div class="hand north">
+                  <Hand cards={result.deal().north.clone()} on_card_clicked={Callback::from(|_| ())} />
+                </div>
+                <div class="hand east">
+                  <Hand cards={result.deal().east.clone()} on_card_clicked={Callback::from(|_| ())} />
+                </div>
+                <div class="hand south">
+                  <Hand cards={result.deal().south.clone()} on_card_clicked={Callback::from(|_| ())} />
+                </div>
+                <div class="hand west">
+                  <Hand cards={result.deal().west.clone()} on_card_clicked={Callback::from(|_| ())} />
+                </div>
+            </>
+        };
+        html! {
+            <>
+                <div class="game-layout">
+                <div class="navbar">
+                  <ul>
+                  <li>{format!("This is table {}", ctx.props().table.id)}</li>
+                  <li>
+                    <button onclick={leave_table}>
+                        { "Leave table" }
+                    </button>
+                  </li>
+                  </ul>
+                </div>
+                {center}
+                </div>
+            </>
+        }
+    }
+
     fn view_game(
         &self,
         ctx: &yew::Context<Self>,
@@ -149,9 +210,11 @@ impl Component for OnlineTableInner {
                     async move {
                         services::new_deal(table.clone()).await?;
                         services::get_table_player_view(table).await
-                    }.map(Msg::TableStateUpdated));
+                    }
+                    .map(Msg::TableStateUpdated),
+                );
                 false
-            },
+            }
         }
     }
 
@@ -162,14 +225,9 @@ impl Component for OnlineTableInner {
                 <p>{"An error occurred."}</p>
             },
             Some(TableStatePlayerView::Game(game)) => self.view_game(ctx, game),
-            Some(TableStatePlayerView::Result(result)) => html! {
-                <>
-                    <pre>{format!("{result:#?}")}</pre>
-                    <button onclick={ctx.link().callback(|_| Msg::RequestNewDeal)}>
-                      {"New deal"}
-                    </button>
-                </>
-            },
+            Some(TableStatePlayerView::Result(result)) => {
+                self.view_result(ctx, result)
+            }
         }
     }
 }