Removed the map function

src/Components/ExpandedMaterials.js

@@ -7,6 +7,7 @@ import Button from '@material-ui/core/Button';
 import ExpandedMaterialCard from './ExpandedMaterialCard';
 import Paper from '@material-ui/core/Paper';
 import Library from '@material-ui/icons/LibraryBooks';
+import {Link} from 'react-router-dom';
 
 const useStyles = makeStyles((theme) => ({
     root: {
@@ -53,9 +54,11 @@ const ExpandedMaterial = (props) => {
                             }
                         </DevelopedByDiv>
                         <SizedHeightBox3 />
-                        <Button variant="contained" color="secondary">
-                            Ver todos
-                        </Button>
+                        <StyledLink to={`/colecao?colecao=${material.id}`}>
+                            <Button variant="contained" color="secondary">
+                                Ver todos
+                            </Button>
+                        </StyledLink>
                     </Grid>
                 </Grid>
                 <Grid item direction="column" xs={8}>
@@ -68,24 +71,24 @@ const ExpandedMaterial = (props) => {
                     </Grid>
                     <SizedHeightBox />
                     <Grid container direction="row" spacing={3}>
-                        {/* <Grid item md={3}>
+                        <Grid item md={4}>
+                            <ExpandedMaterialCard
+                                name={material.topics[0].pre_title + material.topics[0].title}
+                                thumb={material.topics[0].img}
+                            />
+                        </Grid>
+                        <Grid item md={4}>
                             <ExpandedMaterialCard
                                 name={material.topics[1].pre_title + material.topics[1].title}
                                 thumb={material.topics[1].img}
                             />
-                        </Grid> */}
-                        {
-                            material.topics.map((material, index) => {
-                                return (
-                                    <Grid item key={index} md={4}>
-                                        <ExpandedMaterialCard
-                                            name={material.pre_title + material.title}
-                                            thumb={material.img}
-                                        />
-                                    </Grid>
-                                )
-                            })
-                        }
+                        </Grid>
+                        <Grid item md={4}>
+                            <ExpandedMaterialCard
+                                name={material.topics[2].pre_title + material.topics[2].title}
+                                thumb={material.topics[2].img}
+                            />
+                        </Grid>
                     </Grid>
                 </Grid>
             </Grid>
@@ -117,5 +120,10 @@ const SizedHeightBox3 = styled.div`
 const SizedWidthBox = styled.div`
   width : 5px;
 `
+const StyledLink = styled(Link)`
+	text-decoration: none !important;
+	color: inherit !important;
+`
+
 
 export default ExpandedMaterial;
\ No newline at end of file