src/App.js

import React, { useState } from "react";
import "./App.css";

// 🧩 Company-to-Ticker mapping
const companyToTicker = {
  "Agilent Technologies, Inc.": "A",
  "AAALY": "AAALY",
  "AAC": "AAC",
  "AAC Technologies Holdings Inc.": "AACAY",
  "American Airlines Group Inc.": "AAL",
  "Atlantic American Corporation": "AAME",
  "Applied Optoelectronics, Inc.": "AAOI",
  "AAON, Inc.": "AAON",
  "Advance Auto Parts, Inc.": "AAP",
  "Apple Inc.": "AAPL",
  "American Assets Trust, Inc.": "AAT",
  "AAVL": "AAVL",
  "AAWW": "AAWW",
  "AllianceBernstein Holding L.P.": "AB",
  "AbbVie Inc.": "ABBV",
  "ABC": "ABC",
  "Ameris Bancorp": "ABCB",
  "Cambium Learning Group, Inc.": "ABCD",
  "ABCO": "ABCO",
  "Asbury Automotive Group, Inc.": "ABG",
  "ABIO": "ABIO",
  "American Biltrite Inc.": "ABLT",
  "ABM Industries Incorporated": "ABM",
  "ABMD": "ABMD",
  "Arbor Realty Trust, Inc.": "ABR",
  "Abbott Laboratories": "ABT",
  "Aboitiz Equity Ventures, Inc.": "ABTZY",
  "ACADIA Pharmaceuticals Inc.": "ACAD",
  "Accor SA": "ACCYY",
  "Air Canada": "ACDVF",
  "Adicet Bio, Inc.": "ACET",
  "ACFC": "ACFC",
  "AMC Financial Holdings Inc.": "ACFL",
  "Acorn Energy, Inc.": "ACFN",
  "ACG": "ACG",
  "Agricultural Bank of China Limited": "ACGBY",
  "Arch Capital Group Ltd.": "ACGL",
  "Acadia Healthcare Company, Inc.": "ACHC",
  "ACHN": "ACHN",
  "ACI Worldwide, Inc.": "ACIW",
  "Axcelis Technologies, Inc.": "ACLS",
  "Accenture plc": "ACN",
  "ACNB Corporation": "ACNB",
  "ACOR": "ACOR",
  "Abrdn Income Credit Strategies Fund": "ACP",
  "Ares Commercial Real Estate Corporation": "ACRE",
  "ACRX": "ACRX",
  "ACST": "ACST",
  "Actua Corporation": "ACTA",
  "Acacia Research Corporation": "ACTG",
  "Acura Pharmaceuticals, Inc.": "ACUR",
  "Acciona, S.A.": "ACXIF",
  "Adobe Inc.": "ADBE",
  "Agree Realty Corporation": "ADC",
  "adidas AG": "ADDYY",
  "Aida Engineering, Ltd.": "ADERY",
  "ADES": "ADES",
  "Analog Devices, Inc.": "ADI",
  "Archer-Daniels-Midland Company": "ADM",
  "ADMA Biologics, Inc.": "ADMA",
  "ADMP": "ADMP",
  "Automatic Data Processing, Inc.": "ADP",
  "Adaptive Biotechnologies Corporation": "ADPT",
  "Autodesk, Inc.": "ADSK",
  "ADTRAN Holdings, Inc.": "ADTN",
  "Addus HomeCare Corporation": "ADUS",
  "Ayala Pharmaceuticals, Inc.": "ADXS",
  "Ameren Corporation": "AEE",
  "Aehr Test Systems, Inc.": "AEHR",
  "Advanced Energy Industries, Inc.": "AEIS",
  "AEL": "AEL",
  "Adacel Technologies Limited": "AELTF",
  "Agnico Eagle Mines Limited": "AEM",
  "American Eagle Outfitters, Inc.": "AEO",
  "American Electric Power Company, Inc.": "AEP",
  "AerCap Holdings N.V.": "AER",
  "AERI": "AERI",
  "Aetna Inc.": "AET",
  "AEY": "AEY",
  "AEZS": "AEZS",
  "AFAM": "AFAM",
  "AllianceBernstein National Municipal Income Fund, Inc.": "AFB",
  "Athens Bancshares Corporation": "AFCB",
  "American Financial Group, Inc.": "AFG",
  "Air France-KLM SA": "AFLYY",
  "AFMD": "AFMD",
  "AmTrust Financial Services, Inc.": "AFSI",
  "AFT": "AFT",
  "First Majestic Silver Corp.": "AG",
  "Abrdn Global Dynamic Dividend Fund": "AGD",
  "Agenus Inc.": "AGEN",
  "Alamos Gold Inc.": "AGI",
  "Agios Pharmaceuticals, Inc.": "AGIO",
  "Federal Agricultural Mortgage Corporation": "AGM",
  "AGNC Investment Corp.": "AGNC",
  "Assured Guaranty Ltd.": "AGO",
  "Agile Group Holdings Limited": "AGPYY",
  "Adecoagro S.A.": "AGRO",
  "AF Gruppen ASA": "AGRUF",
  "AGRX": "AGRX",
  "AGTC": "AGTC",
  "Agilysys, Inc.": "AGYS",
  "Aegean Airlines S.A.": "AGZNF",
  "Anhui Conch Cement Company Limited": "AHCHY",
  "AHGP": "AHGP",
  "Armada Hoffler Properties, Inc.": "AHH",
  "Asahi Kasei Corporation": "AHKSY",
  "AHL": "AHL",
  "Koninklijke Ahold Delhaize N.V.": "AHODF",
  "AHPI": "AHPI",
  "Ashford Hospitality Trust, Inc.": "AHT",
  "C3.ai, Inc.": "AI",
  "Aurubis AG": "AIAGF",
  "AIF": "AIF",
  "American International Group, Inc.": "AIG",
  "AIMC": "AIMC",
  "Albany International Corp.": "AIN",
  "Airports of Thailand Public Company Limited": "AIPUY",
  "Global X Artificial Intelligence & Technology ETF": "AIQ",
  "Air Industries Group": "AIRI",
  "Air T, Inc.": "AIRT",
  "Applied Industrial Technologies, Inc.": "AIT",
  "Apartment Investment and Management Company": "AIV",
  "Assurant, Inc.": "AIZ",
  "Arthur J. Gallagher & Co.": "AJG",
  "Ajinomoto Co., Inc.": "AJINY",
  "AJIS Co., Ltd.": "AJISF",
  "Akamai Technologies, Inc.": "AKAM",
  "Akebia Therapeutics, Inc.": "AKBA",
  "Akbank T.A.S.": "AKBTY",
  "Embotelladora Andina S.A.": "AKO-A",
  "Acadia Realty Trust": "AKR",
  "Akzo Nobel N.V.": "AKZOY",
  "Albemarle Corporation": "ALB",
  "Alpha Bank S.A.": "ALBKY",
  "Alico, Inc.": "ALCO",
  "Aldeyra Therapeutics, Inc.": "ALDX",
  "Alexander & Baldwin, Inc.": "ALEX",
  "Align Technology, Inc.": "ALGN",
  "Allegiant Travel Company": "ALGT",
  "ALIM": "ALIM",
  "ALIOF": "ALIOF",
  "Alaska Air Group, Inc.": "ALK",
  "Alkermes plc": "ALKS",
  "The Allstate Corporation": "ALL",
  "Allegion plc": "ALLE",
  "Allot Ltd.": "ALLT",
  "Ally Financial Inc.": "ALLY",
  "Alnylam Pharmaceuticals, Inc.": "ALNY",
  "Analogic Corporation": "ALOG",
  "Astellas Pharma Inc.": "ALPMY",
  "ALR": "ALR",
  "ALSD": "ALSD",
  "Alstom SA": "ALSMY",
  "Allison Transmission Holdings, Inc.": "ALSN",
  "ALTR": "ALTR",
  "Autoliv, Inc.": "ALV",
  "Amadeus IT Group, S.A.": "AMADY",
  "Applied Materials, Inc.": "AMAT",
  "Ambarella, Inc.": "AMBA",
  "Ambac Financial Group, Inc.": "AMBC",
  "American Business Bank": "AMBZ",
  "AMC Entertainment Holdings, Inc.": "AMC",
  "Andatee China Marine Fuel Services Corporation": "AMCF",
  "AMC Networks Inc.": "AMCX",
  "Advanced Micro Devices, Inc.": "AMD",
  "AMETEK, Inc.": "AME",
  "Amedisys, Inc.": "AMED",
  "Affiliated Managers Group, Inc.": "AMG",
  "Amgen Inc.": "AMGN",
  "American Homes 4 Rent": "AMH",
  "Atrium Mortgage Investment Corporation": "AMIVF",
  "A.P. Moller - Maersk A/S": "AMKBY",
  "Amkor Technology, Inc.": "AMKR",
  "AMNB": "AMNB",
  "AMOT": "AMOT",
  "Ameriprise Financial, Inc.": "AMP",
  "Amphastar Pharmaceuticals, Inc.": "AMPH",
  "Amarin Corporation plc": "AMRN",
  "AMRS": "AMRS",
  "American Superconductor Corporation": "AMSC",
  "AMSWA": "AMSWA",
  "American Tower Corporation": "AMT",
  "AMTD IDEA Group": "AMTD",
  "Aemetis, Inc.": "AMTX",
  "American Woodmark Corporation": "AMWD",
  "America Movil, S.A.B. de C.V.": "AMX",
  "Amazon.com, Inc.": "AMZN",
  "AutoNation, Inc.": "AN",
  "ANAC": "ANAC",
  "Anchor Bancorp": "ANCB",
  "Access National Corporation": "ANCX",
  "The Andersons, Inc.": "ANDE",
  "Arista Networks Inc": "ANET",
  "Abercrombie & Fitch Co.": "ANF",
  "Angi Inc.": "ANGI",
  "AngioDynamics, Inc.": "ANGO",
  "Anika Therapeutics, Inc.": "ANIK",
  "ANI Pharmaceuticals, Inc.": "ANIP",
  "ANR": "ANR",
  "Anthera Pharmaceuticals, Inc.": "ANTH",
  "Sphere 3D Corp.": "ANY",
  "Abrdn Total Dynamic Dividend Fund": "AOD",
  "Aon plc": "AON"
};

