Skip to content

Commit

Permalink
fix: border
Browse files Browse the repository at this point in the history
  • Loading branch information
@Valimp
Valimp committed Aug 6, 2024
1 parent 5a86be6 commit 735cbf6
Showing 1 changed file with 52 additions and 22 deletions.
74 changes: 52 additions & 22 deletions src/components/InfoModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export default function ModalInfo({barcode}: ModalInfoProps) {
selectedImages: [],
brands: res.data.product.brands || null,
editors_tags: res.data.product.editors_tags || null,
categories: res.data.product.categories || null,
categories: [],
ingrediants: [],
}
// loop through the images and build the url
Expand Down Expand Up @@ -81,6 +81,15 @@ export default function ModalInfo({barcode}: ModalInfoProps) {
}
}
}
// loop through the categories and keep only the text
const categories = res.data.product.categories_hierarchy
if (categories) {
for (const key in categories) {
if (categories[key]) {
usedData.categories.push(categories[key]);
}
}
}
setTicketInfo(usedData);
setIsLoaded(true);
}).catch((err) => {
Expand Down Expand Up @@ -125,9 +134,28 @@ export default function ModalInfo({barcode}: ModalInfoProps) {
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
Brands : {ticketInfo?.brands}
</Typography>
<Typography>
Categories : {ticketInfo?.categories}
</Typography>
<Box sx={{ border: 'solid 1px black', p: 2 }}>
<Typography sx={{ mt: 2 }}>
Categories :
</Typography>
{ticketInfo?.categories ? (
<Box sx={{ display: 'flex', gap: '10px', alignItems: 'center', justifyContent: 'center', mt:2}}>
<Grid container spacing={2}>
{ticketInfo.categories.map((category: string, index: number) => (
<Grid key={index}>
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
{category}
</Typography>
</Grid>
))}
</Grid>
</Box>
) : (
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
No categories found
</Typography>
)}
</Box>
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
Selected Images :
</Typography>
Expand All @@ -154,26 +182,28 @@ export default function ModalInfo({barcode}: ModalInfoProps) {
No selected images found
</Typography>
)}
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
Ingrediants :
</Typography>
{ticketInfo?.ingrediants ? (
<Box sx={{ display: 'flex', gap: '10px', alignItems: 'center', justifyContent: 'center', mt:2}}>
<Grid container spacing={2}>
{ticketInfo.ingrediants.map((ingrediant: string, index: number) => (
<Grid key={index}>
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
{ingrediant}
</Typography>
</Grid>
))}
</Grid>
</Box>
) : (
<Box sx={{ border: 'solid 1px black', p: 2 }}>
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
No ingrediants found
Ingrediants :
</Typography>
)}
{ticketInfo?.ingrediants ? (
<Box sx={{ display: 'flex', gap: '10px', alignItems: 'center', justifyContent: 'center', mt:2}}>
<Grid container spacing={2}>
{ticketInfo.ingrediants.map((ingrediant: string, index: number) => (
<Grid key={index}>
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
{ingrediant}
</Typography>
</Grid>
))}
</Grid>
</Box>
) : (
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
No ingrediants found
</Typography>
)}
</Box>
<Typography id="modal-modal-description" sx={{ mt: 2 }}>
Images :
</Typography>
Expand Down

0 comments on commit 735cbf6

Please sign in to comment.