feat: set a better type for the default image loader

Apply suggestions from code review

Co-authored-by: Tim Neutkens <tim@timneutkens.nl>

move types

packages/next/client/image.tsx

@@ -17,7 +17,9 @@ import {
 import { ImageConfigContext } from '../shared/lib/image-config-context'
 import { warnOnce } from '../shared/lib/utils'
 // @ts-ignore - This is replaced by webpack alias
-import defaultLoader from 'next/dist/shared/lib/image-loader'
+import defaultLoader, {
+  type ImageLoaderProps,
+} from 'next/dist/shared/lib/image-loader'
 
 const configEnv = process.env.__NEXT_IMAGE_OPTS as any as ImageConfigComplete
 const allImgs = new Map<
@@ -35,12 +37,6 @@ type LoadingValue = typeof VALID_LOADING_VALUES[number]
 type ImageConfig = ImageConfigComplete & { allSizes: number[] }
 export type ImageLoader = (p: ImageLoaderProps) => string
 
-export type ImageLoaderProps = {
-  src: string
-  width: number
-  quality?: number
-}
-
 // Do not export - this is an internal type only
 // because `next.config.js` is only meant for the
 // built-in loaders, not for a custom loader() prop.

packages/next/shared/lib/image-loader.ts

@@ -1,5 +1,21 @@
-// TODO: change "any" to actual type
-function defaultLoader({ config, src, width, quality }: any): string {
+import type { ImageConfig } from './image-config'
+
+export type ImageLoaderProps = {
+  src: string
+  width: number
+  quality?: number
+}
+
+export type ImageLoaderPropsWithConfig = ImageLoaderProps & {
+  config: Readonly<ImageConfig>
+}
+
+function defaultLoader({
+  config,
+  src,
+  width,
+  quality,
+}: ImageLoaderPropsWithConfig): string {
   if (process.env.NODE_ENV !== 'production') {
     const missingValues = []