Idiomatic way to re-trigger notification of change to complex object in signal ?

[unoexperto]

Hi folks,

What is the idiomatic way to retrigger signal after updating a field in complex object ? Let's say I have something like this

interface Some {
  type: string,
  name: string
}

const [selector, setSelector] = createSignal<Some>()

// something where there does
<Show when={selector()?.type == 'TYPE A'}>
</Show>

// in other place some callback wants to change type
selector().type = 'TYPE B'
setSelector(selector())

changing field of a proxy obviously leads to Cannot mutate a Store directly. I can hack it like this

function myCallback(type: string) {
  setSelector((cur) => {
    unwrap(cur).type = type;
    return cur
  })
}

but that means when signal reaches equality operator it's always true. I tried to set option to equals: false but surprisingly signal is suppressed.

Is there way to achieve what I want with signal or do I have to use store ? Also I can do deep clone via JSON.parse(JSON.stringify(untrack(selector))) but that seems slow.

[atk]

That's what stores are for. Or @solid-primitives/set and map (or trigger if you want to make your own structure reactive).

If you want to learn more about idiomatic state management in solid, I wrote this to help.

[unoexperto]

Tank you, @atk . Could you please also advise how to make call-stack in solid useful ? What I catch in catchError today is not very helpful

TypeError: Cannot read properties of undefined (reading 'type')
    at SectionSelector2 (http://cloud-local.xxx.com:3000/src/routes/pipelineSettingsView.tsx?t=1724836660837:169:76)
    at http://cloud-local.xxx.com:3000/@solid-refresh:25:42
    at untrack (http://cloud-local.xxx.com:3000/node_modules/.vite/deps/chunk-SBQKWOMZ.js?v=b26fb229:543:12)
    at HMRComp.createMemo.name [as fn] (http://cloud-local.xxx.com:3000/@solid-refresh:25:28)
    at runComputation (http://cloud-local.xxx.com:3000/node_modules/.vite/deps/chunk-SBQKWOMZ.js?v=b26fb229:820:22)
    at updateComputation (http://cloud-local.xxx.com:3000/node_modules/.vite/deps/chunk-SBQKWOMZ.js?v=b26fb229:799:3)
    at Object.readSignal (http://cloud-local.xxx.com:3000/node_modules/.vite/deps/chunk-SBQKWOMZ.js?v=b26fb229:732:67)
    at Object.fn (http://cloud-local.xxx.com:3000/node_modules/.vite/deps/chunk-TDKWFQFN.js?v=b26fb229:759:60)
    at runComputation (http://cloud-local.xxx.com:3000/node_modules/.vite/deps/chunk-SBQKWOMZ.js?v=b26fb229:820:22)
    at updateComputation (http://cloud-local.xxx.com:3000/node_modules/.vite/deps/chunk-SBQKWOMZ.js?v=b26fb229:799:3)

The line numbers are off. So I often end up guessing where it failed, wrapping candidate areas in functions just to narrow size of function etc.

[atk]

That has to do with babel not supporting multiple targets for the same line in source maps, which leads to wrong line numbers. However, in this case, you are reading "type" from undefined. It is very likely that you are using an optional object as if it was always present. Just add a question mark before .type in your file and it should be fine.