Pick-A-Brick LDraw Colors

Replaces LEGO color names with LDraw color names on Pick a Brick

// ==UserScript==
// @name        Pick-A-Brick LDraw Colors
// @name:en     Pick-A-Brick LDraw Colors
// @description Replaces LEGO color names with LDraw color names on Pick a Brick
// @namespace   Violentmonkey Scripts
// @match       https://www.lego.com/en-us/pick-and-build/pick-a-brick*
// @grant       none
// @version     1.2.0
// @author      The0x539
// @run-at      document-start
// @license     AGPL-3.0
// ==/UserScript==
/* jshint esversion: 11 */

async function getColorMap() {
	const gistUrl = "https://gist.githubusercontent.com/The0x539/d046e6778f38232912c6ca1d840d614e/raw";
	const response = await fetch(gistUrl);
	const body = await response.json();
	return new Map(body);
}

const colorMapPromise = getColorMap();

const actualFetch = window.fetch;
window.fetch = async (...args) => {
	const response = await actualFetch(...args);
	if (args[0] !== 'https://www.lego.com/api/graphql/PickABrickQuery') {
		return response;
	}

	const body = await response.json();
	const colorMap = await colorMapPromise;

	for (const facet of body.data.searchElements.facets) {
		if (facet.id != "element.facet.colourFamily") {
			continue;
		}

		for (const label of facet.labels) {
			for (const child of label.children) {
				const legoColorId = child.key;
				child.name = colorMap.get(legoColorId);
				console.log(child.name);
			}
		}
	}

	for (const result of body.data.searchElements.results) {
		const colorFacet = result.facets.color;
		if (colorFacet.key === "") {
			continue;
		}
		colorFacet.name = colorMap.get(colorFacet.key);
	}

	// Reconstruct the response because we already consumed the body of the original response object.
	const { status, statusText, headers } = response;
	const options = { status, statusText, headers };
	return new Response(JSON.stringify(body), options);
};