From 3621e3d87a25a3367dee46dafe2edfee2de56a08 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Tue, 14 Jan 2025 15:41:18 +0000
Subject: [PATCH] Add metrics display to post-choice screen

Implement the metrics component in the post-choice screen to visualize how the metrics change based on the deployed strategy. This enhancement allows users to see the impact of their choices in real-time.
[skip gpt_engineer]
---
 src/pages/Index.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx
index 0199fa9..6410f5f 100644
--- a/src/pages/Index.tsx
+++ b/src/pages/Index.tsx
@@ -33,6 +33,7 @@ import { Footer } from '../components/Footer';
 import { useTranslation } from 'react-i18next';
 import { LanguageSwitcher } from '@/components/LanguageSwitcher';
 import '@/i18n/config';
+import { MetricsDisplay } from "@/components/game/MetricsDisplay";
 
 const Index = () => {
   const { t } = useTranslation();
@@ -359,6 +360,10 @@ const Index = () => {
               </div>
             </CardHeader>
             <CardContent className="space-y-6">
+              <div className="bg-gray-800/30 p-6 rounded-md border border-gray-700">
+                <MetricsDisplay choices={previousChoices} className="pl-0" />
+              </div>
+
               <div>
                 <h3 className="text-yellow-500 font-semibold mb-3">{t('analysis.keyInsights')}</h3>
                 <ul className="space-y-2">
@@ -485,7 +490,7 @@ const Index = () => {
                       )}
                       {selectedChoice.weakenedBy?.some(choice => previousChoices.includes(choice)) && (
                         <div className="flex items-start gap-2">
-                          <span className="text-red-400">���</span>
+                          <span className="text-red-400">↓</span>
                           <div>
                             <span className="text-red-400">Weakened</span>
                             <span className="text-gray-400"> by: </span>