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.

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

Jump to bottom

refactor preferences reducers and actions using redux toolkit #3121

Open
wants to merge 2 commits into
base: develop
Choose a base branch
from
Open

refactor preferences reducers and actions using redux toolkit #3121

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
d1151e7
refactor preferences reducers and actions using redux toolkit
PiyushChandra17 May 15, 2024
d0f4d66
fix few errors
PiyushChandra17 Jun 14, 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
15 changes: 2 additions & 13 deletions client/constants.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,6 @@ export const STOP_ACCESSIBLE_OUTPUT = 'STOP_ACCESSIBLE_OUTPUT';

export const OPEN_PREFERENCES = 'OPEN_PREFERENCES';
export const CLOSE_PREFERENCES = 'CLOSE_PREFERENCES';
export const SET_FONT_SIZE = 'SET_FONT_SIZE';
export const SET_LINE_NUMBERS = 'SET_LINE_NUMBERS';

export const AUTH_USER = 'AUTH_USER';
export const UNAUTH_USER = 'UNAUTH_USER';
Expand Down Expand Up @@ -65,15 +63,7 @@ export const TOGGLE_FORCE_DESKTOP = 'TOGGLE_FORCE_DESKTOP';
export const UPDATE_FILE_NAME = 'UPDATE_FILE_NAME';
export const DELETE_FILE = 'DELETE_FILE';

export const SET_AUTOSAVE = 'SET_AUTOSAVE';
export const SET_LINEWRAP = 'SET_LINEWRAP';
export const SET_LINT_WARNING = 'SET_LINT_WARNING';
export const SET_PREFERENCES = 'SET_PREFERENCES';
export const SET_TEXT_OUTPUT = 'SET_TEXT_OUTPUT';
export const SET_GRID_OUTPUT = 'SET_GRID_OUTPUT';
export const SET_SOUND_OUTPUT = 'SET_SOUND_OUTPUT';
export const SET_AUTOCLOSE_BRACKETS_QUOTES = 'SET_AUTOCLOSE_BRACKETS_QUOTES';
export const SET_AUTOCOMPLETE_HINTER = 'SET_AUTOCOMPLETE_HINTER';

export const OPEN_PROJECT_OPTIONS = 'OPEN_PROJECT_OPTIONS';
export const CLOSE_PROJECT_OPTIONS = 'CLOSE_PROJECT_OPTIONS';
Expand All @@ -93,11 +83,8 @@ export const CLOSE_KEYBOARD_SHORTCUT_MODAL = 'CLOSE_KEYBOARD_SHORTCUT_MODAL';
export const SHOW_TOAST = 'SHOW_TOAST';
export const HIDE_TOAST = 'HIDE_TOAST';
export const SET_TOAST_TEXT = 'SET_TOAST_TEXT';
export const SET_THEME = 'SET_THEME';
export const SET_LANGUAGE = 'SET_LANGUAGE';

export const SET_UNSAVED_CHANGES = 'SET_UNSAVED_CHANGES';
export const SET_AUTOREFRESH = 'SET_AUTOREFRESH';
export const START_SKETCH_REFRESH = 'START_SKETCH_REFRESH';
export const END_SKETCH_REFRESH = 'END_SKETCH_REFRESH';

Expand Down Expand Up @@ -141,3 +128,5 @@ export const START_SAVING_PROJECT = 'START_SAVING_PROJECT';
export const END_SAVING_PROJECT = 'END_SAVING_PROJECT';

export const SET_COOKIE_CONSENT = 'SET_COOKIE_CONSENT';

export const SET_PREFERENCES = 'SET_PREFERENCES';
79 changes: 27 additions & 52 deletions client/modules/IDE/actions/preferences.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,21 @@ import i18next from 'i18next';
import apiClient from '../../../utils/apiClient';
import * as ActionTypes from '../../../constants';

import {
setFontSizeActions,
setAutoSaveActions,
setLineWrapActions,
setLintWarningActions,
setTextOutputActions,
setGridOutputActions,
setThemeActions,
setAutoRefreshActions,
setLineNumbersActions,
setAutocloseBracketsQuotesActions,
setAutocompleteHinterActions,
setLanguageActions
} from '../reducers/preferences';

