profile

ProgrammingAreHard

Untangling dialogs in React Router

Published 7 days ago • 1 min read

React Router Guide

Untangling dialogs in React Router

I have been struggling with determining how to best implement dialogs in React Router apps for years:

  • useState to control their open state
  • Forms vs fetchers for data submissions
  • resource routes to form data(
  • useEffect for listening for the action data to close the dialog
  • useEffect for listing for a toast message

There's a lot to consider. However, tons of these problems go away if you move dialogs into their own dedicated routes. This doesn't come without its own set of challenges though.

I've written up a guide on how to implement dialogs and keep your sanity.

​Check out the article here.​

Hope it helps. Have a great Thursday! ✌️

ProgrammingAreHard

David Adams

For developers looking to learn useful tips and tricks.

Read more from ProgrammingAreHard

React Router Guide Contributing Callsite Revalidation Opt-out to React Router If you’ve used React Router’s data APIs, you’ve probably noticed it revalidates all your loaders after mutations, even when you know that’s completely unnecessary. I got tired of implementing shouldRevalidate functions that ended up feeling really awkward. I found an old proposal from Ryan Florence in GitHub, and decided to take a crack at implementing it myself. A few months and one merged PR later, it shipped in...

30 days ago • 1 min read

React Router Guide How to execute api requests in React Router There's not a lot of opinions on how to structure code that interacts with apis in React Router apps. This is what I've come up with and the post I wish existed before I started using React Router's actions/loaders with my existing api(and if middleware existed back then). Check out the article here. Have a great Tuesday ✌️ Unsubscribe · Preferences

9 months ago • 1 min read

React Router Guide How I used Prettier to help me find and fix a bug I recently encountered a bug where a system that's been working for years stopped working after a code release. The confusing bit was that the updated code had absolutely nothing to do with the system that was breaking. Through a series of trial and error and lots of scratching my head, I ended up using Prettier to pinpoint where the problem was and was able to find and fix the bug. Check out the full write-up here. Have a...

about 1 year ago • 1 min read