From 4f59209bf23a4b2f1748b72b79a461099a9bd16c Mon Sep 17 00:00:00 2001
From: Tim Neutkens <tim@timneutkens.nl>
Date: Fri, 16 Oct 2020 19:09:18 +0200
Subject: [PATCH] Update default configuration to match image optimization
 (#17943)

Co-authored-by: Steven <steven@ceriously.com>
---
 packages/next/client/image.tsx             | 17 +++++++++--------
 packages/next/next-server/server/config.ts |  2 +-
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/packages/next/client/image.tsx b/packages/next/client/image.tsx
index 6681eac02e10400..b58b7b49d4f853b 100644
--- a/packages/next/client/image.tsx
+++ b/packages/next/client/image.tsx
@@ -52,7 +52,7 @@ function computeSrc(src: string, host: string, unoptimized: boolean): string {
 
 function callLoader(src: string, host: string, width?: number): string {
   let loader = loaders[imageData.hosts[host].loader || 'default']
-  return loader({ root: imageData.hosts[host].path, filename: src, width })
+  return loader({ root: imageData.hosts[host].path, src, width })
 }
 
 type SrcSetData = {
@@ -166,18 +166,19 @@ export default function Image({
 
 type LoaderProps = {
   root: string
-  filename: string
+  src: string
   width?: number
 }
 
-function imgixLoader({ root, filename, width }: LoaderProps): string {
-  return `${root}${filename}${width ? '?w=' + width : ''}`
+function imgixLoader({ root, src, width }: LoaderProps): string {
+  return `${root}${src}${width ? '?w=' + width : ''}`
 }
 
-function cloudinaryLoader({ root, filename, width }: LoaderProps): string {
-  return `${root}${width ? 'w_' + width + '/' : ''}${filename}`
+function cloudinaryLoader({ root, src, width }: LoaderProps): string {
+  return `${root}${width ? 'w_' + width + '/' : ''}${src}`
 }
 
-function defaultLoader({ root, filename }: LoaderProps): string {
-  return `${root}${filename}`
+function defaultLoader({ root, src, width }: LoaderProps): string {
+  // TODO: change quality parameter to be configurable
+  return `${root}?url=${encodeURIComponent(src)}&width=${width}&q=100`
 }
diff --git a/packages/next/next-server/server/config.ts b/packages/next/next-server/server/config.ts
index 891632794e63333..dabf639b15cf5b0 100644
--- a/packages/next/next-server/server/config.ts
+++ b/packages/next/next-server/server/config.ts
@@ -26,7 +26,7 @@ const defaultConfig: { [key: string]: any } = {
   images: {
     sizes: [320, 420, 768, 1024, 1200],
     domains: [],
-    hosts: { default: { path: 'defaultconfig' } },
+    hosts: { default: { path: '/_next/image' } },
   },
   devIndicators: {
     buildActivity: true,