search

tokens-studio / figma-plugin

Official repository of the plugin 'Tokens Studio for Figma' (Figma Tokens)
https://www.figma.com/community/plugin/843461159747178978
MIT License
1.32k stars 190 forks source link

Prevent extra brackets`{ }` and whitespaces being added on token name searches (mentions) #2902

Open cuserox opened 2 weeks ago

cuserox commented 2 weeks ago

Describe the bug Tweaking the extra space when token search is used (https://github.com/tokens-studio/figma-plugin/pull/2789) the way that search results are populated has been slightly broken!

To Reproduce Steps to reproduce the behavior:

  1. Edit a token to reference an alias
  2. Select an alias
  3. Edit the alias manually by searching
  4. Click on any result, see the bracket {} added randomly on the input

Expected behavior No extra bracket nor spaces should be added when a token name is clicked on after searching.

Screenshots or Screencasts https://github.com/tokens-studio/figma-plugin/assets/114073780/335dd67b-6bf2-484f-b528-03733e1a3d50

six7 commented 2 weeks ago

@cuserox I have a fix for this available in six7/fix-mentions. It turns out a recent change we did to mentions was causing this. Removing this again makes everything work, except that the extra space at the end of the input is added. It's the split="" that was the issue.

Perhaps we could adjust this so after applying it strips out the extra space?

For example if you have a token like {fontsize-small}rem and you replace fontsize-small with something else, it adds an extra space. But it no longer adds the } after, which is a great improvement but the space is a bit of an issue (which we attempted to solve with that split="" but the sideeffects are worse with that.

cuserox commented 1 week ago

@cuserox I have a fix for this available in six7/fix-mentions. It turns out a recent change we did to mentions was causing this. Removing this again makes everything work, except that the extra space at the end of the input is added. It's the split="" that was the issue.

Perhaps we could adjust this so after applying it strips out the extra space?

For example if you have a token like {fontsize-small}rem and you replace fontsize-small with something else, it adds an extra space. But it no longer adds the } after, which is a great improvement but the space is a bit of an issue (which we attempted to solve with that split="" but the sideeffects are worse with that.

@six7 makes sense. All in all, this fix should be for no side effects to occur when a user searches tokens 🔨

cuserox commented 1 week ago

@six7 @macintoshhelper @robinhoodie0823

I have created a Draft MR here, merely because it needs more testing. I believe it works well with my fix, but I wouldn't want to merge it and cause more trouble for V2 (and I'm off this Friday & Monday) 😇

Therefore if it's a pressing fix that needs to go out, please feel free to tweak, test & merge if needed!