// 🧭 Reverse mapping (Ticker → Company)
const tickerToCompany = Object.fromEntries(
  Object.entries(companyToTicker).map(([k, v]) => [v, k])
);

function App() {
  const [inputValue, setInputValue] = useState("");
  const [ticker, setTicker] = useState("");
  const [companyName, setCompanyName] = useState("");
  const [forecast, setForecast] = useState("");
  const [loading, setLoading] = useState(false);

  // 🔍 Handle input (detect if company or ticker)
  const handleInputChange = (e) => {
    const value = e.target.value.trim();
    setInputValue(value);

    // Check if user entered a known company name
    if (companyToTicker[value]) {
      setTicker(companyToTicker[value]);
      setCompanyName(value);
    }
    // Or if entered a known ticker
    else if (tickerToCompany[value.toUpperCase()]) {
      setTicker(value.toUpperCase());
      setCompanyName(tickerToCompany[value.toUpperCase()]);
    } else {
      setTicker("");
      setCompanyName("");
    }
  };

  // 🚀 Call Gradio backend API
  const handleForecast = async () => {
    if (!ticker) {
      setForecast("⚠️ Please enter a valid company name or ticker.");
      return;
    }

    setLoading(true);
    try {
      const response = await fetch(
        `${window.location.origin}/api/predict?ticker_symbol=${ticker}`
      );
      const data = await response.json();
      setForecast(data || "No prediction result found.");
    } catch (error) {
      console.error(error);
      setForecast("❌ Error fetching forecast from backend.");
    } finally {
      setLoading(false);
    }
  };

  return (
    <div className="App">
      <h1>📈 Stock Price Forecaster (LSTM)</h1>
      <p>Enter a company name or ticker to predict the next day’s close price.</p>

      <input
        type="text"
        placeholder="e.g., Apple Inc. or AAPL"
        value={inputValue}
        onChange={handleInputChange}
        className="input-box"
      />

      {companyName && ticker && (
        <p className="info-text">
          🏢 <b>{companyName}</b> → 💹 <b>{ticker}</b>
        </p>
      )}

      <button onClick={handleForecast} disabled={loading}>
        {loading ? "Predicting..." : "Get Forecast"}
      </button>

      {forecast && (
        <div className="result-box">
          <h3>Prediction Result</h3>
          <p>{forecast}</p>
        </div>
      )}
    </div>
  );
}

export default App;