fix: resolve frontend ESLint issues

Author: ComputerOracle

frontend/src/components/place-bet-form.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { FormEvent, useState } from "react";
+import { FormEvent, useEffect, useState } from "react";
 import clsx from "clsx";
 import { Market, MarketStatus } from "@/lib/contract/types";
 import { useWallet } from "@/lib/wallet/use-wallet";
@@ -33,10 +33,13 @@ export function PlaceBetForm({ market, onBetSuccess }: PlaceBetFormProps) {
   const [isSubmitting, setIsSubmitting] = useState(false);
   const [submitError, setSubmitError] = useState<string | null>(null);
   const [successMessage, setSuccessMessage] = useState<string | null>(null);
+  const [isMarketClosed, setIsMarketClosed] = useState(false);
 
-  const now = Math.floor(Date.now() / 1000);
-  const marketStatus = getMarketStatus(market, now);
-  const isMarketClosed = marketStatus !== MarketStatus.Active;
+  useEffect(() => {
+    const now = Math.floor(Date.now() / 1000);
+    const marketStatus = getMarketStatus(market, now);
+    setIsMarketClosed(marketStatus !== MarketStatus.Active);
+  }, [market]);
 
   const validateForm = (): boolean => {
     const newErrors: FormErrors = {};

frontend/src/lib/contract/betting-service.ts

@@ -51,15 +51,16 @@ export async function getUserBet(
       return null;
     }
 
+    const betData = result as { outcome_index?: number | bigint; amount?: number | bigint };
     return {
       outcomeIndex:
-        typeof result.outcome_index === "number"
-          ? result.outcome_index
-          : Number(result.outcome_index),
+        typeof betData.outcome_index === "number"
+          ? betData.outcome_index
+          : Number(betData.outcome_index || 0),
       amount:
-        typeof result.amount === "number"
-          ? result.amount
-          : Number(result.amount),
+        typeof betData.amount === "number"
+          ? betData.amount
+          : Number(betData.amount || 0),
     };
   } catch (error) {
     console.error("Error fetching user bet:", error);

frontend/src/lib/contract/market-service.ts

@@ -14,7 +14,7 @@ export async function listMarkets(): Promise<Market[]> {
       return [];
     }
 
-    return result.map((market: any) => parseMarketFromContract(market));
+    return result.map((market: unknown) => parseMarketFromContract(market));
   } catch (error) {
     console.error("Error fetching markets:", error);
     throw error;
@@ -36,16 +36,27 @@ export async function getMarket(marketId: number): Promise<Market> {
   }
 }
 
-function parseMarketFromContract(data: any): Market {
+interface ContractMarketData {
+  id?: number | bigint;
+  creator?: string;
+  title?: string;
+  description?: string;
+  end_time?: number | bigint;
+  outcomes?: string[];
+  resolved?: boolean;
+}
+
+function parseMarketFromContract(data: unknown): Market {
+  const marketData = data as ContractMarketData;
   return {
-    id: typeof data.id === "bigint" ? Number(data.id) : data.id,
-    creator: data.creator || "",
-    title: data.title || "",
-    description: data.description || "",
+    id: typeof marketData.id === "bigint" ? Number(marketData.id) : marketData.id || 0,
+    creator: marketData.creator || "",
+    title: marketData.title || "",
+    description: marketData.description || "",
     end_time:
-      typeof data.end_time === "bigint" ? Number(data.end_time) : data.end_time,
-    outcomes: Array.isArray(data.outcomes) ? data.outcomes : [],
-    resolved: Boolean(data.resolved),
+      typeof marketData.end_time === "bigint" ? Number(marketData.end_time) : marketData.end_time || 0,
+    outcomes: Array.isArray(marketData.outcomes) ? marketData.outcomes : [],
+    resolved: Boolean(marketData.resolved),
   };
 }
 

frontend/src/lib/contract/soroban-client.ts

@@ -1,9 +1,13 @@
-// @ts-nocheck
 import { STELLAR_NETWORK, CONTRACT_ID } from "@/lib/env";
 
-let rpcClient: any = null;
+type SorobanRpcServer = {
+  getAccount: (id: string) => Promise<unknown>;
+  simulateTransaction: (tx: unknown) => Promise<unknown>;
+};
 
-export async function getSorobanClient(): Promise<any> {
+let rpcClient: SorobanRpcServer | null = null;
+
+export async function getSorobanClient(): Promise<SorobanRpcServer> {
   if (!rpcClient) {
     // Dynamic import to avoid TypeScript resolution issues
     const { SorobanRpc } = await import("@stellar/stellar-sdk");
@@ -25,14 +29,14 @@ export function getContractAddress(): string {
 
 export interface InvokeContractOptions {
   method: string;
-  args?: any[];
-  signers?: any[];
+  args?: unknown[];
+  signers?: unknown[];
 }
 
 export async function simulateContractCall(
   method: string,
-  args: any[] = []
-): Promise<any> {
+  args: unknown[] = []
+): Promise<unknown> {
   const { Address, TransactionBuilder, contract, nativeToScVal, scValToNative, SorobanRpc } = await import(
     "@stellar/stellar-sdk"
   );
@@ -44,7 +48,7 @@ export async function simulateContractCall(
     const source = await client.getAccount(contractId);
 
     // Create a contract invocation with simulated parameters
-    const params = args.map((arg: any) => {
+    const params = args.map((arg) => {
       if (typeof arg === "string") {
         return nativeToScVal(arg, { type: "string" });
       }
@@ -70,16 +74,17 @@ export async function simulateContractCall(
     const client_tx = await client.simulateTransaction(tx);
 
     if (SorobanRpc.Api.isSimulationSuccess(client_tx)) {
-      const result = client_tx.result?.retval;
+      const result = (client_tx as { result?: { retval: unknown } }).result?.retval;
       if (result) {
         return scValToNative(result);
       }
       return null;
     } else if (SorobanRpc.Api.isSimulationRestore(client_tx)) {
       throw new Error("Contract needs restore");
     } else if (SorobanRpc.Api.isSimulationError(client_tx)) {
+      const errorMsg = (client_tx as { error?: { message: string } }).error?.message;
       throw new Error(
-        `Simulation error: ${client_tx.error?.message || "Unknown error"}`
+        `Simulation error: ${errorMsg || "Unknown error"}`
       );
     }
   } catch (error) {

frontend/src/lib/env.ts

@@ -8,6 +8,6 @@ export const STELLAR_NETWORK = {
 // NEXT_PUBLIC_ variables are injected at build time by Next.js
 export const CONTRACT_ID = (() => {
   if (typeof globalThis === "undefined") return "";
-  const env = (globalThis as any).process?.env;
+  const env = (globalThis as { process?: { env?: Record<string, string | undefined> } }).process?.env;
   return env?.NEXT_PUBLIC_CONTRACT_ID || "";
 })();

frontend/src/lib/hooks/use-market.ts

@@ -2,7 +2,8 @@
 
 import { useEffect, useState } from "react";
 import { Market } from "@/lib/contract/types";
-import { getMarket, getMarketPool } from "@/lib/contract/market-service";
+import { getMarket } from "@/lib/contract/market-service";
+import { getMarketPool } from "@/lib/contract/betting-service";
 
 interface UseMarketReturn {
   market: Market | null;
@@ -18,7 +19,29 @@ export function useMarket(marketId: number): UseMarketReturn {
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
-  const fetchMarket = async () => {
+  useEffect(() => {
+    const fetchMarket = async () => {
+      setIsLoading(true);
+      setError(null);
+      try {
+        const marketData = await getMarket(marketId);
+        setMarket(marketData);
+
+        const poolData = await getMarketPool(marketId);
+        setPool(poolData);
+      } catch (err) {
+        const message =
+          err instanceof Error ? err.message : "Failed to load market";
+        setError(message);
+      } finally {
+        setIsLoading(false);
+      }
+    };
+
+    void fetchMarket();
+  }, [marketId]);
+
+  const refetch = async () => {
     setIsLoading(true);
     setError(null);
     try {
@@ -36,15 +59,11 @@ export function useMarket(marketId: number): UseMarketReturn {
     }
   };
 
-  useEffect(() => {
-    void fetchMarket();
-  }, [marketId]);
-
   return {
     market,
     pool,
     isLoading,
     error,
-    refetch: fetchMarket,
+    refetch,
   };
 }

frontend/src/lib/hooks/use-markets.ts

@@ -9,7 +9,26 @@ export function useMarkets() {
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
-  const fetchMarkets = async () => {
+  useEffect(() => {
+    const fetchMarkets = async () => {
+      setIsLoading(true);
+      setError(null);
+      try {
+        const data = await listMarkets();
+        setMarkets(data);
+      } catch (err) {
+        const message = err instanceof Error ? err.message : "Failed to load markets";
+        setError(message);
+        console.error("Error loading markets:", err);
+      } finally {
+        setIsLoading(false);
+      }
+    };
+
+    void fetchMarkets();
+  }, []);
+
+  const refetch = async () => {
     setIsLoading(true);
     setError(null);
     try {
@@ -24,11 +43,5 @@ export function useMarkets() {
     }
   };
 
-  useEffect(() => {
-    void fetchMarkets();
-  }, []);
-
-  const refetch = () => void fetchMarkets();
-
   return { markets, isLoading, error, refetch };
 }