import React from 'react';
import { saveAs } from 'file-saver';

class CsvGenerator extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [
        ['Name', 'Age', 'Email'],
        ['John Doe', '25', 'john@example.com'],
        ['Jane Smith', '30', 'jane@example.com'],
        ['Bob Johnson', '35', 'bob@example.com']
      ]
    };
  }

  handleSaveCsv = () => {
    const csvData = this.state.data.map(row => row.join(',')).join('\n');
    const blob = new Blob([csvData], { type: 'text/csv;charset=utf-8' });
    saveAs(blob, 'data.csv');
  }

  render() {
    return (
      <div>
        <button onClick={this.handleSaveCsv}>Save CSV</button>
      </div>
    );
  }
}

function App() {
  return (
    <div>
      <h1>CSV Generator</h1>
      <CsvGenerator />
    </div>
  );
}