Update get backtests

src/Managing.WebApp/src/components/organism/Backtest/backtestRowDetails.tsx

@@ -1,6 +1,7 @@
 import {CardPositionItem, TradeChart} from '..'
 import {
     Backtest,
+    BacktestClient,
     CandlesWithIndicatorsResponse,
     DataClient,
     GetCandlesWithIndicatorsRequest,
@@ -20,6 +21,17 @@ const BacktestRowDetails: React.FC<IBacktestRowDetailsProps> = ({
 }) => {
   const {apiUrl} = useApiUrlStore();
   const dataClient = new DataClient({}, apiUrl);
+  const backtestClient = new BacktestClient({}, apiUrl);
+
+  // Use TanStack Query to load full backtest data
+  const {data: fullBacktestData, isLoading: isLoadingFullBacktest, error: fullBacktestError} = useQuery({
+    queryKey: ['fullBacktest', backtest.id],
+    queryFn: async (): Promise<Backtest> => {
+      return await backtestClient.backtest_Backtest(backtest.id);
+    },
+    staleTime: 5 * 60 * 1000, // 5 minutes
+    gcTime: 10 * 60 * 1000, // 10 minutes (formerly cacheTime)
+  });
 
   // Use TanStack Query to load candles with indicators
   const {data: candlesData, isLoading: isLoadingCandles, error} = useQuery({
@@ -65,9 +77,12 @@ const BacktestRowDetails: React.FC<IBacktestRowDetailsProps> = ({
     gcTime: 10 * 60 * 1000, // 10 minutes (formerly cacheTime)
   });
 
+  // Use the full backtest data if available, otherwise fallback to the original backtest
+  const currentBacktest = fullBacktestData || backtest;
+  
   // Use the data from query or fallback to backtest data
-  const candles = candlesData?.candles || backtest.candles || [];
-  const indicatorsValues = candlesData?.indicatorsValues || backtest.indicatorsValues || {};
+  const candles = candlesData?.candles || currentBacktest.candles || [];
+  const indicatorsValues = candlesData?.indicatorsValues || currentBacktest.indicatorsValues || {};
 
   const {
     positions,
@@ -75,7 +90,7 @@ const BacktestRowDetails: React.FC<IBacktestRowDetailsProps> = ({
     signals,
     statistics,
     config
-  } = backtest;
+  } = currentBacktest;
 
   // Helper function to calculate position open time in hours
   const calculateOpenTimeInHours = (position: any) => {
@@ -301,10 +316,12 @@ const BacktestRowDetails: React.FC<IBacktestRowDetailsProps> = ({
   return (
     <>
       <div className="grid grid-flow-row">
-        {isLoadingCandles && (
+        {(isLoadingCandles || isLoadingFullBacktest) && (
           <div className="flex justify-center items-center p-4">
             <div className="loading loading-spinner loading-lg"></div>
-            <span className="ml-2">Loading candles with indicators...</span>
+            <span className="ml-2">
+              {isLoadingFullBacktest ? "Loading backtest data..." : "Loading candles with indicators..."}
+            </span>
           </div>
         )}
         <div className="grid grid-cols-4 p-5">
@@ -358,7 +375,7 @@ const BacktestRowDetails: React.FC<IBacktestRowDetailsProps> = ({
           <CardText
             title="Optimized Money Management"
             content={
-              "SL: " + backtest.optimizedMoneyManagement?.stopLoss.toFixed(2) + "% TP: " + backtest.optimizedMoneyManagement?.takeProfit.toFixed(2) + "%"
+              "SL: " + currentBacktest.optimizedMoneyManagement?.stopLoss.toFixed(2) + "% TP: " + currentBacktest.optimizedMoneyManagement?.takeProfit.toFixed(2) + "%"
             }
           ></CardText>
           <CardText
@@ -393,7 +410,7 @@ const BacktestRowDetails: React.FC<IBacktestRowDetailsProps> = ({
           ></CardText>
           <CardText
             title="Total Fees"
-            content={"$" + backtest.fees.toLocaleString('en-US', { 
+            content={"$" + currentBacktest.fees.toLocaleString('en-US', { 
               minimumFractionDigits: 2, 
               maximumFractionDigits: 2 
             })}
@@ -415,7 +432,7 @@ const BacktestRowDetails: React.FC<IBacktestRowDetailsProps> = ({
             content={getAverageTradesPerDay() + " trades/day"}
           ></CardText>
         </div>
-        {!isLoadingCandles && (
+        {!isLoadingCandles && !isLoadingFullBacktest && (
           <div className="w-full">
             <figure className="w-full">
               <TradeChart