platform icon indicating copy to clipboard operation
platform copied to clipboard

feat(signals): add `withLinkedState()`

Open rainerhahnekamp opened this issue 6 months ago • 2 comments

This is a non-breaking feature to support linkedSignal.

This branch is based on #4795 which has to be merged first.

Please read the comment in #4871


withLinkedState generates and adds the properties of a linkedSignal to the store's state.

Usage Notes:

const UserStore = signalStore(
  withState({ options: [1, 2, 3] }),
  withLinkedState(({ options }) => ({ selectOption: options()[0] ?? undefined }))
);

The resulting state is of type { options: number[], selectOption: number | undefined }. Whenever the options signal changes, the selectOption will automatically update.

For advanced use cases, linkedSignal can be called within withLinkedState:

const UserStore = signalStore(
  withState({ id: 1 }),
  withLinkedState(({ id }) => linkedSignal({
    source: id,
    computation: () => ({ firstname: '', lastname: '' })
  }))
)

Please check if your PR fulfills the following requirements:

  • [x] The commit message follows our guidelines: https://github.com/ngrx/platform/blob/main/CONTRIBUTING.md#commit
  • [x] Tests for the changes have been added (for bug fixes / features)
  • [ ] Documentation has been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

[ ] Bugfix
[x] Feature
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no api changes)
[ ] Build related changes
[ ] CI related changes
[ ] Documentation content changes
[ ] Other... Please describe:

What is the current behavior?

Closes #4871

What is the new behavior?

Does this PR introduce a breaking change?

[ ] Yes
[x] No

Other information

rainerhahnekamp avatar Jun 04 '25 23:06 rainerhahnekamp

Deploy Preview for ngrx-io ready!

Built without sensitive environment variables

Name Link
Latest commit d8e0748511b458e19d5eaaaf827088533444dee2
Latest deploy log https://app.netlify.com/projects/ngrx-io/deploys/686eb88a1e94c900089e6f6a
Deploy Preview https://deploy-preview-4818--ngrx-io.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify[bot] avatar Jun 04 '25 23:06 netlify[bot]

Deploy Preview for ngrx-site-v19 ready!

Name Link
Latest commit d8e0748511b458e19d5eaaaf827088533444dee2
Latest deploy log https://app.netlify.com/projects/ngrx-site-v19/deploys/686eb88a0c9dd20008d17e4c
Deploy Preview https://deploy-preview-4818--ngrx-site-v19.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify[bot] avatar Jun 04 '25 23:06 netlify[bot]

@markostanimirovic, @timdeschryver this one has been rebased to main and is now ready for review.

rainerhahnekamp avatar Jul 03 '25 19:07 rainerhahnekamp

Closing because of stalling github processing (more than 2 hours)

image

rainerhahnekamp avatar Jul 07 '25 17:07 rainerhahnekamp

@markostanimirovic, @timdeschryver, I think I've applied all necessary changes (including the docs). We can do another round of review.

rainerhahnekamp avatar Jul 07 '25 20:07 rainerhahnekamp

@markostanimirovic, @michael-small

Wow, what a review. Corrections outnumbered the actual code by a margin...a review for the records 😅 . I seriously owe you both a drink for that.


I've applied all the changes and double-checked. I also updated the jsdoc for withLinkedState so that it matches the examples of the docs.

rainerhahnekamp avatar Jul 08 '25 07:07 rainerhahnekamp