Skip to content

Commit 9fbb986

Browse files
committed
Install Redux Toolkit
1 parent 3abdfa1 commit 9fbb986

File tree

10 files changed

+47
-28
lines changed

10 files changed

+47
-28
lines changed

ui/frontend/actions.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import fetch from 'isomorphic-fetch';
2-
import { ThunkAction as ReduxThunkAction } from 'redux-thunk';
2+
import { ThunkAction as ReduxThunkAction } from '@reduxjs/toolkit';
33
import { z } from 'zod';
44

55
import {

ui/frontend/configureStore.ts

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
import { merge } from 'lodash-es';
2-
import { applyMiddleware, compose, createStore } from 'redux';
32
import { useDispatch } from 'react-redux';
4-
import thunk, { ThunkDispatch } from 'redux-thunk';
3+
import { configureStore as reduxConfigureStore } from '@reduxjs/toolkit';
4+
import { produce } from 'immer';
5+
import type {} from 'redux-thunk/extend-redux';
56

6-
import { Action, initializeApplication } from './actions';
7+
import { initializeApplication } from './actions';
78
import initializeLocalStorage from './local_storage';
89
import initializeSessionStorage from './session_storage';
9-
import playgroundApp, { State } from './reducers';
1010
import { websocketMiddleware } from './websocketMiddleware';
11+
import reducer from './reducers';
1112

1213
export default function configureStore(window: Window) {
1314
const baseUrl = new URL('/', window.location.href).href;
@@ -18,22 +19,23 @@ export default function configureStore(window: Window) {
1819
baseUrl,
1920
},
2021
};
21-
const initialAppState = playgroundApp(undefined, initializeApplication());
22+
const initialAppState = reducer(undefined, initializeApplication());
2223

2324
const localStorage = initializeLocalStorage();
2425
const sessionStorage = initializeSessionStorage();
2526

26-
const initialState = merge(
27+
const preloadedState = produce(initialAppState, (initialAppState) => merge(
2728
initialAppState,
2829
initialGlobalState,
2930
localStorage.initialState,
3031
sessionStorage.initialState,
31-
);
32+
));
3233

33-
const middlewares = applyMiddleware<ThunkDispatch<State, {}, Action>, {}>(thunk, websocket);
34-
const composeEnhancers: typeof compose = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
35-
const enhancers = composeEnhancers(middlewares);
36-
const store = createStore(playgroundApp, initialState, enhancers);
34+
const store = reduxConfigureStore({
35+
reducer,
36+
preloadedState,
37+
middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(websocket),
38+
})
3739

3840
store.subscribe(() => {
3941
const state = store.getState();

ui/frontend/declarations.d.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@ declare const ACE_KEYBINDINGS: string[];
1717
declare const ACE_THEMES: string[];
1818

1919
interface Window {
20-
__REDUX_DEVTOOLS_EXTENSION_COMPOSE__: any;
2120
rustPlayground: {
2221
setCode(code: string): void;
2322
disableSyncChangesToStorage(): void;

ui/frontend/package.json

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
"main": "index.js",
66
"dependencies": {
77
"@floating-ui/react": "^0.22.2",
8+
"@reduxjs/toolkit": "^1.8.5",
89
"ace-builds": "^1.4.4",
910
"common-tags": "^1.8.0",
1011
"core-js": "^3.1.3",
@@ -22,10 +23,7 @@
2223
"react-prism": "^4.0.0",
2324
"react-redux": "^8.0.2",
2425
"react-shadow": "^20.0.0",
25-
"redux": "^4.0.0",
26-
"redux-thunk": "^2.1.0",
2726
"regenerator-runtime": "^0.13.2",
28-
"reselect": "^4.0.0",
2927
"route-parser": "^0.0.5",
3028
"split-grid": "^1.0.9",
3129
"suspend-react": "^0.0.9",

ui/frontend/reducers/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { combineReducers } from 'redux';
1+
import { combineReducers } from '@reduxjs/toolkit';
22

33
import browser from './browser';
44
import code from './code';

ui/frontend/reducers/output/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { combineReducers } from 'redux';
1+
import { combineReducers } from '@reduxjs/toolkit';
22

33
import assembly from './assembly';
44
import clippy from './clippy';

ui/frontend/selectors/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { source } from 'common-tags';
2-
import { createSelector } from 'reselect';
2+
import { createSelector } from '@reduxjs/toolkit';
33

44
import { State } from '../reducers';
55
import {

ui/frontend/uss-router/index.ts

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { isEqual } from 'lodash-es';
2-
import { createStore, Reducer, Store, Action, PreloadedState } from 'redux';
2+
import { configureStore, CombinedState, ThunkAction, Reducer, Store, Action, PreloadedState } from '@reduxjs/toolkit';
33
import { BrowserHistory, Location, Path } from 'history';
4-
import { ThunkAction } from 'redux-thunk';
54

65
export type PlainOrThunk<St, A extends Action<any>> = A | ThunkAction<void, St, {}, A>;
76

@@ -68,9 +67,15 @@ export function createRouter<St, SubSt, A extends Action<any>>({
6867
return {
6968
provisionalLocation: (makeAction: () => A) => {
7069
const state = store.getState();
71-
// This is a hack -- we know that our fully-constructed state is
72-
// valid as a "preloaded" state for a brand new store!
73-
const tempStore = createStore(reducer, state as PreloadedState<St>);
70+
71+
const tempStore = configureStore({
72+
reducer,
73+
// This is a hack -- we know that our fully-constructed state is
74+
// valid as a "preloaded" state for a brand new store!
75+
preloadedState: state as PreloadedState<CombinedState<St>>,
76+
devTools: false,
77+
});
78+
7479
const action = makeAction();
7580
tempStore.dispatch(action);
7681
const maybeState = tempStore.getState();

ui/frontend/websocketMiddleware.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Middleware } from 'redux';
1+
import { Middleware } from '@reduxjs/toolkit';
22
import { z } from 'zod';
33

44
import {

ui/frontend/yarn.lock

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1407,6 +1407,16 @@
14071407
"@nodelib/fs.scandir" "2.1.5"
14081408
fastq "^1.6.0"
14091409

1410+
"@reduxjs/toolkit@^1.8.5":
1411+
version "1.9.3"
1412+
resolved "https://registry.yarnpkg.com/@reduxjs/toolkit/-/toolkit-1.9.3.tgz#27e1a33072b5a312e4f7fa19247fec160bbb2df9"
1413+
integrity sha512-GU2TNBQVofL09VGmuSioNPQIu6Ml0YLf4EJhgj0AvBadRlCGzUWet8372LjvO4fqKZF2vH1xU0htAa7BrK9pZg==
1414+
dependencies:
1415+
immer "^9.0.16"
1416+
redux "^4.2.0"
1417+
redux-thunk "^2.4.2"
1418+
reselect "^4.1.7"
1419+
14101420
"@sinclair/typebox@^0.25.16":
14111421
version "0.25.24"
14121422
resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.25.24.tgz#8c7688559979f7079aacaf31aa881c3aa410b718"
@@ -3570,6 +3580,11 @@ image-size@~0.5.0:
35703580
resolved "https://registry.yarnpkg.com/image-size/-/image-size-0.5.5.tgz#09dfd4ab9d20e29eb1c3e80b8990378df9e3cb9c"
35713581
integrity sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==
35723582

3583+
immer@^9.0.16:
3584+
version "9.0.19"
3585+
resolved "https://registry.yarnpkg.com/immer/-/immer-9.0.19.tgz#67fb97310555690b5f9cd8380d38fc0aabb6b38b"
3586+
integrity sha512-eY+Y0qcsB4TZKwgQzLaE/lqYMlKhv5J9dyd2RhhtGhNo2njPXDqU9XPfcNfa3MIDsdtZt5KlkIsirlo4dHsWdQ==
3587+
35733588
immutable@^4.0.0:
35743589
version "4.3.0"
35753590
resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.3.0.tgz#eb1738f14ffb39fd068b1dbe1296117484dd34be"
@@ -5340,12 +5355,12 @@ redent@^3.0.0:
53405355
indent-string "^4.0.0"
53415356
strip-indent "^3.0.0"
53425357

5343-
redux-thunk@^2.1.0:
5358+
redux-thunk@^2.4.2:
53445359
version "2.4.2"
53455360
resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.4.2.tgz#b9d05d11994b99f7a91ea223e8b04cf0afa5ef3b"
53465361
integrity sha512-+P3TjtnP0k/FEjcBL5FZpoovtvrTNT/UXd4/sluaSyrURlSlhLSzEdfsTBW7WsKB6yPvgd7q/iZPICFjW4o57Q==
53475362

5348-
redux@^4.0.0:
5363+
redux@^4.2.0:
53495364
version "4.2.1"
53505365
resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.1.tgz#c08f4306826c49b5e9dc901dee0452ea8fce6197"
53515366
integrity sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w==
@@ -5430,7 +5445,7 @@ require-from-string@^2.0.2:
54305445
resolved "https://registry.yarnpkg.com/require-from-string/-/require-from-string-2.0.2.tgz#89a7fdd938261267318eafe14f9c32e598c36909"
54315446
integrity sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==
54325447

5433-
reselect@^4.0.0:
5448+
reselect@^4.1.7:
54345449
version "4.1.7"
54355450
resolved "https://registry.yarnpkg.com/reselect/-/reselect-4.1.7.tgz#56480d9ff3d3188970ee2b76527bd94a95567a42"
54365451
integrity sha512-Zu1xbUt3/OPwsXL46hvOOoQrap2azE7ZQbokq61BQfiXvhewsKDwhMeZjTX9sX0nvw1t/U5Audyn1I9P/m9z0A==

0 commit comments

Comments
 (0)