figspec

Unofficial static Figma frame/file viewer available as HTML CustomElement

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23
  24. 24
  25. 25
  26. 26
  27. 27
  28. 28
  29. 29
  30. 30
  31. 31
  32. 32
  33. 33
  34. 34
  35. 35
  36. 36
  37. 37
  38. 38
  39. 39
  40. 40
  41. 41
  42. 42
import fetch from "node-fetch";

export async function fetchNode(client, fileKey, nodeId) {
  const [nodes, imageResponse] = await Promise.all([
    client.fileNodes(fileKey, { ids: [nodeId] }),
    client.fileImages(fileKey, {
      ids: [nodeId],
      scale: 1,
      format: "svg",
    }),
  ]);

  if (imageResponse.data.err) {
    throw new Error(`Failed to render nodes: ${imageResponse.data.err}`);
  }

  const [image] = await Promise.all(
    Object.entries(imageResponse.data.images)
      .filter((image) => image[0] === nodeId)
      .map(async ([nodeId, image]) => {
        if (!image) {
          throw new Error(`Failed to render a node (node-id=${nodeId}`);
        }

        const res = await fetch(image);

        if (res.status !== 200) {
          throw new Error(
            `Failed to fetch a rendered image: node-id=${nodeId}, url=${image}`,
          );
        }

        return res.buffer();
      }),
  );

  if (!image) {
    throw new Error("Image not found.");
  }

  return { response: nodes.data, image };
}