diff --git a/app/web/src/components/Customizer/Customizer.tsx b/app/web/src/components/Customizer/Customizer.tsx
index 37e8c1a..9010328 100644
--- a/app/web/src/components/Customizer/Customizer.tsx
+++ b/app/web/src/components/Customizer/Customizer.tsx
@@ -1,35 +1,33 @@
import { useRender } from 'src/components/IdeWrapper/useRender'
import { useIdeContext } from 'src/helpers/hooks/useIdeContext'
-import { genParams, getParams } from 'src/helpers/cadPackages/jsCad/jscadParams'
+import { genParams } from 'src/helpers/cadPackages/jsCad/jscadParams'
const Customizer = () => {
const [open, setOpen] = React.useState(true)
const [checked, setChecked] = React.useState(false)
const ref = React.useRef()
const jsCadCustomizerElement = ref.current
- const { state } = useIdeContext()
- const customizerParams = state?.objectData?.customizerParams
- const lastParameters = state?.objectData?.lastParameters
+ const { state, thunkDispatch } = useIdeContext()
+ const customizerParams = state?.customizerParams
+ const currentParameters = state?.currentParameters
const handleRender = useRender()
- const handleRender2 = () => handleRender(getParams(ref.current))
React.useEffect(() => {
if (jsCadCustomizerElement && customizerParams) {
genParams(
customizerParams,
jsCadCustomizerElement,
- lastParameters || {},
+ currentParameters || {},
(values, source) => {
- if (source === 'group' || !checked) {
- // save to local storage but do not render
- return
+ thunkDispatch({ type: 'setCurrentCustomizerParams', payload: values })
+ if (checked) {
+ handleRender()
}
- handleRender(values)
},
[]
)
}
- }, [jsCadCustomizerElement, customizerParams, lastParameters, checked])
+ }, [jsCadCustomizerElement, customizerParams, currentParameters, checked])
return (
{
className="mr-6"
type="checkbox"
checked={checked}
- onChange={({ target }) => {
+ onChange={() => {
const newValue = !checked
- if (newValue) handleRender2()
+ if (newValue) handleRender()
setChecked(newValue)
}}
/>
diff --git a/app/web/src/components/IdeWrapper/useRender.ts b/app/web/src/components/IdeWrapper/useRender.ts
index 17824d6..4ac6312 100644
--- a/app/web/src/components/IdeWrapper/useRender.ts
+++ b/app/web/src/components/IdeWrapper/useRender.ts
@@ -1,10 +1,9 @@
import { makeCodeStoreKey, requestRender } from 'src/helpers/hooks/useIdeState'
import { useIdeContext } from 'src/helpers/hooks/useIdeContext'
-import type { RawCustomizerParams } from 'src/helpers/cadPackages/common'
export const useRender = () => {
const { state, thunkDispatch } = useIdeContext()
- return (parameters?: RawCustomizerParams) => {
+ return () => {
thunkDispatch((dispatch, getState) => {
const state = getState()
dispatch({ type: 'setLoading' })
@@ -14,7 +13,7 @@ export const useRender = () => {
code: state.code,
viewerSize: state.viewerSize,
camera: state.camera,
- parameters,
+ parameters: state.currentParameters,
})
})
localStorage.setItem(makeCodeStoreKey(state.ideType), state.code)
diff --git a/app/web/src/helpers/cadPackages/common.ts b/app/web/src/helpers/cadPackages/common.ts
index 95a60c3..7c17760 100644
--- a/app/web/src/helpers/cadPackages/common.ts
+++ b/app/web/src/helpers/cadPackages/common.ts
@@ -31,8 +31,8 @@ export interface HealthyResponse {
data: any
type: 'stl' | 'png' | 'geometry'
}
- customizerParams?: any
- lastParameters?: any
+ customizerParams?: any[]
+ currentParameters?: RawCustomizerParams
}
export interface RawCustomizerParams {
@@ -45,14 +45,14 @@ export function createHealthyResponse({
consoleMessage,
type,
customizerParams,
- lastParameters,
+ currentParameters,
}: {
date: Date
data: any
consoleMessage: string
type: HealthyResponse['objectData']['type']
customizerParams?: any
- lastParameters?: any
+ currentParameters?: any
}): HealthyResponse {
return {
status: 'healthy',
@@ -66,7 +66,7 @@ export function createHealthyResponse({
time: date,
},
customizerParams,
- lastParameters,
+ currentParameters,
}
}
diff --git a/app/web/src/helpers/cadPackages/jsCad/jsCadController.ts b/app/web/src/helpers/cadPackages/jsCad/jsCadController.ts
index 6cabb4a..c40594d 100644
--- a/app/web/src/helpers/cadPackages/jsCad/jsCadController.ts
+++ b/app/web/src/helpers/cadPackages/jsCad/jsCadController.ts
@@ -70,7 +70,7 @@ function CSG2Object3D(obj) {
}
let scriptWorker
-let lastParameters = {}
+let currentParameters = {}
const scriptUrl = '/demo-worker.js'
let resolveReference = null
let response = null
@@ -117,7 +117,7 @@ export const render: DefaultKernelExport['render'] = async ({
consoleMessage: data.scriptStats,
date: new Date(),
customizerParams: parameterDefinitions,
- lastParameters,
+ currentParameters,
})
}
callResolve()
@@ -148,7 +148,7 @@ export const render: DefaultKernelExport['render'] = async ({
// we need this to keep the form filled with same data when new parameter definitions arrive
// each render of the script could provide new paramaters. In case some of them are still rpesent
// it is expected for them to stay the same and not just reset
- lastParameters = parameters || {}
+ currentParameters = parameters || {}
const waitResult = new Promise((resolve) => {
resolveReference = resolve
diff --git a/app/web/src/helpers/cadPackages/jsCad/jscadParams.ts b/app/web/src/helpers/cadPackages/jsCad/jscadParams.ts
index b43911a..a397e45 100644
--- a/app/web/src/helpers/cadPackages/jsCad/jscadParams.ts
+++ b/app/web/src/helpers/cadPackages/jsCad/jscadParams.ts
@@ -28,7 +28,7 @@ export function genParams(
defs,
target,
storedParams = {},
- callback = undefined,
+ callback: (values: RawCustomizerParams, source: any) => void = undefined,
buttons = ['reset', 'save', 'load', 'edit', 'link']
) {
const funcs = {
@@ -140,7 +140,7 @@ export function genParams(
if (missingKeys.length) console.log('missing param impl', missingKeys)
function _callback(source = 'change') {
- if (callback) callback(getParams(target), source)
+ if (callback && source !== 'group') callback(getParams(target), source)
}
html += '
'
@@ -179,7 +179,7 @@ export function genParams(
})
}
-export function getParams(target: HTMLElement): RawCustomizerParams {
+function getParams(target: HTMLElement): RawCustomizerParams {
const params = {}
if (!target) return params
diff --git a/app/web/src/helpers/hooks/useIdeState.ts b/app/web/src/helpers/hooks/useIdeState.ts
index 2de05d4..7423dab 100644
--- a/app/web/src/helpers/hooks/useIdeState.ts
+++ b/app/web/src/helpers/hooks/useIdeState.ts
@@ -1,6 +1,7 @@
import { useReducer } from 'react'
import { cadPackages } from 'src/helpers/cadPackages'
import type { RootState } from '@react-three/fiber'
+import type { RawCustomizerParams } from 'src/helpers/cadPackages/common'
function withThunk(dispatch, getState) {
return (actionOrThunk) =>
@@ -114,9 +115,9 @@ export interface State {
type: 'INIT' | 'stl' | 'png' | 'geometry'
data: any
quality: 'low' | 'high'
- customizerParams?: any
- lastParameters?: any
}
+ customizerParams?: any[]
+ currentParameters?: RawCustomizerParams
layout: any
camera: {
dist?: number
@@ -180,10 +181,9 @@ export const useIdeState = (): [State, (actionOrThunk: any) => any] => {
...state.objectData,
type: payload.objectData?.type,
data: payload.objectData?.data,
- customizerParams:
- payload.customizerParams || state.objectData.customizerParams,
- lastParameters: payload.lastParameters,
},
+ customizerParams: payload.customizerParams || state.customizerParams,
+ currentParameters: payload.currentParameters,
consoleMessages: payload.message
? [...state.consoleMessages, payload.message]
: payload.message,
@@ -197,6 +197,11 @@ export const useIdeState = (): [State, (actionOrThunk: any) => any] => {
: payload.message,
isLoading: false,
}
+ case 'setCurrentCustomizerParams':
+ return {
+ ...state,
+ currentParameters: payload,
+ }
case 'setLayout':
return {
...state,
@@ -282,7 +287,13 @@ export const requestRender = ({
},
})
.then(
- ({ objectData, message, status, customizerParams, lastParameters }) => {
+ ({
+ objectData,
+ message,
+ status,
+ customizerParams,
+ currentParameters,
+ }) => {
if (status === 'error') {
dispatch({
type: 'errorRender',
@@ -296,7 +307,7 @@ export const requestRender = ({
message,
lastRunCode: code,
customizerParams,
- lastParameters,
+ currentParameters,
},
})
return objectData