# Friend Request List Component

The Friend Request List component is a reusable component in a React application that displays a list of friend requests.

## Props

The component accepts the following props:

| Prop Name | Type | Description |
| --- | --- | --- |
| `friendRequests` | `array` | An array of objects representing friend requests. Each object should have the following properties: `id`, `profileImage`, `profileName`, and `userName`. |
| `onAdd` | `function` | A callback function that is called when the "Accept" button is clicked on a friend request. The function should take one argument, which is the object representing the user who sent the friend request. |
| `onDecline` | `function` | A callback function that is called when the "Decline" button is clicked on a friend request. The function should take one argument, which is the object representing the user who sent the friend request. |

## Usage

To use the Friend Request List component, import it into your React component and render it like this:

```jsx
import FriendRequestList from "./components/FriendRequestList";

function App() {
  const friendRequests = [
    {
      id: 1,
      profileImage: "https://via.placeholder.com/50",
      profileName: "John Doe",
      userName: "@johndoe",
    },
    {
      id: 2,
      profileImage: "https://via.placeholder.com/50",
      profileName: "Jane Smith",
      userName: "@janesmith",
    },
    {
      id: 3,
      profileImage: "https://via.placeholder.com/50",
      profileName: "Bob Johnson",
      userName: "@bobjohnson",
    },
  ];

  const onAdd = (user) => {
    alert("Accepted: " + JSON.stringify(user));
  };

  const onDecline = (user) => {
    alert("Declined: " + JSON.stringify(user));
  };

  return (
    <div>
      <FriendRequestList
        friendRequests={friendRequests}
        onAdd={onAdd}
        onDecline={onDecline}
      />
    </div>
  );
}
