particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Redux: Modernize Redux store

Browse source 
This commit modernizes the Redux store to bring it in line with the
current recommended best practices/patterns. It is possible because of a
recent previous commit that added Redux Toolkit as a dependency.

For detailed information on what modern Redux entails, see the Redux docs:
https://redux.js.org/introduction/getting-started#learn-modern-redux-livestream

Practically speaking, this means a huge reduction in boilerplate code.
Maintaining and extending the code will be much easier. All Redux logic
is now encapsulated by 'slices'. Reducers are defined in the slices, and
action creators and action types are generated automatically.

Redux Toolkit includes Immer, which greatly simplifies writing reducer logic
much simpler - state updates in Redux must be immutable, but working
with Javascript objects in an immutable fashion is clumsy, requiring
gratuitious use of the spread ... operator. With Immer, the state can be
updated as if mutable updates were allowed. Reducer logic has been
changed to take advantage of this in this commit.

This commit also removes a large amount of unused code. Fingers crossed
that nothing breaks. The tests do pass, afterall...

One other minor change... composesGet was renamed to fetchComposes and
composeGetStatus was renamed to fetchComposeStatus. This is in line with
the Redux documentation examples.
This commit is contained in:
lucasgarfield 2022-08-31 16:57:54 +02:00 • committed by Sanne Raymaekers
parent 1276b4ae9c
commit a17a759d5e
11 changed files with 76 additions and 374 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/Components/CreateImageWizard/CreateImageWizard.js
View file

@ -19,12 +19,12 @@ import {
fileSystemConfigurationValidator,
targetEnvironmentValidator,
} from './validators';
import { composeAdded } from '../../store/composesSlice';
import DocumentationButton from '../sharedComponents/DocumentationButton';
import './CreateImageWizard.scss';
import api from '../../api';
import { UNIT_GIB, UNIT_KIB, UNIT_MIB } from '../../constants';
import isRhel from '../../Utilities/isRhel';
import { composeAdded } from '../../store/actions/actions';
const handleKeyDown = (e, handleClose) => {
if (e.key === 'Escape') {
@ -427,14 +427,14 @@ const CreateImageWizard = () => {
requests.map((request) =>
api.composeImage(request).then((response) => {
dispatch(
composeAdded(
{
composeAdded({
compose: {
...response,
request,
image_status: { status: 'pending' },
},
true
)
insert: true,
})
);
})
)