// Basic JS file with review issues

import React, { useState } from 'react';

// 1. Component không dùng prop types
function Demo(props) {
  // 2. State không khởi tạo đúng kiểu
  const [count, setCount] = useState('0'); // Nên là số

  // 3. Hàm không dùng
  function unusedFunc() {
    return 'unused';
  }

  // 4. Truy cập props không tồn tại
  const name = props.username;

  // 5. Render mảng không có key
  const arr = [1,2,3];
  const list = arr.map(item => <li>{item}</li>);

  // 6. Inline style sai cú pháp
  const style = { color: 'red', fontWeight: 500 };

  // 7. Sử dụng biến chưa khai báo
  let result = value + 1;

  // 8. Sử dụng setState sai
  setCount(count++);

  // 9. Return nhiều phần tử không bọc Fragment
  return (
    <div style={style}>
      <span>Test</span>
      {list}
      <button onClick={() => setCount('abc')}>Click</button>
      <p>{name}</p>
    </div>
    <h1>Unwrapped</h1>
  ) // Không bọc Fragment
}

// 10. Export sai kiểu
export { Demo };