diff options
author | Sunil Shetye | 2025-03-28 00:21:44 +0530 |
---|---|---|
committer | Sunil Shetye | 2025-04-07 15:38:16 +0530 |
commit | 08073c73fd18585a46266896c1e806aff05ca4ca (patch) | |
tree | 1ca7e7ebfdf31525b322a68274310641271ad5c3 | |
parent | 8c46c646e2ef2447173f4ed8b7549b72d6c960ed (diff) | |
download | Common-Interface-Project-08073c73fd18585a46266896c1e806aff05ca4ca.tar.gz Common-Interface-Project-08073c73fd18585a46266896c1e806aff05ca4ca.tar.bz2 Common-Interface-Project-08073c73fd18585a46266896c1e806aff05ca4ca.zip |
convert dashboard action/reducer to slice
14 files changed, 135 insertions, 111 deletions
diff --git a/blocks/eda-frontend/src/components/Dashboard/DashboardSidebar.js b/blocks/eda-frontend/src/components/Dashboard/DashboardSidebar.js index a0bc92e9..5940ac68 100644 --- a/blocks/eda-frontend/src/components/Dashboard/DashboardSidebar.js +++ b/blocks/eda-frontend/src/components/Dashboard/DashboardSidebar.js @@ -4,7 +4,7 @@ import { Link as RouterLink } from 'react-router-dom' import { makeStyles } from '@material-ui/core/styles' import { deepPurple } from '@material-ui/core/colors' import { useDispatch, useSelector } from 'react-redux' -import { fetchSchematics } from '../../redux/actions/index' +import { fetchSchematics } from '../../redux/dashboardSlice' import { getUppercaseInitial } from '../../utils/GalleryUtils' const useStyles = makeStyles((theme) => ({ @@ -40,7 +40,7 @@ const useStyles = makeStyles((theme) => ({ export default function DashSidebar (props) { const classes = useStyles() const user = useSelector(state => state.auth.user) - const schematics = useSelector(state => state.dashboardReducer.schematics) + const schematics = useSelector(state => state.dashboard.schematics) const dispatch = useDispatch() diff --git a/blocks/eda-frontend/src/components/Dashboard/ProgressPanel.js b/blocks/eda-frontend/src/components/Dashboard/ProgressPanel.js index 7b1fd019..06b06b4c 100644 --- a/blocks/eda-frontend/src/components/Dashboard/ProgressPanel.js +++ b/blocks/eda-frontend/src/components/Dashboard/ProgressPanel.js @@ -5,7 +5,7 @@ import PropTypes from 'prop-types' import SchematicCard from './SchematicCard' import { useDispatch, useSelector } from 'react-redux' -import { fetchSchematics } from '../../redux/actions/index' +import { fetchSchematics } from '../../redux/dashboardSlice' const useStyles = makeStyles((theme) => ({ root: { @@ -56,7 +56,7 @@ export default function ProgressPanel () { setValue(newValue) } - const schematics = useSelector(state => state.dashboardReducer.schematics) + const schematics = useSelector(state => state.dashboard.schematics) const dispatch = useDispatch() diff --git a/blocks/eda-frontend/src/components/Dashboard/SchematicCard.js b/blocks/eda-frontend/src/components/Dashboard/SchematicCard.js index b3c2f085..c3700903 100644 --- a/blocks/eda-frontend/src/components/Dashboard/SchematicCard.js +++ b/blocks/eda-frontend/src/components/Dashboard/SchematicCard.js @@ -6,7 +6,7 @@ import { makeStyles } from '@material-ui/core/styles' import { Link as RouterLink } from 'react-router-dom' import DeleteIcon from '@material-ui/icons/Delete' import { useDispatch } from 'react-redux' -import { deleteSchematic } from '../../redux/actions/index' +import { deleteSchematic } from '../../redux/dashboardSlice' import MuiAlert from '@material-ui/lab/Alert' import { getDate } from '../../utils/GalleryUtils' diff --git a/blocks/eda-frontend/src/components/Dashboard/SchematicsList.js b/blocks/eda-frontend/src/components/Dashboard/SchematicsList.js index 75562afb..f68b8c4c 100644 --- a/blocks/eda-frontend/src/components/Dashboard/SchematicsList.js +++ b/blocks/eda-frontend/src/components/Dashboard/SchematicsList.js @@ -5,7 +5,7 @@ import { Link as RouterLink } from 'react-router-dom' import SchematicCard from './SchematicCard' import { useDispatch, useSelector } from 'react-redux' -import { fetchSchematics } from '../../redux/actions/index' +import { fetchSchematics } from '../../redux/dashboardSlice' const useStyles = makeStyles({ mainHead: { @@ -56,7 +56,7 @@ function MainCard () { export default function SchematicsList () { const classes = useStyles() const user = useSelector(state => state.auth.user) - const schematics = useSelector(state => state.dashboardReducer.schematics) + const schematics = useSelector(state => state.dashboard.schematics) const dispatch = useDispatch() diff --git a/blocks/eda-frontend/src/components/SchematicEditor/ToolbarExtension.js b/blocks/eda-frontend/src/components/SchematicEditor/ToolbarExtension.js index bcf7b567..b2fdb5ef 100644 --- a/blocks/eda-frontend/src/components/SchematicEditor/ToolbarExtension.js +++ b/blocks/eda-frontend/src/components/SchematicEditor/ToolbarExtension.js @@ -36,7 +36,8 @@ import { import { makeStyles } from '@material-ui/core/styles' import CloseIcon from '@material-ui/icons/Close' import { useSelector, useDispatch } from 'react-redux' -import { fetchSchematics, fetchSchematic, fetchDiagram, fetchGallery, setSchScriptDump } from '../../redux/actions/index' +import { fetchSchematic, fetchDiagram, setSchScriptDump } from '../../redux/actions/index' +import { fetchSchematics, fetchGallery } from '../../redux/dashboardSlice' import { setScriptTaskId } from '../../redux/simulationSlice' import { blue } from '@material-ui/core/colors' import { getDateTime as getDate, getUppercaseInitial, saveToFile } from '../../utils/GalleryUtils' @@ -524,8 +525,8 @@ export function OpenSchDialog (props) { const details = useSelector(state => state.saveSchematicReducer.details) const isAuthenticated = useSelector(state => state.auth.isAuthenticated) const user = useSelector(state => state.auth.user) - const schematics = useSelector(state => state.dashboardReducer.schematics) - const GallerySchSample = useSelector(state => state.dashboardReducer.gallery) + const schematics = useSelector(state => state.dashboard.schematics) + const GallerySchSample = useSelector(state => state.dashboard.gallery) const dispatch = useDispatch() diff --git a/blocks/eda-frontend/src/pages/Gallery.js b/blocks/eda-frontend/src/pages/Gallery.js index f8be9fb0..a37eb907 100644 --- a/blocks/eda-frontend/src/pages/Gallery.js +++ b/blocks/eda-frontend/src/pages/Gallery.js @@ -6,7 +6,7 @@ import { makeStyles } from '@material-ui/core/styles' import { Link as RouterLink } from 'react-router-dom' import { useDispatch, useSelector } from 'react-redux' import api from '../utils/Api' -import { fetchGallery } from '../redux/actions/index' +import { fetchGallery } from '../redux/dashboardSlice' const useStyles = makeStyles((theme) => ({ mainHead: { @@ -196,7 +196,7 @@ SearchComponent.propTypes = { const Gallery = () => { const classes = useStyles() - const GallerySchSample = useSelector(state => state.dashboardReducer.gallery) + const GallerySchSample = useSelector(state => state.dashboard.gallery) // State to store the selected book ID const [selectedBook, setSelectedBook] = useState('') diff --git a/blocks/eda-frontend/src/redux/actions/actions.js b/blocks/eda-frontend/src/redux/actions/actions.js index 85bc061e..87267226 100644 --- a/blocks/eda-frontend/src/redux/actions/actions.js +++ b/blocks/eda-frontend/src/redux/actions/actions.js @@ -30,6 +30,4 @@ export const LOAD_GALLERY = 'LOAD_GALLERY' export const SET_SCH_SCRIPT_DUMP = 'SET_SCH_SCRIPT_DUMP' // Action for fetching on-cloud saved schematics for authenticated user to display in dashboard -export const FETCH_SCHEMATICS = 'FETCH_SCHEMATICS' -export const FETCH_GALLERY = 'FETCH_GALLERY' export const FETCH_DIAGRAM = 'FETCH_DIAGRAM' diff --git a/blocks/eda-frontend/src/redux/actions/dashboardActions.js b/blocks/eda-frontend/src/redux/actions/dashboardActions.js deleted file mode 100644 index 9d47b289..00000000 --- a/blocks/eda-frontend/src/redux/actions/dashboardActions.js +++ /dev/null @@ -1,66 +0,0 @@ -import api from '../../utils/Api' -import * as actions from './actions' - -// Api call for listing saved schematic to display on dashboard -export const fetchSchematics = () => (dispatch, getState) => { - const token = getState().auth.token - - const config = { - headers: { - 'Content-Type': 'application/json' - } - } - - if (token) { - config.headers.Authorization = `Token ${token}` - } - - api.get('save/list', config) - .then( - (res) => { - dispatch({ - type: actions.FETCH_SCHEMATICS, - payload: res.data - }) - } - ) - .catch((err) => { console.error(err) }) -} - -export const fetchGallery = () => (dispatch) => { - api.get('save/gallery') - .then( - (res) => { - dispatch({ - type: actions.FETCH_GALLERY, - payload: res.data - }) - } - ) - .catch((err) => { console.error(err) }) -} - -// Api call for deleting saved schematic -export const deleteSchematic = (saveId) => (dispatch, getState) => { - const token = getState().auth.token - - const config = { - headers: { - 'Content-Type': 'application/x-www-form-urlencoded' - } - } - - if (token) { - config.headers.Authorization = `Token ${token}` - } - - api.delete('save/diagram/' + saveId, config) - .then( - (res) => { - if (res.status === 200) { - dispatch(fetchSchematics()) - } - } - ) - .catch((err) => { console.error(err) }) -} diff --git a/blocks/eda-frontend/src/redux/actions/index.js b/blocks/eda-frontend/src/redux/actions/index.js index 7fbee38a..bd55df33 100644 --- a/blocks/eda-frontend/src/redux/actions/index.js +++ b/blocks/eda-frontend/src/redux/actions/index.js @@ -3,4 +3,3 @@ export * from './schematicEditorActions' export * from './componentPropertiesActions' export * from './netlistActions' export * from './saveSchematicActions' -export * from './dashboardActions' diff --git a/blocks/eda-frontend/src/redux/dashboardSlice.js b/blocks/eda-frontend/src/redux/dashboardSlice.js new file mode 100644 index 00000000..c1b49046 --- /dev/null +++ b/blocks/eda-frontend/src/redux/dashboardSlice.js @@ -0,0 +1,112 @@ +import { createSlice, createAsyncThunk } from '@reduxjs/toolkit' + +import api from '../utils/Api' + +const initialState = { + isLoading: false, + schematics: [], + gallery: [] +} + +// Api call for listing saved schematic to display on dashboard +export const fetchSchematics = createAsyncThunk( + 'dashboard/fetchSchematics', + async (_, { getState, rejectWithValue }) => { + const token = getState().auth.token + if (!token) return rejectWithValue('No token found') + + const config = { + headers: { + 'Content-Type': 'application/json', + Authorization: `Token ${token}` + } + } + + try { + const res = await api.get('save/list', config) + if (res.status === 200) { + return res.data + } + + return rejectWithValue('No data found') + } catch (err) { + console.error(err) + return rejectWithValue('No data found') + } + }) + +export const fetchGallery = createAsyncThunk( + 'dashboard/fetchGallery', + async (_, { rejectWithValue }) => { + try { + const res = await api.get('save/gallery') + if (res.status === 200) { + return res.data + } + + return rejectWithValue('No data found') + } catch (err) { + console.error(err) + return rejectWithValue('No data found') + } + }) + +// Api call for deleting saved schematic +export const deleteSchematic = createAsyncThunk( + 'dashboard/deleteSchematic', + async (saveId, { getState, rejectWithValue, dispatch }) => { + const token = getState().auth.token + if (!token) return rejectWithValue('No token found') + + const config = { + headers: { + 'Content-Type': 'application/json', + Authorization: `Token ${token}` + } + } + + try { + const res = await api.delete('save/diagram/' + saveId, config) + if (res.status === 200) { + await dispatch(fetchSchematics()) + return saveId + } + + return rejectWithValue('No data found') + } catch (err) { + console.error(err) + return rejectWithValue('No data found') + } + }) + +const dashboardSlice = createSlice({ + name: 'dashboard', + initialState, + extraReducers: (builder) => { + builder + .addCase(fetchSchematics.pending, (state) => { + state.isLoading = true + }) + .addCase(fetchSchematics.fulfilled, (state, action) => { + state.isLoading = false + state.schematics = action.payload + }) + .addCase(fetchSchematics.rejected, (state) => { + state.isLoading = false + state.schematics = [] + }) + .addCase(fetchGallery.pending, (state) => { + state.isLoading = true + }) + .addCase(fetchGallery.fulfilled, (state, action) => { + state.isLoading = false + state.gallery = action.payload + }) + .addCase(fetchGallery.rejected, (state) => { + state.isLoading = false + state.gallery = [] + }) + } +}) + +export default dashboardSlice.reducer diff --git a/blocks/eda-frontend/src/redux/reducers/dashboardReducer.js b/blocks/eda-frontend/src/redux/reducers/dashboardReducer.js deleted file mode 100644 index b347f8da..00000000 --- a/blocks/eda-frontend/src/redux/reducers/dashboardReducer.js +++ /dev/null @@ -1,27 +0,0 @@ -import * as actions from '../actions/actions' - -const InitialState = { - schematics: [], - gallery: [] -} - -export default function dashboardReducer (state = InitialState, action) { - switch (action.type) { - case actions.FETCH_SCHEMATICS: { - return { - ...state, - schematics: action.payload - } - } - - case actions.FETCH_GALLERY: { - return { - ...state, - gallery: action.payload - } - } - - default: - return state - } -} diff --git a/blocks/eda-frontend/src/redux/reducers/index.js b/blocks/eda-frontend/src/redux/reducers/index.js index 660caf78..e8474bb2 100644 --- a/blocks/eda-frontend/src/redux/reducers/index.js +++ b/blocks/eda-frontend/src/redux/reducers/index.js @@ -3,11 +3,9 @@ import schematicEditorReducer from './schematicEditorReducer' import componentPropertiesReducer from './componentPropertiesReducer' import netlistReducer from './netlistReducer' import saveSchematicReducer from './saveSchematicReducer' -import dashboardReducer from './dashboardReducer' export default combineReducers({ schematicEditorReducer, componentPropertiesReducer, netlistReducer, - saveSchematicReducer, - dashboardReducer + saveSchematicReducer }) diff --git a/blocks/eda-frontend/src/redux/store.js b/blocks/eda-frontend/src/redux/store.js index d2c2c9c8..4e16a2a1 100644 --- a/blocks/eda-frontend/src/redux/store.js +++ b/blocks/eda-frontend/src/redux/store.js @@ -1,10 +1,12 @@ import { configureStore } from '@reduxjs/toolkit' import authReducer from './authSlice' +import dashboardReducer from './dashboardSlice' import simulationReducer from './simulationSlice' const store = configureStore({ reducer: { auth: authReducer, + dashboard: dashboardReducer, simulation: simulationReducer }, middleware: (getDefaultMiddleware) => getDefaultMiddleware() diff --git a/blocks/eda-frontend/src/utils/GalleryUtils.js b/blocks/eda-frontend/src/utils/GalleryUtils.js index def4c512..d7fe871c 100644 --- a/blocks/eda-frontend/src/utils/GalleryUtils.js +++ b/blocks/eda-frontend/src/utils/GalleryUtils.js @@ -192,3 +192,10 @@ export const getUppercaseInitial = (str) => { const char = match ? match[0] : str.charAt(0) return char.toUpperCase() } + +export const removeBySaveIdInPlace = (schematics, saveId) => { + const index = schematics.findIndex(item => item.save_id === saveId) + if (index !== -1) { + schematics.splice(index, 1) + } +} |