From 1d35168b5c859ef12d556fd5f4f33033c61bb427 Mon Sep 17 00:00:00 2001
From: Aleksandar Shumakov <a.shumakov97@gmail.com>
Date: Fri, 10 May 2024 12:23:07 +0300
Subject: [PATCH] Replace hardcoded thumbnail URI and host with configurable
 ones

---
 README.md            | 2 ++
 src/redux/preview.js | 4 ++--
 webpack.config.js    | 4 +++-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index a6f125880..0ea39c56d 100644
--- a/README.md
+++ b/README.md
@@ -166,6 +166,8 @@ the beginning of the command, before `npm start`:
 | `BACKPACK_HOST` | `https://backpack.scratch.mit.edu` | Hostname for backpack requests                 |
 | `PROJECT_HOST`  | `https://projects.scratch.mit.edu` | Hostname for project requests                  |
 | `FALLBACK`      | `''`                               | Pass-through location for old site             |
+| `THUMBNAIL_URI` | `/intenralapi/project/thumbnail/{}/set/`| URI template for updating project thumbnails, `{}` is replaced by the project ID when invoking a request |
+| `THUMBNAIL_HOST` | `''` | Hostname for uploader service|
 | `GTM_ID`        | `''`                               | Google Tag Manager ID                          |
 | `GTM_ENV_AUTH`  | `''`                               | Google Tag Manager env and auth info           |
 | `NODE_ENV`      | `null`                             | If not `production`, app acts like development |
diff --git a/src/redux/preview.js b/src/redux/preview.js
index dc11478ed..6c81a0095 100644
--- a/src/redux/preview.js
+++ b/src/redux/preview.js
@@ -689,7 +689,7 @@ module.exports.reportProject = (id, jsonData, token) => (dispatch => {
 module.exports.updateProjectThumbnail = (id, blob) => (dispatch => {
     dispatch(module.exports.setFetchStatus('project-thumbnail', module.exports.Status.FETCHING));
     api({
-        uri: `/internalapi/project/thumbnail/${id}/set/`,
+        uri: `${process.env.THUMBNAIL_URI.replace('{}', id)}`,
         method: 'POST',
         headers: {
             'Content-Type': 'image/png'
@@ -697,7 +697,7 @@ module.exports.updateProjectThumbnail = (id, blob) => (dispatch => {
         withCredentials: true,
         useCsrf: true,
         body: blob,
-        host: '' // Not handled by the API, use existing infrastructure
+        host: process.env.THUMBNAIL_HOST
     }, (err, body, res) => {
         if (err || res.statusCode !== 200) {
             dispatch(module.exports.setFetchStatus('project-thumbnail', module.exports.Status.ERROR));
diff --git a/webpack.config.js b/webpack.config.js
index 800ed86e3..becf4eb94 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -248,7 +248,9 @@ module.exports = {
             'process.env.CLOUDDATA_HOST': `"${process.env.CLOUDDATA_HOST || 'clouddata.scratch.mit.edu'}"`,
             'process.env.PROJECT_HOST': `"${process.env.PROJECT_HOST || 'https://projects.scratch.mit.edu'}"`,
             'process.env.STATIC_HOST': `"${process.env.STATIC_HOST || 'https://uploads.scratch.mit.edu'}"`,
-            'process.env.SCRATCH_ENV': `"${process.env.SCRATCH_ENV || 'development'}"`
+            'process.env.SCRATCH_ENV': `"${process.env.SCRATCH_ENV || 'development'}"`,
+            'process.env.THUMBNAIL_URI': `"${process.env.THUMBNAIL_URI || '/internalapi/project/thumbnail/{}/set/'}"`,
+            'process.env.THUMBNAIL_HOST': `"${process.env.THUMBNAIL_HOST || ''}"`
         })
     ])
         .concat(process.env.ANALYZE_BUNDLE === 'true' ? [