import React, { useState } from 'react'; import { BarChart, Bar, XAxis, YAxis, Tooltip, Legend, ResponsiveContainer } from 'recharts'; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; const commoditiesData = [ { name: 'Corn', stocks: 13.75, price: 418, score: 71, signalScore: 58, ytdRally: 8.6, managedMoneyBuying: 55, totalScore: 43.4 }, { name: 'Soybeans', stocks: 12.53, price: 1058, score: 97, signalScore: 83, ytdRally: 10.8, managedMoneyBuying: 25, totalScore: 50.2 }, { name: 'Wheat', stocks: 38.58, price: 624, score: 85, signalScore: 59, ytdRally: 10.8, managedMoneyBuying: 45, totalScore: 46.8 } ]; const CommodityCard = ({ commodity }) => ( {commodity.name}

${commodity.price}

Stocks: {commodity.stocks}%

Total Score: {commodity.totalScore}

); const ChartTab = ({ data, dataKey, name }) => ( ); const Dashboard = () => { const [activeTab, setActiveTab] = useState("scores"); return (

Agricultural Commodities Dashboard

{commoditiesData.map(commodity => ( ))}

Scores Stocks YTD Rally Managed Money Buying

); }; export default Dashboard;

top of page

bottom of page