Class based Image loader

ImageLoader.tsx

import React from "react";
import { Image, ImageProps } from "next/image";

type ImageLoaderProps = Omit<ImageProps, "src"> & {
  src: string;
};

class ImageLoader extends React.Component<ImageLoaderProps> {
  public loader({ src, width, quality }: ImageLoaderProps): string {
    return `${src}?w=${width}&q=${quality || 75}`;
  }

  public render(): JSX.Element {
    const { src, ...props } = this.props;

    return <Image loader={this.loader} src={src} {...props} />;
  }
}

export default ImageLoader;