InfraHub

1
import { useState, useEffect } from 'react'
2

3
export function Members() {
4
  const [members, setMembers] = useState([])
5

6
  useEffect(() => {
7
    // Здесь мы будем загружать список участников с бэкенда
8
    // Например:
9
    // fetch('/api/members').then(res => res.json()).then(setMembers)
10
  }, [])
11

12
  return (
13
    <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
14
      {members.map(member => (
15
        <div key={member.id} className="p-4 border rounded shadow">
16
          <img src={member.avatar} alt={member.name} className="w-20 h-20 rounded-full mx-auto mb-2" />
17
          <h3 className="text-xl font-semibold text-center">{member.name}</h3>
18
          <p className="text-center text-gray-600">{member.role}</p>
19
        </div>
20
      ))}
21
    </div>
22
  )
23
}