gaspersic/freeCodeCamp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

feat(client): refactor Flash/redux into TS (#42725)

Browse Source 
* feat(client): ts-migrate Flash/redux

* add app types

* convert Flash/redux/index to vanilla TS

* update redux types.ts

* use FlashState type over State type

* update typing

* fix: prettier errors I caused?

* fix: re-add comment I removed

* remove comment

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

* fix type to not include {}

* remove commented out code for future use

* remove unused initialState object

* rename Flash onClose prop to match action name

* directly type reducer to return state

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

Co-authored-by: moT01 <20648924+moT01@users.noreply.github.com>
Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
This commit is contained in:
Shaun Hamilton
2021-10-20 18:58:10 +01:00
committed by GitHub
parent 8e43c3c838
commit d100132f75
8 changed files with 150 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
client/src/redux/index.js
View File

@@ -5,7 +5,7 @@ import store from 'store';
import { actionTypes as challengeTypes } from '../templates/Challenges/redux/action-types';
import { CURRENT_CHALLENGE_KEY } from '../templates/Challenges/redux/current-challenge-saga';
import { createAcceptTermsSaga } from './accept-terms-saga';
import { actionTypes, ns } from './action-types';
import { actionTypes } from './action-types';
import { createAppMountSaga } from './app-mount-saga';
import { createDonationSaga } from './donation-saga';
import failedUpdatesEpic from './failed-updates-epic';
@@ -19,7 +19,7 @@ import { actionTypes as settingsTypes } from './settings/action-types';
import { createShowCertSaga } from './show-cert-saga';
import updateCompleteEpic from './update-complete-epic';
export { ns };
export const MainApp = 'app';
export const defaultFetchState = {
pending: true,
@@ -172,8 +172,9 @@ export const updateCurrentChallengeId = createAction(
export const completedChallengesSelector = state =>
userSelector(state).completedChallenges || [];
export const completionCountSelector = state => state[ns].completionCount;
export const currentChallengeIdSelector = state => state[ns].currentChallengeId;
export const completionCountSelector = state => state[MainApp].completionCount;
export const currentChallengeIdSelector = state =>
state[MainApp].currentChallengeId;
export const stepsToClaimSelector = state => {
const user = userSelector(state);
const currentCerts = certificatesByNameSelector(user.username)(
@@ -188,21 +189,24 @@ export const stepsToClaimSelector = state => {
};
};
export const isDonatingSelector = state => userSelector(state).isDonating;
export const isOnlineSelector = state => state[ns].isOnline;
export const isServerOnlineSelector = state => state[ns].isServerOnline;
export const isSignedInSelector = state => !!state[ns].appUsername;
export const isDonationModalOpenSelector = state => state[ns].showDonationModal;
export const isOnlineSelector = state => state[MainApp].isOnline;
export const isServerOnlineSelector = state => state[MainApp].isServerOnline;
export const isSignedInSelector = state => !!state[MainApp].appUsername;
export const isDonationModalOpenSelector = state =>
state[MainApp].showDonationModal;
export const recentlyClaimedBlockSelector = state =>
state[ns].recentlyClaimedBlock;
export const donationFormStateSelector = state => state[ns].donationFormState;
state[MainApp].recentlyClaimedBlock;
export const donationFormStateSelector = state =>
state[MainApp].donationFormState;
export const signInLoadingSelector = state =>
userFetchStateSelector(state).pending;
export const showCertSelector = state => state[ns].showCert;
export const showCertFetchStateSelector = state => state[ns].showCertFetchState;
export const showCertSelector = state => state[MainApp].showCert;
export const showCertFetchStateSelector = state =>
state[MainApp].showCertFetchState;
export const shouldRequestDonationSelector = state => {
const completedChallenges = completedChallengesSelector(state);
const completionCount = completionCountSelector(state);
const canRequestProgressDonation = state[ns].canRequestProgressDonation;
const canRequestProgressDonation = state[MainApp].canRequestProgressDonation;
const isDonating = isDonatingSelector(state);
const recentlyClaimedBlock = recentlyClaimedBlockSelector(state);
@@ -226,7 +230,7 @@ export const shouldRequestDonationSelector = state => {
};
export const userByNameSelector = username => state => {
const { user } = state[ns];
const { user } = state[MainApp];
// return initial state empty user empty object instead of empty
// object litteral to prevent components from re-rendering unnecessarily
return user[username] ?? initialState.user;
@@ -357,17 +361,17 @@ export const certificatesByNameSelector = username => state => {
};
};
export const userFetchStateSelector = state => state[ns].userFetchState;
export const userFetchStateSelector = state => state[MainApp].userFetchState;
export const userProfileFetchStateSelector = state =>
state[ns].userProfileFetchState;
export const usernameSelector = state => state[ns].appUsername;
state[MainApp].userProfileFetchState;
export const usernameSelector = state => state[MainApp].appUsername;
export const userSelector = state => {
const username = usernameSelector(state);
return state[ns].user[username] || {};
return state[MainApp].user[username] || {};
};
export const sessionMetaSelector = state => state[ns].sessionMeta;
export const sessionMetaSelector = state => state[MainApp].sessionMeta;
function spreadThePayloadOnUser(state, payload) {
return {