Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor project reducers and actions using redux toolkit #3122

Open
wants to merge 2 commits into
base: develop
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 0 additions & 9 deletions client/constants.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,15 +23,10 @@ export const SETTINGS_UPDATED = 'SETTINGS_UPDATED';
export const API_KEY_CREATED = 'API_KEY_CREATED';
export const API_KEY_REMOVED = 'API_KEY_REMOVED';

export const SET_PROJECT_NAME = 'SET_PROJECT_NAME';
export const RENAME_PROJECT = 'RENAME_PROJECT';

export const PROJECT_SAVE_SUCCESS = 'PROJECT_SAVE_SUCCESS';
export const PROJECT_SAVE_FAIL = 'PROJECT_SAVE_FAIL';
export const NEW_PROJECT = 'NEW_PROJECT';
export const RESET_PROJECT = 'RESET_PROJECT';

export const SET_PROJECT = 'SET_PROJECT';
export const SET_PROJECTS = 'SET_PROJECTS';

export const SET_COLLECTIONS = 'SET_COLLECTIONS';
Expand Down Expand Up @@ -119,7 +114,6 @@ export const ERROR = 'ERROR';
export const JUST_OPENED_PROJECT = 'JUST_OPENED_PROJECT';
export const RESET_JUST_OPENED_PROJECT = 'RESET_JUST_OPENED_PROJECT';

export const SET_PROJECT_SAVED_TIME = 'SET_PROJECT_SAVED_TIME';
export const RESET_PROJECT_SAVED_TIME = 'RESET_PROJECT_SAVED_TIME';
export const SET_PREVIOUS_PATH = 'SET_PREVIOUS_PATH';
export const SHOW_ERROR_MODAL = 'SHOW_ERROR_MODAL';
Expand All @@ -137,7 +131,4 @@ export const SET_SORT_PARAMS = 'SET_SORT_PARAMS';
export const SET_SEARCH_TERM = 'SET_SEARCH_TERM';
export const CLOSE_SKETCHLIST_MODAL = 'CLOSE_SKETCHLIST_MODAL';

export const START_SAVING_PROJECT = 'START_SAVING_PROJECT';
export const END_SAVING_PROJECT = 'END_SAVING_PROJECT';

export const SET_COOKIE_CONSENT = 'SET_COOKIE_CONSENT';
48 changes: 16 additions & 32 deletions client/modules/IDE/actions/project.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,22 @@ import {
} from './ide';
import { clearState, saveState } from '../../../persistState';

import {
setProjectName,
startSavingProject,
endSavingProject,
resetProject,
setProjectSavedTime
} from '../reducers/project';

export {
setProjectName,
startSavingProject,
endSavingProject,
resetProject,
setProjectSavedTime
} from '../reducers/project';

const ROOT_URL = getConfig('API_URL');
const S3_BUCKET_URL_BASE = getConfig('S3_BUCKET_URL_BASE');
const S3_BUCKET = getConfig('S3_BUCKET');
Expand All @@ -28,13 +44,6 @@ export function setProject(project) {
};
}

export function setProjectName(name) {
return {
type: ActionTypes.SET_PROJECT_NAME,
name
};
}

export function projectSaveFail(error) {
return {
type: ActionTypes.PROJECT_SAVE_FAIL,
Expand Down Expand Up @@ -88,18 +97,6 @@ export function clearPersistedState() {
};
}

export function startSavingProject() {
return {
type: ActionTypes.START_SAVING_PROJECT
};
}

export function endSavingProject() {
return {
type: ActionTypes.END_SAVING_PROJECT
};
}

export function projectSaveSuccess() {
return {
type: ActionTypes.PROJECT_SAVE_SUCCESS
Expand Down Expand Up @@ -262,12 +259,6 @@ export function exportProjectAsZip(projectId) {
win.focus();
}

export function resetProject() {
return {
type: ActionTypes.RESET_PROJECT
};
}

export function newProject() {
browserHistory.push('/', { confirmed: true });
return resetProject();
Expand Down Expand Up @@ -347,13 +338,6 @@ export function cloneProject(project) {
};
}

export function setProjectSavedTime(updatedAt) {
return {
type: ActionTypes.SET_PROJECT_SAVED_TIME,
value: updatedAt
};
}

export function changeProjectName(id, newName) {
return (dispatch, getState) => {
const state = getState();
Expand Down
84 changes: 48 additions & 36 deletions client/modules/IDE/reducers/project.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import * as ActionTypes from '../../../constants';
import { createSlice } from '@reduxjs/toolkit';
import { generateProjectName } from '../../../utils/generateRandomName';

const initialState = () => {
Expand All @@ -12,40 +12,52 @@ const initialState = () => {
};
};

const project = (state, action) => {
if (state === undefined) {
state = initialState(); // eslint-disable-line
const projectSlice = createSlice({
name: 'project',
initialState,
reducers: {
setProjectName(state, action) {
state.name = action.payload;
},
newProject(state, action) {
const { id, name, updatedAt, owner } = action.payload;
state.id = id;
state.name = name;
state.updatedAt = updatedAt;
state.owner = owner;
state.isSaving = false;
},
setProject(state, action) {
const { id, name, updatedAt, owner } = action.payload;
state.id = id;
state.name = name;
state.updatedAt = updatedAt;
state.owner = owner;
state.isSaving = false;
},
resetProject(state) {
Object.assign(state, initialState);
},
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This isn't right because initialState is a function. It can be written as return initialState().

setProjectSavedTime(state, action) {
state.updatedAt = action.payload;
},
startSavingProject(state) {
state.isSaving = true;
},
endSavingProject(state) {
state.isSaving = false;
}
}
switch (action.type) {
case ActionTypes.SET_PROJECT_NAME:
return Object.assign({}, { ...state }, { name: action.name });
case ActionTypes.NEW_PROJECT:
return {
id: action.project.id,
name: action.project.name,
updatedAt: action.project.updatedAt,
owner: action.owner,
isSaving: false
};
case ActionTypes.SET_PROJECT:
return {
id: action.project.id,
name: action.project.name,
updatedAt: action.project.updatedAt,
owner: action.owner,
isSaving: false
};
case ActionTypes.RESET_PROJECT:
return initialState();
case ActionTypes.SET_PROJECT_SAVED_TIME:
return Object.assign({}, state, { updatedAt: action.value });
case ActionTypes.START_SAVING_PROJECT:
return Object.assign({}, state, { isSaving: true });
case ActionTypes.END_SAVING_PROJECT:
return Object.assign({}, state, { isSaving: false });
default:
return state;
}
};
});

export const {
setProjectName,
newProject,
setProject,
resetProject,
setProjectSavedTime,
startSavingProject,
endSavingProject
} = projectSlice.actions;

export default project;
export default projectSlice.reducer;
Loading