p5/8 done

labs/lab7/src/main/components/Gallery.tsx

@@ -4,8 +4,10 @@ import structures from "../../data";
 import Box from '@mui/material/Box';
 import Container from '@mui/material/Container';
 import ImageListItemBar from '@mui/material/ImageListItemBar';
+import { Link } from 'react-router-dom';
 const imgData = structures.slice(0, -1);
 
+
 function Gallery() {
   return (
     <Container maxWidth="lg">
@@ -21,7 +23,8 @@ function Gallery() {
             },
           }}
           gap={8}>
-          {imgData.map((item) => (
+          {imgData.map((item, index) => (
+            <Link key={index} to={"/building/" + index}>
             <ImageListItem key={item.img}>
               <img
                 srcSet={item.img}
@@ -29,8 +32,9 @@ function Gallery() {
                 alt={item.title}
                 loading="lazy"
               />
-              <ImageListItemBar position="bottom" title={ item.title } />
+              <ImageListItemBar position="bottom" title={item.title} />
             </ImageListItem>
+          </Link>
           ))}
         </ImageList>
       </Box>