Make the phone details object returned contain an array of high quality images

[gerkim62]

the gsmarena website contains images for the phones. the one that is currently being returned is of low quality,only 160x212. here is an example page containing a list of high quality images as an example reference: https://www.gsmarena.com/infinix_smart_8_pro-pictures-12812.php

[gerkim62]

Fetching Image URLs for a Given Phone ID: May not work for all phones

This TypeScript code fetches an array of image URLs for a given phoneId. If you prefer not to use TypeScript, you can remove the typings.

const IMAGE_URL_PREFIX = "https://fdn2.gsmarena.com/vv/pics";

async function getImageUrls({ phoneId }: { phoneId: string }) {
  const validUrls = [];
  const normalizedId = phoneId.split("-")[0];
  const phoneBrand = phoneId.split("_")[0];
  const imageUrlTemplate =
    `${IMAGE_URL_PREFIX}/${phoneBrand}/${normalizedId}-{{INDEX}}.jpg`.replaceAll(
      "_",
      "-"
    );

  for (let i = 0; ; i++) {
    const index = i === 0 ? "" : i.toString();
    const imageUrl = imageUrlTemplate.replace("{{INDEX}}", index);
    console.log(imageUrl);
    const isValid = await checkIsImageUrlValid(imageUrl);
    if (!isValid && i > 0) {
      console.log(
        `This phone has ${validUrls.length} valid images. Checking complete...`
      );
      break;
    }

    if (isValid) validUrls.push(imageUrl);
  }

  return validUrls;
}

async function checkIsImageUrlValid(url: string) {
  console.log("Checking", url);

  const response = await fetch(url, {
    method: "HEAD",
  });

  return response.status === 200;
}

const urls = getImageUrls({ phoneId: "infinix_smart_8_plus-12817" });
urls.then(console.log);

const urls2 = getImageUrls({ phoneId: "infinix_hot_40i-12731" });
urls2.then(console.log);