dwidge_crud_api_react_hook_fetch_items_quickstart.ts

1import React from 'react';
2import { useCrud } from '@dwidge/crud-api-react';
3
4interface Item {
5  id: string;
6  name: string;
7}
8
9const App: React.FC = () => {
10  const { items, loading, error, refresh } = useCrud<Item>({
11    url: 'https://api.example.com/items',
12  });
13
14  if (loading) return <p>Loading...</p>;
15  if (error) return <p>Error: {error.message}</p>;
16
17  return (
18    <div>
19      <h1>Items</h1>
20      <button onClick={refresh}>Refresh</button>
21      <ul>
22        {items.map((item) => (
23          <li key={item.id}>{item.name}</li>
24        ))}
25      </ul>
26    </div>
27  );
28};
29
30export default App;