import React from 'react';

const CodeSuggestions = () => {
  const suggestions = [
    'function add(a, b) { return a + b; }',
    'const multiply = (a, b) => a * b;',
    'class Person { constructor(name) { this.name = name; } }',
    'async function fetchData() { const response = await fetch(url); return response.json(); }',
    'const array = [1, 2, 3].map(x => x * 2);',
    'const filtered = array.filter(x => x > 2);'
  ];

  return (
    <div className="w-full">
      <h3 className="text-lg font-semibold mb-4 text-gray-700">Code Snippets</h3>
      <div className="space-y-2">
        {suggestions.map((snippet, index) => (
          <div
            key={index}
            className="p-3 bg-gray-100 rounded-lg hover:bg-gray-200 cursor-pointer transition-colors"
          >
            <pre className="text-sm text-gray-800 font-mono">{snippet}</pre>
          </div>
        ))}
      </div>
    </div>
  );
};

export default CodeSuggestions;