refactor: rename "product" to "video" (foyzulkarim#28)

client/src/pages/ProductsPage.js

@@ -3,7 +3,7 @@ import { useState } from 'react';
 // @mui
 import { Container, Stack, Typography } from '@mui/material';
 // components
-import { ProductSort, ProductList, ProductCartWidget, ProductFilterSidebar } from '../sections/@dashboard/products';
+import { ProductSort, VideoList, ProductCartWidget, ProductFilterSidebar } from '../sections/@dashboard/products';
 // mock
 import PRODUCTS from '../_mock/products';
 
@@ -42,7 +42,7 @@ export default function ProductsPage() {
           </Stack>
         </Stack>
 
-        <ProductList products={PRODUCTS} />
+        <VideoList videos={PRODUCTS} />
         <ProductCartWidget />
       </Container>
     </>

client/src/sections/@dashboard/products/ProductCard.js → client/src/sections/@dashboard/products/VideoCard.js

@@ -21,11 +21,11 @@ const StyledProductImg = styled('img')({
 
 // ----------------------------------------------------------------------
 
-ShopProductCard.propTypes = {
-  product: PropTypes.object,
+VideoCard.propTypes = {
+  video: PropTypes.object,
 };
 
-export default function ShopProductCard({ video }) {
+export default function VideoCard({ video }) {
   const {
     title: name,
     thumbnailUrl: cover,

client/src/sections/@dashboard/products/VideoList.js

@@ -0,0 +1,22 @@
+import PropTypes from 'prop-types';
+// @mui
+import { Grid } from '@mui/material';
+import VideoCard from './VideoCard';
+
+// ----------------------------------------------------------------------
+
+VideoList.propTypes = {
+  videos: PropTypes.array.isRequired,
+};
+
+export default function VideoList({ videos = [], ...other }) {
+  return (
+    <Grid container spacing={3} {...other}>
+      {videos.map((video) => (
+        <Grid key={video.id} item xs={12} sm={6} md={3}>
+          <VideoCard video={video} />
+        </Grid>
+      ))}
+    </Grid>
+  );
+}

client/src/sections/@dashboard/products/index.js

@@ -1,5 +1,5 @@
-export { default as ProductCard } from './ProductCard';
-export { default as ProductList } from './ProductList';
+export { default as VideoCard } from './VideoCard';
+export { default as VideoList } from './VideoList';
 export { default as ProductSort } from './ProductSort';
 export { default as ProductCartWidget } from './ProductCartWidget';
 export { default as ProductFilterSidebar } from './ProductFilterSidebar';