Fix bug where aliases to remote variables could not be updated when syncing tokens to Figma

[james04321]

For the sync_tokens_to_figma.ts script, if a tokens file has aliases to variables in remote collections, e.g. "$value": "{name_of_variable}", update those alias references when needed. This issue was brought up in #20.

The previous behavior was that if a tokens file has aliases to variables in a remote collection, those aliases would cause a 400 response from the POST /v1/files/:file_key/variables endpoint, as the script was sending up invalid variable ids inside the alias objects.

Now, the script will match up token values with remote variable names and update aliases when needed.

Note: we are limited by the variables API in that we cannot alias variables that aren't already consumed by current file.

Demo:

Here is a demo of the sync_tokens_to_figma.ts script updating a Figma file that has a Semantic variables collection with aliases to variables published from another file.

Screen.Recording.2024-03-18.at.8.13.33.AM.mov

Test Plan

• In one file, create and publish a variable collection
• In another file, create a variable collection with variables that alias to variables from the file above
• Run npm run sync-figma-to-tokens to export the variables from the second file into a tokens file
• Run npm run sync-tokens-to-figma on the exported tokens file to sync the tokens back to Figma. The result is that we should noop instead of getting a 400 error from the REST API.

[elainefigma]

The changes and tests make sense to me!