Untitled

```
jsx
// App.js
import React, { useState, useEffect } from 'react';
import MatchList from './MatchList';

function App() {
  const [matches, setMatches] = useState([]);
  const [sports, setSports] = useState(['cricket', 'football', 'basketball']);

  useEffect(() => {
    fetch('/api/matches')
      .then(response => response.json())
      .then(data => setMatches(data));
  }, []);

  return (
    <div>
      <h1>Live Scores</h1>
      <select onChange={(e) => setSports([e.target.value])}>
        {sports.map((sport) => (
          <option value={sport}>{sport}</option>
        ))}
      </select>
      <MatchList matches={matches} sport={sports[0]} />
    </div>
  );
}

export default App;
```

```
jsx
// MatchList.js
import React from 'react';

function MatchList({ matches, sport }) {
  return (
    <ul>
      {matches
        .filter((to match) => match.sport === sport)
        .map((match) => (
          <li key={(link unavailable)}>
            {match.team1} vs {match.team2} - {match.score}
          </li>
        ))}
    </ul>
  );
}

export default MatchList;
```

*Backend (Node.js/Express)*

```
// server.js
const express = require('express');
const app = express();
const port = 3000;

const matches = [
  { id: 1, sport: 'cricket', team1: 'Team A', team2: 'Team B', score: '100/2' },
  { id: 2, sport: 'football', team1: 'Team C', team2: 'Team D', score: '2-1' },
  // ...
];

app.get('/api/matches', (req, res) => {
  res.json(matches);
});

app.listen(port, () => {
  console.log(`Server started on port ${port}`);
});
```

*Database (MongoDB)*

```
// database.js
const mongoose = require('mongoose');

mongoose.connect('mongodb://localhost/livescores', { useNewUrlParser: true });

const matchSchema = new mongoose.Schema({
  sport: String,
  team1: String,
  team2: String,
  score: String,
});

const Match = mongoose.model('Match', matchSchema);

module.exports = Match;
``