some correction

Herman-Riah19 · Nov 17, 2023 · bea4de9 · bea4de9
1 parent cf5b71c
commit bea4de9
Show file tree

Hide file tree

Showing 9 changed files with 31 additions and 13 deletions.
diff --git a/app/Controllers/Http/ProductsController.ts b/app/Controllers/Http/ProductsController.ts
@@ -54,7 +54,8 @@ export default class ProductsController {
   }
 
   public async show({ inertia, params, auth }: HttpContextContract) {
-    const product = await Product.findBy('id', params.id)
+    const productName = params.name.split('_').join(' ')
+    const product = await Product.findBy('name', productName)
     const assetUrl = await Drive.getUrl('./products')
 
     const AllComments = await Comment.all()

diff --git a/resources/js/Components/Card/CardPost.js b/resources/js/Components/Card/CardPost.js
@@ -2,10 +2,10 @@ import React from 'react'
 import {Card, CardContent, CardActionArea, CardMedia, Typography} from '@mui/material'
 import { Link } from '@inertiajs/inertia-react'
 
-const CardPost = ({title, slug, content, imageUrl, classes}) => {
+const CardPost = ({key, title, slug, content, imageUrl, classes}) => {
 
   return (
-    <Card sx={classes}>
+    <Card key={key} sx={classes}>
         <CardActionArea>
             <Link href={`/post/${slug}`}>
                 <CardMedia component="img" sx={{height: '120px',overflow: 'hidden'}} image={imageUrl} alt={title}/>

diff --git a/resources/js/Components/Card/CardProduct.js b/resources/js/Components/Card/CardProduct.js
@@ -37,11 +37,12 @@ const classes = {
   },
 };
 
-const CardProduct = ({ product, username, url }) => {
+const CardProduct = ({ key, product, username, url }) => {
+  const productName = product.name.split(' ').join('_')
   return (
-    <Card sx={classes.card}>
+    <Card key={key} sx={classes.card}>
       <CardActionArea>
-        <Link href={`/product/show/${product.id}`}>
+        <Link href={`/product/show/${productName}`}>
           <CardMedia
             component="img"
             sx={classes.img}

diff --git a/resources/js/Components/Card/CardUser.js b/resources/js/Components/Card/CardUser.js
@@ -6,6 +6,7 @@ const CardUser = ({ user, avatar, profile }) => {
   const username = user.username.split(' ').join('_')
   return (
     <Card 
+      key={user.id}
       sx={{ 
         m: '12px', 
         color: '#000', 

diff --git a/resources/js/Pages/Home/Collections.js b/resources/js/Pages/Home/Collections.js
@@ -70,6 +70,7 @@ const Collections = ({ auth, avatarUrl, authenticateProfile, categories, product
               <Tab label='All' sx={{ color: '#c7d4e1', textTransform: 'capitalize' }} />
               {categories.map(section => (
                 <Tab
+                  key={section.id}
                   label={section.name}
                   sx={{ color: '#c7d4e1', textTransform: 'capitalize' }} />
               ))}
@@ -83,7 +84,11 @@ const Collections = ({ auth, avatarUrl, authenticateProfile, categories, product
                 const user = findUserById(product.user_id)
                 return (
                   <Grid item xs={12} sm={6} md={4} lg={3}>
-                    <CardProduct product={product} username={user.username} url={productUrl} />
+                    <CardProduct
+                      key={product.id} 
+                      product={product} 
+                      username={user.username} 
+                      url={productUrl} />
                   </Grid>
                 )
               })}
@@ -100,7 +105,11 @@ const Collections = ({ auth, avatarUrl, authenticateProfile, categories, product
                     const user = findUserById(product.user_id)
                     return (
                       <Grid item xs={12} sm={6} md={4} lg={3}>
-                        <CardProduct product={product} username={user.username} url={productUrl} />
+                        <CardProduct 
+                          key={product.id}
+                          product={product} 
+                          username={user.username} 
+                          url={productUrl} />
                       </Grid>
                     )
                   })}
@@ -139,6 +148,7 @@ const Collections = ({ auth, avatarUrl, authenticateProfile, categories, product
             {posts.map(post => (
               <SwiperSlide>
                 <CardPost
+                  key={post.id}
                   title={post.title}
                   slug={post.slug}
                   content={post.description}

diff --git a/resources/js/Pages/Home/Home.js b/resources/js/Pages/Home/Home.js
@@ -139,7 +139,7 @@ export default function Home({
             scrollbar={{ draggable: true }}
           >
             {categories.map((categ) => (
-              <SwiperSlide>
+              <SwiperSlide key={categ.id}>
                 <CardCategorie
                   categorie={categ}
                   categorieUrl={categorieUrl}
@@ -183,7 +183,7 @@ export default function Home({
                   scrollbar={{ draggable: true }}
                 >
                   {posts.map((post) => (
-                    <SwiperSlide>
+                    <SwiperSlide key={post.id}>
                       <CardPost
                         title={post.title}
                         slug={post.slug}
@@ -211,7 +211,7 @@ export default function Home({
             {users.map((artist) => {
               const profile = getProfileByUser(artist);
               return (
-                <SwiperSlide>
+                <SwiperSlide key={artist.id}>
                   {artist.role_id != 2 && (
                     <CardUserProfile
                       user={artist}
@@ -232,8 +232,9 @@ export default function Home({
             {products.map((product) => {
               const user = findUserById(product.user_id);
               return (
-                <Grid item xs={12} sm={5} md={4} lg={3}>
+                <Grid item xs={12} sm={5} md={4} lg={3} >
                   <CardProduct
+                    key={product.id}
                     product={product}
                     username={user.username}
                     url={productUrl}
@@ -256,6 +257,7 @@ export default function Home({
             {posts.map((post) => (
               <SwiperSlide>
                 <CardPost
+                  key={post.id}
                   title={post.title}
                   slug={post.slug}
                   content={post.description}

diff --git a/resources/js/Pages/Home/Search.js b/resources/js/Pages/Home/Search.js
@@ -77,6 +77,7 @@ const Search = (props) => {
           <Grid container spacing={2}>
             <Grid item xs={12} sm={6} md={4} lg={3}>
               <CardProduct
+                key={product.id}
                 product={product}
                 username={user.username}
                 url={productUrl}
@@ -89,6 +90,7 @@ const Search = (props) => {
               {existProducts.map((prod) => (
                 <Grid key={prod.id} item xs={12} sm={6} md={4} lg={3}>
                   <CardProduct
+                    key={prod.id}
                     product={prod}
                     username={findUserById(prod.user_id).username}
                     url={productUrl}

diff --git a/resources/js/Pages/Product/ProductShow.js b/resources/js/Pages/Product/ProductShow.js
@@ -154,6 +154,7 @@ const ProductShow = ({
               return (
                 <Grid item xs={12} sm={6} md={4} lg={3}>
                   <CardProduct
+                    key={item.id}
                     product={item}
                     username={user.username}
                     url={assetUrl}

diff --git a/start/routes.ts b/start/routes.ts
@@ -26,7 +26,7 @@ Route.group(() => {
         Route.post('/create', 'ProductsController.store')
         Route.post('/show/:id', 'ProductsController.addComment')
     }).middleware('auth')
-    Route.get('/show/:id', 'ProductsController.show').as('product.show')
+    Route.get('/show/:name', 'ProductsController.show').as('product.show')
     Route.get('/is-liked/:id', 'ProductsController.handleIsLiked').middleware('auth')
     Route.get('/download/:id', 'ProductsController.download').as('product.download')
 }).prefix('/product')