question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Feature Request] Option for action constants created by createSlice to follow the SCREAMING SNAKE CASE

See original GitHub issue

REQUEST:

If feasible, I would request an option whereby createSlice automatically generates uppercase action constants from the cameCase reducer names defined in the slice. Additionally, the “actions” property of the slice returned, instead of looking like this:

mySlice.actions = { myAction1, myAction2, myAction3 };

would look like this:

mySlice.actions = {
    MY_ACTION_1: 'MY_ACTION_1',
    MY_ACTION_2: 'MY_ACTION_2',
    MY_ACTION_3: 'MY_ACTION_3',
}

REASON FOR REQUEST:

The documentation for createSlice states:

The original Redux docs and examples generally used a “SCREAMING_SNAKE_CASE” convention for defining action types… The downside is that the uppercase strings can be hard to read… Redux Toolkit’s createSlice function currently generates action types that look like “domain/action”, such as “todos/addTodo”. Going forward, we suggest using the “domain/action” convention for readability.

I disagree. I strongly prefer my snakes screaming over quiet and camel-like, precisely because I find it easier to read. It is much easier to distinguish particular actions from others in the right side of Redux Devtools, and I find I can instantly spot where an action is being called in a thunk, in the UI code, or in a library like redux-saga, because uppercase is only used in UI code, for the most part, to define display text.

Maybe the other reason I find it so easy to distinguish actions in all caps is it forces each action constant to form a distinct pattern of alternating solid and empty spaces. Hopefully the next few lines will illustrate.

More concentration to distinguish:

I am writing stuff all around so setAllGophersRabid will blend in.
I am writing stuff all around so retrieveMyHamburgers will blend in.

Less Concentration to distinguish:

I am writing stuff all around so SET_ALL_GOPHERS_RABID  will blend in.
I am writing stuff all around so RETRIEVE_MY_HAMBURGERS  will blend in.

The shape helps because more distinct

I am writing stuff all around so ▓▓_▓▓_▓▓▓▓▓▓▓_▓▓▓▓  will blend in.
I am writing stuff all around so ▓▓▓▓▓▓_▓▓_▓▓▓▓▓▓▓▓▓▓  will blend in.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:3
  • Comments:8 (1 by maintainers)

github_iconTop GitHub Comments

2reactions
jehillertcommented, Jul 20, 2021

I had a few more months after filing this issue to work with redux-toolkit on a personal project before starting a new job that uses a different state management library, both experiences coming after a year on a big sloppy-in-a-good-way enterprise project that lasted a year and relied heavily on basic redux. All I can say, is for a library I dreaded three years ago when I switched careers, it is now the neatest thing I’ve come across. A puzzle piece fits perfectly into one puzzle, that’s not too amazing. A puzzle piece fits into 5 million different puzzles perfectly, and half of those puzzles sorta naturally self-organize around that one piece, that’s quite another…

1reaction
markeriksoncommented, Feb 17, 2021

Heh, yeah. I think I remember Dan once saying that he “didn’t think everyone would just copy the stuff he was showing in the docs” or something like that. Which, tbh, is kind of silly - the whole point of examples in docs is to give people patterns they can follow.

There were perfectly good reasons for using const ADD_TODO = "ADD_TODO", of course. SCREAMING_SNAKE_CASE is a standard idiom across languages for writing constant values, and it avoided writing the same string in different places and getting it wrong. Mostly.

But as Lenz said, today action types are mostly an implementation detail, and the only time you should really be seeing them is in the DevTools.

Read more comments on GitHub >

github_iconTop Results From Across the Web

createSlice - Redux Toolkit
A function that accepts an initial state, an object of reducer functions, and a "slice name", and automatically generates action creators ...
Read more >
Understanding createSlice in Redux Toolkit — ReactJS.
This will help to demonstrate on how to implement createSlice, dispatch action and configure store. Step 1: Implement createSilce method and export actions...
Read more >
Redux is definitely NOT dead with Mark Erikson (JS Party #146)
Redux maintainer Mark Erikson joins Jerod and Amal for an in-depth conversation around the React community's fav state management solution.
Read more >
Redux is alive and well with Mark Erikson - PodRocket
Another thing we have is a function called create slice. ... You're still dispatching actions and writing reducer functions.
Read more >
Why should redux action types be in UPPER_CASE?
capital letters for constants. It is just a convention which is common also in other other languages. Interesting article on redux naming ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found