From 54b15027a8017fa26e2aa62f15046c91158ff997 Mon Sep 17 00:00:00 2001
From: Stefano Pigozzi <me@steffo.eu>
Date: Sat, 30 Nov 2024 14:39:46 +0100
Subject: [PATCH] hoooooooly cow

---
 holycow_backend/src/routes/matches.rs         | 15 +++++----
 .../src/app/[telegramId]/report/page.tsx      |  1 -
 holycow_frontend/src/app/layout.css           |  8 +++++
 holycow_frontend/src/components/ReportBox.tsx | 32 +++++++++----------
 4 files changed, 33 insertions(+), 23 deletions(-)

diff --git a/holycow_backend/src/routes/matches.rs b/holycow_backend/src/routes/matches.rs
index e33d1ff..eac8e96 100644
--- a/holycow_backend/src/routes/matches.rs
+++ b/holycow_backend/src/routes/matches.rs
@@ -5,7 +5,7 @@ use serde::Deserialize;
 use skillratings::weng_lin::WengLinConfig;
 use teloxide::Bot;
 use teloxide::requests::Requester;
-use teloxide::types::{ChatId, MessageId, ThreadId};
+use teloxide::types::{ChatId, MessageId, ParseMode, ThreadId};
 use crate::config;
 use crate::database::model::{Match, MatchI, Outcome, Player, WengLinRating};
 
@@ -33,6 +33,7 @@ pub struct MatchII {
 fn player_to_text(player: &Player, before: &WengLinRating, after: &WengLinRating) -> String {
 	let name = &player.username;
 	let competitive = &player.competitive;
+	let telegram_id = &player.telegram_id;
 	
 	match competitive {
 		false => {
@@ -43,7 +44,7 @@ fn player_to_text(player: &Player, before: &WengLinRating, after: &WengLinRating
 			let after = after.human_score();
 			let change = after - before;
 			
-			format!("<b>{name}</b> <i>({change})</i>")
+			format!(r#"<b><a href="tg://user?id={telegram_id}">{name}</a></b> <i>({change:+})</i>"#)
 		},
 	}
 }
@@ -58,12 +59,12 @@ fn match_to_text(r#match: &Match, player_a: &Player, player_b: &Player) -> Strin
 			None => format!("🔵 {player_a} ha trionfato su {player_b}!"),
 		},
 		Outcome::BWins => match &r#match.name {
-			Some(name) => format!("⚪️ {player_a} è stato sconfitto da {player_b} in <b>{name}</b>!"),
-			None => format!("⚪️ {player_a} è stato sconfitto da {player_b}!"),
+			Some(name) => format!("🟠 {player_a} è stato sconfitto da {player_b} in <b>{name}</b>!"),
+			None => format!("🟠 {player_a} è stato sconfitto da {player_b}!"),
 		},
 		Outcome::Tie => match &r#match.name {
-			Some(name) => format!("🟠 {player_a} e {player_b} hanno pareggiato in <b>{name}</b>!"),
-			None => format!("🟠 {player_a} e {player_b} hanno pareggiato!"),
+			Some(name) => format!("⚪️ {player_a} e {player_b} hanno pareggiato in <b>{name}</b>!"),
+			None => format!("⚪️ {player_a} e {player_b} hanno pareggiato!"),
 		},
 	}
 }
