image issue solved

components/Brands/AboutInfoBrands.js

@@ -2,6 +2,7 @@ import React from 'react'
 import { Col, Row } from 'react-bootstrap'
 import Heading from "@/components/Heading";
 import Image from 'next/image';
+
 const AboutInfoBrands = () => {
   return (
     <>

components/Brands/InnerBannerBrands.js

-import Image from 'next/image'
 import React from 'react'
 import { Col, Row } from 'react-bootstrap'
 import { cleanImage } from '../services/imageHandling'
 import Heading from "@/components/Heading";
+import Image from 'next/image';
 const InnerBannerBrands = ({subCategoryData}) => {
     console.log("bannerData", subCategoryData)
   return (

components/Collection/InnerBannerproduct.js

-import Image from 'next/image'
 import React from 'react'
 import { Col, Row } from 'react-bootstrap'
 import { cleanImage } from '../services/imageHandling'
 import Heading from "@/components/Heading";
+import Image from 'next/image';
 const InnerBannerproduct = ({productData}) => {
     console.log("bannerData", productData)
   return (

components/Common/InnerBanner.js

-import Image from 'next/image'
 import React from 'react'
 import { Col, Row } from 'react-bootstrap'
 import { cleanImage } from '../services/imageHandling'
+import Image from 'next/image'
 
 const InnerBanner = ({bannerData}) => {
     console.log("bannerData", bannerData)

components/Layout/SubMenu.js

-import Image from 'next/image'
 import Link from 'next/link'
 import React from 'react'
 import { Col, Row } from 'react-bootstrap'
 import { cleanImage } from '../services/imageHandling'
+import Image from 'next/image'
 
 export const SubMenu = ({ data, menuTitle }) => {
     // console.log(data, 'menudata');