Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • marta873/tddd27_2024
1 result
Show changes
Commits on Source (2)
...@@ -63,13 +63,14 @@ const Home = () => { ...@@ -63,13 +63,14 @@ const Home = () => {
<Typography <Typography
variant='h3' variant='h3'
color='primary' color='primary'
paddingLeft={5}
> >
All products All products
</Typography> </Typography>
<Grid container spacing={2}> <Grid container spacing={2}>
{products.map((product) => ( {products.map((product) => (
<Grid key={product.id} item xs={12} sm={6} md={4} lg={3}> <Grid key={product.id} item xs={12} sm={6} md={4} lg={3} display={'flex'} justifyContent={'center'}>
<Product <Product
id={product.id} id={product.id}
ownerID={product.user_id} ownerID={product.user_id}
......
...@@ -12,21 +12,40 @@ import DialogTitle from '@mui/material/DialogTitle'; ...@@ -12,21 +12,40 @@ import DialogTitle from '@mui/material/DialogTitle';
import TextField from '@mui/material/TextField'; import TextField from '@mui/material/TextField';
import MenuItem from '@mui/material/MenuItem'; import MenuItem from '@mui/material/MenuItem';
import { addProduct, getLoggedInUser, getAllProducts } from './utils/api'; import { addProduct, getLoggedInUser, getAllProducts } from './utils/api';
import { useNavigate } from 'react-router-dom';
const user2 = [
{ name: 'GÖRAN', email: 'pengarfinns@inte.nu', age: '48', profilePicture: yellowSuit }
];
const sizes = ['X-Small', 'Small', 'Medium', 'Large', 'X-Large']; const sizes = ['X-Small', 'Small', 'Medium', 'Large', 'X-Large'];
const ProfilePage = () => {
const [user, setUser] = useState({});
const [isLoggedIn, setLoggedIn] = useState(false);
// Fetch user when the component mounts
const navigate = useNavigate();
useEffect(() => {
const fetchUser = async () => {
const result = await getLoggedInUser();
console.log('result: ', result)
if (result != false) {
setUser(result);
setLoggedIn(true)
} else {
navigate('/login')
}
};
fetchUser();
}, []);
const ProfilePage = () => { // Accessing profile information
// Accessing the first element of the user array const currentUser = {
const currentUser = user2[0]; name: user.username,
email: user.email,
//const [products, setProducts] = useState(initialProducts); age: '48',
profilePicture: yellowSuit,
};
// State to manage modal visibility // State to manage modal visibility
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
...@@ -82,7 +101,7 @@ const ProfilePage = () => { ...@@ -82,7 +101,7 @@ const ProfilePage = () => {
price: formData.price, price: formData.price,
rentPrice: formData.rentPrice, rentPrice: formData.rentPrice,
size: formData.size, size: formData.size,
userID: user, userID: user.id,
}; };
try { try {
...@@ -104,7 +123,6 @@ const ProfilePage = () => { ...@@ -104,7 +123,6 @@ const ProfilePage = () => {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [error, setError] = useState(null); const [error, setError] = useState(null);
const [user, setUser] = useState(null);
const [loadingUser, setLoadingUser] = useState(true); const [loadingUser, setLoadingUser] = useState(true);
const [errorUser, setErrorUser] = useState(null); const [errorUser, setErrorUser] = useState(null);
...@@ -112,52 +130,6 @@ const [loadingUser, setLoadingUser] = useState(true); ...@@ -112,52 +130,6 @@ const [loadingUser, setLoadingUser] = useState(true);
const [loadingProducts, setLoadingProducts] = useState(true); const [loadingProducts, setLoadingProducts] = useState(true);
const [errorProducts, setErrorProducts] = useState(null); const [errorProducts, setErrorProducts] = useState(null);
//const [categories, setUser] = useState([]);
//const [loadingCategories, setLoadingUser] = useState(true);
//const [errorCategories, setErrorUser] = useState(null);
//const initialProducts = [
// { name: 'Nunna', picture: nun, price: '29.99' },
// { name: 'Sjuksköterska', picture: sjuksköterska, price: '39.99' },
// { name: 'Nunna', picture: nun, price: '29.99' },
// { name: 'Sjuksköterska', picture: sjuksköterska, price: '39.99' },
// { name: 'Nunna', picture: nun, price: '29.99' },
// { name: 'Sjuksköterska', picture: sjuksköterska, price: '39.99' },
//];
//useEffect(() => {
// axios.get('http://127.0.0.1:8000/themeApp/user/')
// .then(response => {
// setUser(response.data.user);
// console.log("SUcccesss : ", response.data.user);
// setLoadingUser(false);
// })
// .catch(error => {
// setErrorUser(error);
// setLoadingUser(false);
// });
//}, [])
//if (loading) return <p>Loading...</p>;
//if (error) return <p>Error loading products: {error.message}</p>;
// Fetch user when the component mounts
useEffect(() => {
const fetchUser = async () => {
try {
const result = await getLoggedInUser();
setUser(result.id);
// You can perform additional actions here, like updating the UI
} catch (error) {
console.error('Error:', error);
setErrorUser(error);
} finally {
setLoadingUser(false);
}
};
fetchUser();
}, []);
useEffect(() => { useEffect(() => {
const fetchProducts = async () => { const fetchProducts = async () => {
...@@ -195,7 +167,7 @@ const [loadingUser, setLoadingUser] = useState(true); ...@@ -195,7 +167,7 @@ const [loadingUser, setLoadingUser] = useState(true);
{/* Add more user information fields as needed */} {/* Add more user information fields as needed */}
</div> </div>
</div> </div>
<Box sx={{display: 'flex', justifyContent:'center'}}> <Box sx={{display: 'flex', justifyContent:'center'}}>
<Button variant="contained" onClick={handleClickOpen}>Lägg till ny produkt</Button> <Button variant="contained" onClick={handleClickOpen}>Lägg till ny produkt</Button>
</Box> </Box>
<Dialog open={open} onClose={handleClose}> <Dialog open={open} onClose={handleClose}>
...@@ -269,7 +241,7 @@ const [loadingUser, setLoadingUser] = useState(true); ...@@ -269,7 +241,7 @@ const [loadingUser, setLoadingUser] = useState(true);
</Dialog> </Dialog>
<div className="mainContent"> <div className="mainContent">
<div className="productListContainer"> <div className="productListContainer">
<h2 style={{ textAlign: 'center' }}>Currently Listed Products:</h2> <h2 style={{ textAlign: 'center' }}>Dina listade produkter:</h2>
<ul className="productList"> <ul className="productList">
{products.map((product, index) => ( {products.map((product, index) => (
<li key={index} className="productItem" style={{ animationDelay: `${index * 0.4}s` }}> <li key={index} className="productItem" style={{ animationDelay: `${index * 0.4}s` }}>
...@@ -283,10 +255,10 @@ const [loadingUser, setLoadingUser] = useState(true); ...@@ -283,10 +255,10 @@ const [loadingUser, setLoadingUser] = useState(true);
</ul> </ul>
</div> </div>
<div className="notificationSection"> <div className="notificationSection">
<h2 style={{ textAlign: 'center' }}>Notifications:</h2> <h2 style={{ textAlign: 'center' }}>Notifikationer:</h2>
{notifications.length === 0 ? ( {notifications.length === 0 ? (
<div className="noNotifications"> <div className="noNotifications">
<p className="noNotificationsText">No notifications at the moment</p> <p className="noNotificationsText">Inga notifikationer för tillfället</p>
<img src={noNotificationsImage} alt="No Notifications" className="noNotificationsImage" /> <img src={noNotificationsImage} alt="No Notifications" className="noNotificationsImage" />
</div> </div>
) : ( ) : (
......