fix: Improve preferences data access folders input UX with validation and guidance#9649
Conversation
2340dfa to
0913cab
Compare
| return; | ||
| } | ||
| const normalizedValue = validValue.replace(/\/+$/, '') || validValue; | ||
| const exists = currentValue.some(v => (v.replace(/\/+$/, '') || v) === normalizedValue); |
There was a problem hiding this comment.
A few concerns with these regex replaces:
- if
validValueis something like///, the regex replace will output an empty string, which will cause a fallback and///to be stored - The regex makes sense for unix style paths, but it's not compatible with windows
An alternative here could perhaps be a combination of path.normalize (to collapse duplicate separators and resolve ./.. segments) and stripping trailing separators with /[/\\]+$/ to handle both platforms.
There was a problem hiding this comment.
Hello @shelby-moore ,
Great catch! I initially overlooked Windows path handling. Thanks for the suggestions and these give me ideas to add unit tests for the path handler function normalizeFolderPath to ensure covering different OS systems and UX error messaging for invalid paths.
The fix has been pushed! Please take another look whenever you have time. Thank you.
There was a problem hiding this comment.
Love the addition of tests :)
bafdf81 to
43cb795
Compare
shelby-moore
left a comment
There was a problem hiding this comment.
Thank you for your contribution, @miycctwn! 🚀
Add visual feedback when users attempt to add duplicate folder paths: - Red border on input field when duplicate is detected - Red warning message "Duplicate folders are not allowed." displayed below input - Add button is disabled when a duplicate path is entered
…mpty tooltip - Strip trailing slashes before comparing folder paths so /Users/foo and /Users/foo/ are detected as duplicates - Add isDisabled prop to Tooltip component to suppress hover when message is empty, avoiding tooltip remount of the Add button
Remove tooltip and instead show red input border with error message when clicking Add with empty or duplicate paths. Revert tooltip.tsx isDisabled prop as it's no longer needed.
…or data folders input
43cb795 to
79516ef
Compare
Summary
Improves the UX of the "File Access" data folders setting (Preferences → General → Security -> "What folders can Insomnia access?") to address confusion reported in #9064 (specifically this comment), where users found the Add button misleading — it wasn't clear that a path must be entered first, and clicking Add with an empty input silently did nothing.
This PR does not close #9064 (which covers broader file access UX concerns) but addresses the specific input usability pain points discussed there.
Changes
highlighted with a red border and a "Duplicate folders are not allowed." message is shown — preventing duplicate entries.
format.
Screen.Recording.2026-02-09.at.17.57.57.mov
Related to #9064