31 lines
925 B
JavaScript
31 lines
925 B
JavaScript
// src/components/Items.js
|
|
import React, { useEffect, useState } from 'react';
|
|
import { Container, List, ListItem, ListItemText } from '@mui/material';
|
|
import axios from 'axios';
|
|
import { useParams } from 'react-router-dom'; // Import useParams
|
|
|
|
|
|
export default function Items({ token }) {
|
|
const { id: boxId } = useParams(); // Get boxId from URL parameters
|
|
const [items, setItems] = useState([]);
|
|
console.log("boxId is " + boxId)
|
|
useEffect(() => {
|
|
axios.get(`${process.env.REACT_APP_API_URL}/boxes/${boxId}/items`, {
|
|
headers: { Authorization: `Bearer ${token}` }
|
|
}).then(response => {
|
|
setItems(response.data);
|
|
});
|
|
}, [boxId, token]);
|
|
|
|
return (
|
|
<Container>
|
|
<List>
|
|
{items.map((item) => (
|
|
<ListItem key={item.id}>
|
|
<ListItemText primary={item.name} secondary={item.description} />
|
|
</ListItem>
|
|
))}
|
|
</List>
|
|
</Container>
|
|
);
|
|
} |