1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
|
import { createSlice, createAsyncThunk } from '@reduxjs/toolkit'
import api from '../utils/Api'
import { styleToObject } from '../utils/GalleryUtils'
const initialState = {
block: null,
name: '',
id: '',
parameter_values: {},
errorFields: {},
isPropertiesWindowOpen: false,
compProperties: [],
displayProperties: {},
isLoading: false
}
// Actions for listing stored component properites on double click on component
export const getCompProperties = createAsyncThunk(
'componentProperties/getCompProperties',
async (block, { rejectWithValue }) => {
const style = styleToObject(block.style).default
const url = 'newblockparameters/?block__name=' + style
try {
const res = await api.get(url)
if (res.status === 200) {
return res.data
}
return rejectWithValue(res.data || 'Failed to get component properties')
} catch (err) {
console.error(err)
const res = err.response
return rejectWithValue(res.data || 'Failed to get component properties')
}
})
// Actions for updating entered component properites on clicking set parameters
export const setCompProperties = createAsyncThunk(
'componentProperties/setCompProperties',
async ({ block, parameterValues, errorFields }, { rejectWithValue }) => {
const style = styleToObject(block.style).default
const url = 'setblockparameter'
const parameters = Object.values(parameterValues)
const data = { block: style, parameters }
try {
const res = await api.post(url, data)
if (res.status === 200) {
block.parameter_values = parameterValues
block.errorFields = errorFields
return {
block,
parameter_values: parameterValues,
errorFields,
displayProperties: res.data
}
}
return rejectWithValue(res.data || 'Failed to set component properties')
} catch (err) {
console.error(err)
const res = err.response
return rejectWithValue(res.data || 'Failed to set component properties')
}
})
const componentPropertiesSlice = createSlice({
name: 'componentProperties',
initialState,
reducers: {
closeCompProperties: (state) => {
state.isPropertiesWindowOpen = false
}
},
extraReducers: (builder) => {
builder
.addCase(getCompProperties.pending, (state, action) => {
state.isLoading = true
state.isPropertiesWindowOpen = true
state.compProperties = []
const block = action.meta.arg
state.block = block
state.name = styleToObject(block.style).default
state.id = block.id
state.parameter_values = block.parameter_values
state.errorFields = block.errorFields
state.displayProperties = block.displayProperties
})
.addCase(getCompProperties.fulfilled, (state, action) => {
state.isLoading = false
state.isPropertiesWindowOpen = true
state.compProperties = action.payload
})
.addCase(getCompProperties.rejected, (state) => {
state.isLoading = false
state.isPropertiesWindowOpen = false
})
.addCase(setCompProperties.pending, (state) => {
state.isLoading = true
state.isPropertiesWindowOpen = true
})
.addCase(setCompProperties.fulfilled, (state, action) => {
state.isLoading = false
state.isPropertiesWindowOpen = false
state.block = action.payload.block
state.parameter_values = action.payload.parameter_values
state.errorFields = action.payload.errorFields
state.displayProperties = action.payload.displayProperties
})
.addCase(setCompProperties.rejected, (state) => {
state.isLoading = false
state.isPropertiesWindowOpen = true
})
}
})
export const {
closeCompProperties
} = componentPropertiesSlice.actions
export default componentPropertiesSlice.reducer
|