@@ -141,6 +142,8 @@ pub async fn post_match(
 	let chat = ChatId(*chat);
 	let mut send_message_future = bot.send_message(chat, match_to_text(&r#match, &player_a, &player_b));
 	
+	send_message_future.parse_mode = Some(ParseMode::Html);
+	
 	let topic = config::TELEGRAM_NOTIFICATION_TOPIC_ID();
 	if let Some(topic) = topic {
 		let topic = MessageId(*topic);
diff --git a/holycow_frontend/src/app/[telegramId]/report/page.tsx b/holycow_frontend/src/app/[telegramId]/report/page.tsx
index ce3ab82..05f5251 100644
--- a/holycow_frontend/src/app/[telegramId]/report/page.tsx
+++ b/holycow_frontend/src/app/[telegramId]/report/page.tsx
@@ -1,4 +1,3 @@
-import {ReportBox} from "@/components/ReportBox"
 import {ReportBoxInteractive} from "@/components/ReportBoxInteractive"
 import {PlayerO} from "@/holycow"
 
diff --git a/holycow_frontend/src/app/layout.css b/holycow_frontend/src/app/layout.css
index 2e0e87a..7a167a5 100644
--- a/holycow_frontend/src/app/layout.css
+++ b/holycow_frontend/src/app/layout.css
@@ -6,6 +6,14 @@ nextjs-portal {
 	position: absolute;
 }
 
+hr {
+	margin: 0.5em 0;
+}
+
+.separator-lightest {
+	border-color: hsl(var(--bhsl-current-hue) var(--bhsl-current-saturation) var(--bhsl-current-lightness) / .05);
+}
+
 :where(body) :where(.form-flex) > :where(.form-flex-choice, label) > :where(*) {
 	/* TODO: Fix in bluelib */
 	align-items: center;
diff --git a/holycow_frontend/src/components/ReportBox.tsx b/holycow_frontend/src/components/ReportBox.tsx
index 51e1389..702ac4e 100644
--- a/holycow_frontend/src/components/ReportBox.tsx
+++ b/holycow_frontend/src/components/ReportBox.tsx
@@ -38,16 +38,22 @@ export function ReportBox({players, playerA, playerB, setPlayerB, outcome, setOu
 			<h3>
 				Registra risultato
 			</h3>
-			<p></p>
+			<hr className="separator-lightest"/>
+			<label>
+				<span>Titolo</span>
+				<input type={"text"} onChange={e => setName(e.target.value)} value={name} placeholder={"Scontro al Garasauto"}/>
+				<small>opzion.</small>
+			</label>
+			<hr className="separator-lightest"/>
 			<label>
 				<span>Tu</span>
-				<div>
-					{playerA.username}
-				</div>
-				<span>{playerA.human_score && `★ ${playerA.human_score}`}</span>
+				<select disabled={true}>
+					<option>{playerA.username}</option>
+				</select>
+				<span>{playerA.human_score && `${playerA.human_score} ★`}</span>
 			</label>
 			<label>
-				<span>Avversario</span>
+				<span>Avv.</span>
 				<select onChange={e => setPlayerB(players.find(p => p.id == Number.parseInt(e.target.value)))} value={playerB?.id}>
 					<option value={undefined}></option>
 					{players
@@ -57,11 +63,11 @@ export function ReportBox({players, playerA, playerB, setPlayerB, outcome, setOu
 						))
 					}
 				</select>
-				<span>{playerB && playerB.human_score && `★ ${playerB.human_score}`}</span>
+				<span>{playerB && playerB.human_score && `${playerB.human_score} ★`}</span>
 			</label>
-			<p></p>
+			<hr className="separator-lightest"/>
 			<div className={"form-flex-choice"}>
-				<span>Risultato</span>
+				<span>Ris.</span>
 				<div>
 					<label>
 						<input type={"radio"} name={"result"} value={"AWins"} checked={outcome === Outcome.AWins} onChange={e => e.target.checked && setOutcome(Outcome.AWins)}/> Vittoria
@@ -75,13 +81,7 @@ export function ReportBox({players, playerA, playerB, setPlayerB, outcome, setOu
 				</div>
 				<span></span>
 			</div>
-			<p></p>
-			<label>
-				<span>Titolo sfida</span>
-				<input type={"text"} onChange={e => setName(e.target.value)} value={name}/>
-				<small>(opzionale)</small>
-			</label>
-			<p></p>
+			<hr className="separator-lightest"/>
 			<input
 				type={"submit"}
 				value={"Invia"}