diff --git a/src/client/dd-hub-react/src/api/product-service.ts b/src/client/dd-hub-react/src/api/product-service.ts
index 63e6cb7..966a39a 100644
--- a/src/client/dd-hub-react/src/api/product-service.ts
+++ b/src/client/dd-hub-react/src/api/product-service.ts
@@ -1,4 +1,4 @@
-export type ProductItemProps = {
+export type Product = {
   id: string;
   name: string;
   price: number;
@@ -12,7 +12,7 @@ export type ProductItemProps = {
  * send a request to the server to get the products
  * @returns Array of products
  */
-export function getProducts(): Promise<ProductItemProps[]> {
+export function getProducts(): Promise<Product[]> {
     //TODO: Implement the API call using fetch or axios
     return Promise.resolve([
         {
diff --git a/src/client/dd-hub-react/src/sections/product/product-item.tsx b/src/client/dd-hub-react/src/sections/product/product-item.tsx
index cfbe0df..982bc1d 100644
--- a/src/client/dd-hub-react/src/sections/product/product-item.tsx
+++ b/src/client/dd-hub-react/src/sections/product/product-item.tsx
@@ -8,14 +8,14 @@ import Typography from '@mui/material/Typography';
 
 import { fCurrency } from 'src/utils/format-number';
 
-import { ProductItemProps } from 'src/api/product-service';
+import { Product } from 'src/api/product-service';
 
 import { Label } from 'src/components/label';
 import { ColorPreview } from 'src/components/color-utils';
 
 // ----------------------------------------------------------------------
 
-export function ProductItem({ product }: { product: ProductItemProps }) {
+export function ProductItem({ product }: { product: Product }) {
   const renderStatus = (
     <Label
       variant="inverted"
diff --git a/src/client/dd-hub-react/src/sections/product/view/products-view.tsx b/src/client/dd-hub-react/src/sections/product/view/products-view.tsx
index 4cccc41..127b9a8 100644
--- a/src/client/dd-hub-react/src/sections/product/view/products-view.tsx
+++ b/src/client/dd-hub-react/src/sections/product/view/products-view.tsx
@@ -7,7 +7,7 @@ import Typography from '@mui/material/Typography';
 
 import { _products } from 'src/_mock';
 import { DashboardContent } from 'src/layouts/dashboard';
-import { getProducts, ProductItemProps } from 'src/api/product-service';
+import { getProducts, Product } from 'src/api/product-service';
 
 import { ProductSort } from '../product-sort';
 import { ProductItem } from '../product-item';
@@ -65,7 +65,7 @@ export function ProductsView() {
 
   const [filters, setFilters] = useState<FiltersProps>(defaultFilters);
 
-  const [products, setProducts] = useState<Array<ProductItemProps>>([]);
+  const [products, setProducts] = useState<Array<Product>>([]);
 
   const handleOpenFilter = useCallback(() => {
     setOpenFilter(true);