search

carloscuesta / gitmoji-cli

A gitmoji interactive cli tool for using emojis on commits. 💻
https://www.npmjs.com/package/gitmoji-cli
MIT License
4.64k stars 207 forks source link

Replace `inquirer` with `prompts` #1077

Closed segersniels closed 9 months ago

segersniels commented 1 year ago

Description of the problem

It seems like inquirer still has issues with flickering prompts when typing which results in bad UX which it has been having for a very long time.

Solution

Might have to check if viable to switch away from inquirer to something like prompts for better UX. From my own experiences prompts doesn't have this issue.

https://www.npmjs.com/package/prompts

Alternatives

No response

Additional context

See video for weird flickering issue in inquirer.

https://user-images.githubusercontent.com/10974647/236788387-4ff044dd-9096-40ca-bcfa-c613b0b73c78.mov

Validations

carloscuesta commented 1 year ago

Hey! @segersniels thanks for opening the issue I believe it's a great idea

I'm happy to move away from inquirer if this library provides better UX for our users. I see they even have autocomplete support, so we should be able to fit this 1:1 ❤️

segersniels commented 1 year ago

Had a quick go at this. While it does provide better UX (read: less flickering) during gitmoji selection it does introduce a bunch of flickering during the title prompt due to the input transforming that takes place (showing capitalization and max title length count). Without the mutation of the input the rendering is fine, but don't want to introduce regressions so going to leave this as is.

segersniels commented 1 year ago

https://github.com/carloscuesta/gitmoji-cli/assets/10974647/bd11a48c-fe7f-4b3c-9495-5811ac380bcb

https://github.com/carloscuesta/gitmoji-cli/assets/10974647/b13e37bd-ddcd-413f-b6e6-a7c536c2f65d

segersniels commented 1 year ago

Actually, I just noticed that the live version also flickers when typing during the title prompt. So there's not really a regression (besides maybe a slight increase in flickering). Doesn't take away from the fact that transforming the title during typing slows down the rendering and causes the flickering as you can see in the first video posted where the mutation doesn't happen and there's no flickering (with prompts).

https://github.com/carloscuesta/gitmoji-cli/assets/10974647/9ea1878c-1229-4aba-8726-c70c8640346e

carloscuesta commented 1 year ago

Doesn't take away from the fact that transforming the title during typing slows down the rendering and causes the flickering as you can see in the first video posted where the mutation doesn't happen and there's no flickering (with prompts).

Yes, every transformation to the input will cause some flickering as the terminal needs to re-render that reacting to user input, so it will flicker no matter what dependency we use for the prompts.

Even though looks like in the auto select prompt the experience is a bit better (as there's no flickering at all)

segersniels commented 1 year ago

Even though looks like in the auto select prompt the experience is a bit better (as there's no flickering at all)

Assuming you're talking about the first video posted, that's without the first letter capitalisation visible during writing and the max character length though. Removing that would be a slight regression in UX since people probably have grown used to it (more so the char length count).

Thought you were talking about the text input. Yeah the select prompt of the gitmojis is a lot smoother with prompts.

segersniels commented 9 months ago

Closing this for the time being. Might revisit in the future as there's no complaints coming in from other people.