function updatePreferences(formParams, dispatch) {
apiClient
.put('/preferences', formParams)
Expand All @@ -17,10 +32,7 @@ function updatePreferences(formParams, dispatch) {
export function setFontSize(value) {
return (dispatch, getState) => {
// eslint-disable-line
dispatch({
type: ActionTypes.SET_FONT_SIZE,
value
});
dispatch(setFontSizeActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -35,10 +47,7 @@ export function setFontSize(value) {

export function setLineNumbers(value) {
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_LINE_NUMBERS,
value
});
dispatch(setLineNumbersActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -53,10 +62,7 @@ export function setLineNumbers(value) {

export function setAutocloseBracketsQuotes(value) {
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_AUTOCLOSE_BRACKETS_QUOTES,
value
});
dispatch(setAutocloseBracketsQuotesActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -71,10 +77,7 @@ export function setAutocloseBracketsQuotes(value) {

export function setAutocompleteHinter(value) {
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_AUTOCOMPLETE_HINTER,
value
});
dispatch(setAutocompleteHinterActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -89,10 +92,7 @@ export function setAutocompleteHinter(value) {

export function setAutosave(value) {
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_AUTOSAVE,
value
});
dispatch(setAutoSaveActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -107,10 +107,7 @@ export function setAutosave(value) {

export function setLinewrap(value) {
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_LINEWRAP,
value
});
dispatch(setLineWrapActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -125,10 +122,7 @@ export function setLinewrap(value) {

export function setLintWarning(value) {
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_LINT_WARNING,
value
});
dispatch(setLintWarningActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -143,10 +137,7 @@ export function setLintWarning(value) {

export function setTextOutput(value) {
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_TEXT_OUTPUT,
value
});
dispatch(setTextOutputActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -161,10 +152,7 @@ export function setTextOutput(value) {

export function setGridOutput(value) {
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_GRID_OUTPUT,
value
});
dispatch(setGridOutputActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -183,10 +171,7 @@ export function setTheme(value) {
// value
// };
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_THEME,
value
});
dispatch(setThemeActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -200,15 +185,8 @@ export function setTheme(value) {
}

export function setAutorefresh(value) {
// return {
// type: ActionTypes.SET_AUTOREFRESH,
// value
// };
return (dispatch, getState) => {
dispatch({
type: ActionTypes.SET_AUTOREFRESH,
value
});
dispatch(setAutoRefreshActions(value));
const state = getState();
if (state.user.authenticated) {
const formParams = {
Expand All @@ -231,10 +209,7 @@ export function setAllAccessibleOutput(value) {
export function setLanguage(value, { persistPreference = true } = {}) {
return (dispatch, getState) => {
i18next.changeLanguage(value);
dispatch({
type: ActionTypes.SET_LANGUAGE,
language: value
});
dispatch(setLanguageActions(value));
const state = getState();
if (persistPreference && state.user.authenticated) {
const formParams = {
Expand Down
99 changes: 62 additions & 37 deletions client/modules/IDE/reducers/preferences.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import * as ActionTypes from '../../../constants';
import { createSlice } from '@reduxjs/toolkit';

export const initialState = {
fontSize: 18,
Expand All @@ -15,41 +15,66 @@ export const initialState = {
autocompleteHinter: false
};

const preferences = (state = initialState, action) => {
switch (action.type) {
case ActionTypes.SET_FONT_SIZE:
return Object.assign({}, state, { fontSize: action.value });
case ActionTypes.SET_AUTOSAVE:
return Object.assign({}, state, { autosave: action.value });
case ActionTypes.SET_LINEWRAP:
return Object.assign({}, state, { linewrap: action.value });
case ActionTypes.SET_LINT_WARNING:
return Object.assign({}, state, { lintWarning: action.value });
case ActionTypes.SET_TEXT_OUTPUT:
return Object.assign({}, state, { textOutput: action.value });
case ActionTypes.SET_GRID_OUTPUT:
return Object.assign({}, state, { gridOutput: action.value });
case ActionTypes.SET_PREFERENCES:
return action.preferences;
case ActionTypes.SET_THEME:
return Object.assign({}, state, { theme: action.value });
case ActionTypes.SET_AUTOREFRESH:
return Object.assign({}, state, { autorefresh: action.value });
case ActionTypes.SET_LINE_NUMBERS:
return Object.assign({}, state, { lineNumbers: action.value });
case ActionTypes.SET_LANGUAGE:
return Object.assign({}, state, { language: action.language });
case ActionTypes.SET_AUTOCLOSE_BRACKETS_QUOTES:
return Object.assign({}, state, {
autocloseBracketsQuotes: action.value
});
case ActionTypes.SET_AUTOCOMPLETE_HINTER:
return Object.assign({}, state, {
autocompleteHinter: action.value
});
default:
return state;
const preferencesSlice = createSlice({
name: 'preferences',
initialState,
reducers: {
setFontSizeActions: (state, action) => {
state.fontSize = action.payload;
},
setAutoSaveActions: (state, action) => {
state.autosave = action.payload;
},
setLineWrapActions: (state, action) => {
state.linewrap = action.payload;
},
setLintWarningActions: (state, action) => {
state.lintWarning = action.payload;
},
setTextOutputActions: (state, action) => {
state.textOutput = action.payload;
},
setGridOutputActions: (state, action) => {
state.gridOutput = action.payload;
},
setPreferencesActions(state, action) {
return action.payload;
},
setThemeActions: (state, action) => {
state.theme = action.payload;
},
setAutoRefreshActions: (state, action) => {
state.autorefresh = action.payload;
},
setLineNumbersActions: (state, action) => {
state.lineNumbers = action.payload;
},
setAutocloseBracketsQuotesActions: (state, action) => {
state.autocloseBracketsQuotes = action.payload;
},
setAutocompleteHinterActions: (state, action) => {
state.autocompleteHinter = action.payload;
},
setLanguageActions: (state, action) => {
state.language = action.payload;
}
}
};
});

export const {
setFontSizeActions,
setAutoSaveActions,
setLineWrapActions,
setLintWarningActions,
setTextOutputActions,
setGridOutputActions,
setPreferencesActions,
setThemeActions,
setAutoRefreshActions,
setLineNumbersActions,
setAutocloseBracketsQuotesActions,
setAutocompleteHinterActions,
setLanguageActions
} = preferencesSlice.actions;

export default preferences;
export default preferencesSlice.reducer;