Loaded Thumbnails hit 404

We have been implementing a new way to get project data using the database instead of the session data. This to allow for loading multiple project in different browser tabs. Now we are however updating a lot of requests to include a project id string. The media manager no longer is loading the thumbnails properly resulting in 404s. It is using a lazyLoading.vue component with this method

...
methods: {
    sendDimensionsToParent() {
      const manager = this
      let url = this.src

      // Load thumbnail image instead original
      if (!this.src.match(/.svg$/)) {
        this.src = `/editor/image-thumbnails?path=${this.src.replace(location.origin + '/uploads/', "")}`
      }

      this.$refs.img.addEventListener('load', function() {
        manager.applyStyles = true
        manager.$el.style.border = 'none'

        if (!manager.checkForDimensions(url)) {
          EventHub.fire('save-image-dimensions', {
            url: url,
            val: `${this.naturalWidth} x ${this.naturalHeight}`
          })
        }
      })
    }
  },
...

The thumbnail calls ask for urls like https://site.test/editor/image-thumbnails?path=https://site.test/uploads/2/380_icons.png and hit a 404 error now. The query string path https://site.test/uploads/2/380_icons.png does load data but that is not the thumbnail .

Perhaps we need to update the ProjectController method

...
public function getThumbnailImage()
    {
        $path = request()->path;
        // File not exists
        if (! Storage::disk('public_upload')->exists($path)) {
            abort(404);
        }

        if (preg_match("/\.svg/", $path) || preg_match("/\.tiff/", $path)) {
            return response()->file(public_path('/uploads/'.$path), [
                'Cache-control' => 'public',
            ]);
        }

        // Generate thumbnail with width 50px when thumbnail not found
        if (! Storage::disk('public_upload')->exists('thumbnails-'.$path)) {
            $image = Image::make(public_path('uploads/'.$path));
            $image->orientate();
            $image->resize(50, null, function ($constraint) {
                $constraint->aspectRatio();
            });

            Storage::disk('public_upload')->put('thumbnails-'.$path, (string) $image->encode('jpg'));
        }

        return response()->file(public_path('uploads/thumbnails-'.$path), [
            'Cache-control' => 'public',
        ]);
    }
}
...

and add ?project=${PROJECT_ID} like we have been doing for other Axios calls like axios.get(/editor/get-pages?project=${PROJECT_ID}) . But been trying a few options and still do not get the thumbnails generated and loaded properly.

this.src = `/editor/image-thumbnails?path=${this.src.replace(location.origin + '/uploads/', "" + `?project=${PROJECT_ID}`)}`

creates https://site.test/editor/image-thumbnails?path=?project=22/380_cookie-bar.png and still 404s so that is not correct either.

same for

this.src = `/editor/image-thumbnails?path=${this.src.replace(location.origin + '/uploads/', "") + `?project=${PROJECT_ID}`}`

which generates URL: https://site.test/editor/image-thumbnails?path=2/380_formsettingsfive.png?project=2 and still is a 404