Skip to content

refactor project reducers and actions using redux toolkit #3122

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.

Sign up for GitHub

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

Open
wants to merge 2 commits into
base: develop
Choose a base branch
from
+67 −78
Open

refactor project reducers and actions using redux toolkit #3122

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
203122f
refactor project reducers and actions using redux toolkit
PiyushChandra17 May 15, 2024
82e12cb
updated initialState as a function
PiyushChandra17 Jun 13, 2024
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
View file
Original file line number Diff line number Diff line change
@@ -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';
@@ -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';
@@ -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
View file
Original file line number Diff line number Diff line change
@@ -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');
@@ -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,
@@ -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
@@ -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();
@@ -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();
88 changes: 51 additions & 37 deletions client/modules/IDE/reducers/project.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import * as ActionTypes from '../../../constants';
import { createSlice } from '@reduxjs/toolkit';
import { generateProjectName } from '../../../utils/generateRandomName';

const initialState = () => {
const generateInitialState = () => {
const generatedString = generateProjectName();
const generatedName =
generatedString.charAt(0).toUpperCase() + generatedString.slice(1);
@@ -12,40 +12,54 @@ const initialState = () => {
};
};

const project = (state, action) => {
if (state === undefined) {
state = initialState(); // eslint-disable-line
}
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;
const initialState = generateInitialState();

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;
}
}
};
});

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

export default project;
export default projectSlice.reducer;