Failed to create a connection

[mgz513]

Ive try copying your design token repo as well as doing my own and the plugin keeps saying failed connection. I dont know what else to try or whats wrong. The written docs are nice but video instructions on how to get this setup would be great. This plugin sounds like exactly what i need if i could get it to work!

[ds1]

@mgz513 - Thank you for the feedback and I'm sorry for the trouble it's caused and the lack of visibility into what's happening. I've dug into the backend and it's revealed a few scenarios in which the connection could fail due to edge cases that weren't accounted for originally.

With more information, I might be able to better pinpoint the exact issue that caused the failure, but I suspect it might have been the case that the file was duplicated, in Draft mode, or otherwise not saved to Figma cloud.

This investigation has revealed a solution as well as inspired a more robust architecture to account for the various scenarios. I'm implementing this now and will be published in the next minor release.

I'm also working to enhance the UX by providing more detailed information if failures occur and steps to resolve them, fix the overlapping toast message interaction sin, update the written documentation, and will plan to create video instructions to make the experience easier to use from the start.

I am happy to hear that this plugin will address your needs and I want to make sure we get it working for you and others who might have run into this same headache!

[mgz513]

Thx and I appreciate the prompt reply! Im happy to provide any info that could help get this issue straightened out. To be fair I am a designer and new to Github and Im on a free account. Professional plan for my company in Figma. That's about it as far as setup goes. I copied your repo from the code link into my account, but couldnt get anywhere beyond that as shown. You provided the color variables (nice) but are we supposed to enter them in Figma manually? It seems it would be really useful if you provided a zip download of the test variables that can then be imported into a new file in Figma through a variables plugin. This way you can get a full proof of concept setup quickly, making changes to the variable in Figma then pushes to Git, and vice versa to see how well everything works.

[mgz513]

UPDATE: I have finally been able to connect my Github repo to my Figma file! I have successfully pushed changes from Figma and pulled them from Github. Both directions are working (and quickly). The plugin remembers your connection when its closed out of which is great. I will say that there was no place for me to add my commit message in the GitFig plugin despite whats listed in the written instructions, and I dont see a way to change the commit in Github. Its imperative that I can make the proper commit message while in Figma, otherwise PRs will get messy quickly! Having an appendage, like the github user account name, added automatically to the end of each commit message would also be a great way to keep track of whose adding what.

Now that the connection is established and syncing correctly in both directions I have a few friendly suggestions:

1. The type used throughout the plugin is a bit too small. Don't be afraid to make the plugin a little larger to increase readability.
2. It would be nice to be able to see the commit message from Github when its pulled into Figma instead of just 'update available'. It's vital to detect that a change was made, but depending on the commit message I may not want to accept it. I dont think the plugin is the place to see the extended description (if any), but it would be nice to see at a glance whats been changed before acceptance. The designer can visit Github to investigate further if needed.
3. Im curious as to how color styles (gradients) or text styles could be added? Especially since Figma doesnt support % yet.
4. I think the 'disconnect repo' button is too close to the pop out to visit the repo button. Maybe consider right aligning this like the configure button is for Sync Mappings? Its too easy to accidentally click disconnect at the moment.
5. In addition^ what happens if a person accidentally disconnects or logs out of the plugin? Will all history be lost, or will resyncing the mappings make it pick back up where it left off? If all will be lost, maybe the logout/disconnect should have a warning pop up as a second step that has to be acknowledged first?

With those suggestions I now have a big question:
The current instructions are geared toward a brand new setup, so how can this work for a presexisitng design system? I wouldn't need the plugin to convert a json into variables, as all my variables, colors, spacing, typography, modes, breakpoints are already setup and being consumed by my design team. How do we get what we already have setup syncing to what's in Github? Will our repo structure have to be setup exactly like the instructions in order for the plugin to be useful? Thank you!

[ds1]

I'm glad you got it working for your setup, @mgz513! You also raise excellent questions and improvement ideas. I'm going to copy your suggestions into new discussions and address them individually, for easier visibility and tracking!

[mgz513]

I'm glad you got it working for your setup, @mgz513! You also raise excellent questions and improvement ideas. I'm going to copy your suggestions into new discussions and address them individually, for easier visibility and tracking!

Excellent! Thank you. Im sure you may have some other users, but speaking for myself if I had to pick a priority issue Id want addressed first, it would be how to get a preexisting token system synced with a preexisting code base, followed by the ability to add a commit message in the plugin, etc. All UI improvements can come after functionality is ironed out.

There are many smaller teams that don't have the resources to upgrade their Figma plan in order to fully access the REST API or code connect, but still need to have an accurate, semi-automated connection between design/code. I see teams being willing to pay for your plugin if you can successfully fill this huge gap! Thanks for your responsiveness