feat: unEffect and unEffectScope #43
Conversation
🦋 Changeset detectedLatest commit: 4aa9125 The changes in this PR will be included in the next version bump. This PR includes changesets to release 5 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
WalkthroughThis change introduces two new features, Changes
Sequence Diagram(s)sequenceDiagram
participant FrameworkAdapter as Framework Adapter (Angular/React/Solid/Vue)
participant unEffect as unEffect
participant effect as effect (alien-signals)
FrameworkAdapter->>unEffect: unEffect(callback)
unEffect->>effect: effect(callback)
effect-->>unEffect: disposer
unEffect-->>FrameworkAdapter: disposer
sequenceDiagram
participant User
participant unEffectScope as unEffectScope
participant effectScope as effectScope (alien-signals)
User->>unEffectScope: unEffectScope(callback)
unEffectScope->>effectScope: effectScope(callback)
effectScope-->>unEffectScope: disposer
unEffectScope-->>User: disposer
Poem
📜 Recent review detailsConfiguration used: CodeRabbit UI ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (15)
💤 Files with no reviewable changes (4)
🚧 Files skipped from review as they are similar to previous changes (9)
🧰 Additional context used🪛 ESLintpackages/unuse/src/unEffect/index.ts[error] 1-1: Unable to resolve path to module 'alien-signals'. (import-x/no-unresolved) packages/unuse/src/unEffectScope/index.ts[error] 1-1: Unable to resolve path to module 'alien-signals'. (import-x/no-unresolved) 🔇 Additional comments (5)
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
There was a problem hiding this comment.
Important
Looks good to me! 👍
Reviewed everything up to da0226e in 1 minute and 41 seconds. Click for details.
- Reviewed
331lines of code in11files - Skipped
0files when reviewing. - Skipped posting
19draft comments. View those below. - Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.
1. .changeset/ten-melons-clap.md:1
- Draft comment:
Changeset file correctly lists minor updates for all frameworks and the unuse package. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative and does not provide any actionable feedback or suggestions for improvement. It simply states that the changeset file lists minor updates, which does not help the PR author in any way.
2. packages/unuse-angular/src/index.ts:57
- Draft comment:
Replaced direct 'effect' call with 'unEffect' wrapper to encapsulate side effects and maintain consistent dependency tracking. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, explaining a change that was made without suggesting any improvements or asking for clarification. It doesn't provide actionable feedback or raise any concerns about the code.
3. packages/unuse-angular/src/index.ts:129
- Draft comment:
Using 'unEffect' instead of 'effect' for updating the Angular signal in unResolve; ensure the new abstraction behaves identically. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%The comment is asking the author to ensure that the new abstraction behaves identically, which is against the rules. It doesn't provide a specific suggestion or point out a specific issue with the code.
4. packages/unuse-react/src/index.ts:64
- Draft comment:
Replaced the direct 'effect' call with 'unEffect' to handle React state updates consistently. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, explaining what was changed without providing any actionable feedback or suggestions. It doesn't ask for confirmation or suggest improvements.
5. packages/unuse-react/src/index.ts:142
- Draft comment:
Using 'unEffect' in the unResolve function for React to synchronize state changes with the UnSignal. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment seems to be purely informative, explaining what 'unEffect' is doing in the code. It doesn't provide a suggestion, ask for confirmation, or point out a potential issue. Therefore, it violates the rule against purely informative comments.
6. packages/unuse-solid/src/index.ts:72
- Draft comment:
Switched from 'effect' to 'unEffect' for syncing signal updates in the Solid integration. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, describing a change made in the code without providing any actionable feedback or suggestions. It doesn't ask for confirmation or suggest improvements.
7. packages/unuse-solid/src/index.ts:144
- Draft comment:
Replaced 'effect' with 'unEffect' to update the Solid signal state within the unResolve function. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, explaining a change made in the code without providing any actionable feedback or suggestions. It doesn't ask for confirmation or suggest improvements.
8. packages/unuse-vue/src/index.ts:60
- Draft comment:
Using 'unEffect' instead of 'effect' to synchronize the Vue ref's value from the UnSignal. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, explaining a change in the code without suggesting any action or asking for clarification. It doesn't provide any actionable feedback or raise any concerns about the code change.
9. packages/unuse-vue/src/index.ts:127
- Draft comment:
Replaced 'effect' with 'unEffect' in the unResolve function to keep the Vue ref updated with the UnSignal. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, explaining a change made in the code without suggesting any improvements or asking for clarification. It doesn't align with the rules for useful comments.
10. packages/unuse/src/index.ts:10
- Draft comment:
Exports for 'unEffect' and 'unEffectScope' have been added to the public API, which aligns with the new abstraction goals. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, stating that exports have been added to the public API and aligns with abstraction goals. It doesn't provide any actionable feedback or suggestions for improvement.
11. packages/unuse/src/toUnSignal/index.ts:60
- Draft comment:
Replaced the direct 'effect' with 'unEffect' in the block handling signals with a 'set' property to ensure consistent reactivity. - Reason this comment was not posted:
Comment was not on a location in the diff, so it can't be submitted as a review comment.
12. packages/unuse/src/toUnSignal/index.ts:94
- Draft comment:
Replaced 'effect' with 'unEffect' for state synchronization in the React-specific branch of toUnSignal. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, describing a change made in the code without providing any actionable feedback or suggestions. It doesn't ask for confirmation or suggest improvements, nor does it highlight any potential issues with the change.
13. packages/unuse/src/unEffect/index.ts:5
- Draft comment:
New 'unEffect' wrapper correctly delegates to alien-signals' effect. This abstraction allows future enhancements. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, describing what the new 'unEffect' wrapper does and its potential for future enhancements. It doesn't provide any actionable feedback or suggestions for improvement.
14. packages/unuse/src/unEffectScope/index.ts:5
- Draft comment:
New 'unEffectScope' wrapper abstracts over alien-signals' effectScope, paving the way for future customizations. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, describing a new wrapper and its potential for future customizations. It doesn't provide any actionable feedback or suggestions for improvement.
15. packages/unuse/src/unResolve/index.ts:113
- Draft comment:
In the Angular branch of unResolve, 'effect' was replaced with 'unEffect' to keep the state in sync; verify that dependency tracking is preserved. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%The comment is asking the PR author to verify that dependency tracking is preserved, which violates the rule against asking for confirmation or verification. It does not provide a specific suggestion or point out a specific issue.
16. packages/unuse/src/unResolve/index.ts:162
- Draft comment:
Within the React branch, switching to 'unEffect' ensures that state updates from UnSignal are applied consistently. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment seems to be purely informative, explaining what a change does without suggesting any action or asking for clarification. It doesn't provide a suggestion or ask for confirmation about the intention behind the change.
17. packages/unuse/src/unResolve/index.ts:147
- Draft comment:
In the Solid branch, 'unEffect' is used to synchronize the signal state; confirm that this abstraction behaves as expected with Solid's reactivity. - Reason this comment was not posted:
Comment was not on a location in the diff, so it can't be submitted as a review comment.
18. packages/unuse/src/unResolve/index.ts:217
- Draft comment:
For the Vue branch, replacing 'effect' with 'unEffect' maintains the synchronization between the Vue ref and the UnSignal. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment seems to be purely informative, explaining the effect of a change without suggesting any action or asking for confirmation. It doesn't align with the rules for useful comments.
19. packages/unuse/src/unWatch/index.ts:23
- Draft comment:
Replaced alien-signals' effect and effectScope with 'unEffect' and 'unEffectScope' to provide a unified abstraction for watching signal changes. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, explaining what changes were made without providing any actionable feedback or suggestions. It does not ask for confirmation or suggest improvements.
Workflow ID: wflow_5qgBsUWFcyD32fj4
You can customize 
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
packages/unuse/src/unEffect/index.ts (2)
5-7: Add JSDoc documentation for the public API.Consider adding JSDoc comments to document the purpose and behavior of the
unEffectfunction, especially since this is part of the public API.+/** + * Creates a reactive effect that runs the provided callback function. + * This is a wrapper around the alien-signals effect function. + * + * @param callback - The callback function to run reactively + * @returns A function to dispose the effect + */ export function unEffect(callback: () => void): UnEffectReturn { return effect(callback); }
3-3: Consider more descriptive type naming.The type
UnEffectReturncould be more descriptive to align with the project's naming conventions.-export type UnEffectReturn = () => void; +export type UnEffectDisposer = () => void;Then update the function signature accordingly:
-export function unEffect(callback: () => void): UnEffectReturn { +export function unEffect(callback: () => void): UnEffectDisposer {
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (11)
.changeset/ten-melons-clap.md(1 hunks)packages/unuse-angular/src/index.ts(3 hunks)packages/unuse-react/src/index.ts(3 hunks)packages/unuse-solid/src/index.ts(3 hunks)packages/unuse-vue/src/index.ts(3 hunks)packages/unuse/src/index.ts(1 hunks)packages/unuse/src/toUnSignal/index.ts(5 hunks)packages/unuse/src/unEffect/index.ts(1 hunks)packages/unuse/src/unEffectScope/index.ts(1 hunks)packages/unuse/src/unResolve/index.ts(5 hunks)packages/unuse/src/unWatch/index.ts(2 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (7)
packages/unuse/src/unWatch/index.ts (2)
packages/unuse/src/unEffectScope/index.ts (1)
unEffectScope(5-7)packages/unuse/src/unEffect/index.ts (1)
unEffect(5-7)
packages/unuse-solid/src/index.ts (1)
packages/unuse/src/unEffect/index.ts (1)
unEffect(5-7)
packages/unuse-vue/src/index.ts (1)
packages/unuse/src/unEffect/index.ts (1)
unEffect(5-7)
packages/unuse/src/toUnSignal/index.ts (1)
packages/unuse/src/unEffect/index.ts (1)
unEffect(5-7)
packages/unuse/src/unResolve/index.ts (1)
packages/unuse/src/unEffect/index.ts (1)
unEffect(5-7)
packages/unuse-angular/src/index.ts (1)
packages/unuse/src/unEffect/index.ts (1)
unEffect(5-7)
packages/unuse-react/src/index.ts (1)
packages/unuse/src/unEffect/index.ts (1)
unEffect(5-7)
🪛 ESLint
packages/unuse/src/unEffectScope/index.ts
[error] 1-1: Unable to resolve path to module 'alien-signals'.
(import-x/no-unresolved)
packages/unuse/src/unEffect/index.ts
[error] 1-1: Unable to resolve path to module 'alien-signals'.
(import-x/no-unresolved)
🔇 Additional comments (21)
packages/unuse/src/unEffect/index.ts (1)
1-1: Verify the alien-signals dependency is properly configured.The ESLint error indicates the 'alien-signals' module cannot be resolved. Ensure this dependency is properly installed and configured in the package.json.
#!/bin/bash # Description: Check if alien-signals is properly configured as a dependency # Check if alien-signals is listed in package.json dependencies echo "Checking package.json files for alien-signals dependency:" fd package.json --exec grep -l "alien-signals" {} # Check if alien-signals is installed in node_modules echo -e "\nChecking for alien-signals in node_modules:" fd -t d alien-signals.changeset/ten-melons-clap.md (1)
1-10: LGTM! Changeset documentation is well-structured.The changeset correctly documents the new features and includes all affected packages with appropriate minor version bumps.
packages/unuse/src/index.ts (1)
10-11: LGTM! Export additions are correctly implemented.The new exports for
unEffectandunEffectScopeare properly added and maintain the file's alphabetical ordering.packages/unuse/src/toUnSignal/index.ts (2)
7-7: LGTM! Import update is correctly implemented.The import change from
alien-signalsto the localunEffectmodule is correct and aligns with the PR objectives to encapsulate alien-signals behind the wrapper API.
66-68: LGTM! Consistent replacement of effect with unEffect.All
effect()calls have been correctly replaced withunEffect()across all framework implementations. The function signatures and behavior remain unchanged, ensuring backward compatibility.Also applies to: 97-101, 134-136, 159-161
packages/unuse-vue/src/index.ts (2)
16-16: LGTM! Import update includes unEffect correctly.The import statement properly includes
unEffectfrom the 'unuse' package, consistent with the pattern used across other framework adapters.
61-63: LGTM! Consistent replacement of effect with unEffect in Vue adapter.Both
effect()calls have been correctly replaced withunEffect()in the Vue-specific reactive synchronization logic. The changes maintain the same behavior while using the new wrapper function.Also applies to: 130-130
packages/unuse-angular/src/index.ts (3)
25-25: LGTM: Clean import updateThe import change from
effecttounEffectaligns with the PR objective of encapsulating alien-signals behind the scenes.
57-59: LGTM: Consistent usage updateThe replacement of
effectwithunEffectmaintains the same callback signature and behavior while using the new internal wrapper.
129-129: LGTM: Consistent usage updateThe replacement of
effectwithunEffectis consistent with the other changes in this file and maintains the same reactive synchronization behavior.packages/unuse-solid/src/index.ts (3)
26-26: LGTM: Import update aligns with refactorThe import change from
effecttounEffectis consistent with the broader refactor across framework adapters.
72-74: LGTM: Consistent reactive effect usageThe replacement of
effectwithunEffectmaintains the bidirectional reactivity between Solid signals and UnSignals.
147-147: LGTM: Consistent usage in unResolveThe
unEffectusage properly maintains the reactive synchronization from UnSignal to Solid signal.packages/unuse/src/unWatch/index.ts (2)
2-3: LGTM: Import updates support internal abstractionThe imports now use the internal
unEffectandunEffectScopewrappers instead of directly importing from alien-signals, supporting the PR's encapsulation goal.
23-24: LGTM: Consistent usage of internal wrappersThe replacement of
effectScopeandeffectwithunEffectScopeandunEffectmaintains the same reactive watch behavior while using the new internal abstractions.packages/unuse-react/src/index.ts (3)
23-23: LGTM: Import change supports encapsulationThe import update from
effecttounEffectaligns with the consistent refactor across all framework adapters.
64-68: LGTM: Reactive synchronization maintainedThe replacement of
effectwithunEffectpreserves the bidirectional reactivity between React state and UnSignals.
145-153: LGTM: Consistent usage in unResolveThe
unEffectusage maintains proper reactive synchronization from UnSignal to React state with the same conditional logic.packages/unuse/src/unEffectScope/index.ts (1)
1-7: I’d like to confirm that the declared version in your package and the version locked in pnpm match up. Let’s inspect yourpackages/unuse/package.json, the rootpackage.json, and thepnpm-lock.yamlentries foralien-signals:#!/bin/bash echo "▶ packages/unuse/package.json dependencies:" grep -R '"alien-signals"' -n packages/unuse/package.json || echo " – not found in packages/unuse/package.json" echo -e "\n▶ Root package.json dependencies:" grep -R '"alien-signals"' -n package.json || echo " – not found in root package.json" echo -e "\n▶ Locked versions in pnpm-lock.yaml:" grep -R -n "alien-signals@" pnpm-lock.yaml | head -n 20 || echo " – pnpm-lock.yaml missing entries for alien-signals"packages/unuse/src/unResolve/index.ts (2)
15-15: LGTM! Import change aligns with PR objectives.The import has been correctly updated to use the new internal
unEffectwrapper instead of directly importingeffectfrom alien-signals.
113-113: LGTM! Function calls successfully migrated to internal wrapper.All
effectfunction calls have been consistently replaced withunEffectacross all framework adapters (Angular, React, Solid, Vue). SinceunEffectis a simple wrapper around the originaleffectfunction, this maintains functional equivalence while achieving the PR objective of encapsulating alien-signals behind internal wrappers.Also applies to: 162-162, 206-206, 217-217
da0226e to
4aa9125
Compare
There was a problem hiding this comment.
Important
Looks good to me! 👍
Reviewed everything up to 4aa9125 in 1 minute and 41 seconds. Click for details.
- Reviewed
379lines of code in15files - Skipped
1files when reviewing. - Skipped posting
13draft comments. View those below. - Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.
1. .changeset/ten-melons-clap.md:1
- Draft comment:
Changelog clearly documents the addition of unEffect and unEffectScope wrappers. - Reason this comment was not posted:
Confidence changes required:0%<= threshold50%None
2. packages/unuse-angular/package.json:29
- Draft comment:
Removed direct dependency on 'alien-signals'; ensure centralized management via the 'unuse' package. - Reason this comment was not posted:
Comment looked like it was already resolved.
3. packages/unuse-angular/src/index.ts:57
- Draft comment:
Angular integration: Using unEffect for reactive syncing is consistent with the new abstraction. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment seems to be purely informative, as it is just stating that using unEffect is consistent with a new abstraction. It doesn't provide any actionable feedback or suggestions for improvement.
4. packages/unuse-react/package.json:29
- Draft comment:
Removed direct dependency on 'alien-signals' from React integration. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, stating that a direct dependency on 'alien-signals' was removed from React integration. It doesn't provide any actionable feedback or suggestions for improvement.
5. packages/unuse-react/src/index.ts:64
- Draft comment:
React integration: The unEffect wrapper is now used for state synchronization, ensuring consistent updates. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative, explaining what the unEffect wrapper does in the context of React integration. It doesn't provide any actionable feedback or suggestions for improvement.
6. packages/unuse-solid/src/index.ts:72
- Draft comment:
Solid integration: Using unEffect for reactive updates ensures consistency across frameworks. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative and does not provide any actionable feedback or suggestions for improvement. It simply states an observation about the code without offering any guidance or raising any concerns.
7. packages/unuse-vue/src/index.ts:60
- Draft comment:
Vue integration: The unEffect wrapper is appropriately used to update ref values. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative and does not provide any actionable feedback or suggestions for improvement. It simply states that something is used appropriately, which does not align with the rules for useful comments.
8. packages/unuse/src/index.ts:10
- Draft comment:
Central exports now include unEffect and unEffectScope, providing a uniform reactivity abstraction. - Reason this comment was not posted:
Confidence changes required:0%<= threshold50%None
9. packages/unuse/src/toUnSignal/index.ts:47
- Draft comment:
toUnSignal: Replacing direct effect calls with unEffect ensures consistent reactive behavior. - Reason this comment was not posted:
Comment was not on a location in the diff, so it can't be submitted as a review comment.
10. packages/unuse/src/unEffect/index.ts:5
- Draft comment:
New unEffect wrapper: a thin abstraction over alien-signals' effect, setting the stage for future enhancements. - Reason this comment was not posted:
Confidence changes required:0%<= threshold50%None
11. packages/unuse/src/unEffectScope/index.ts:5
- Draft comment:
New unEffectScope wrapper: a straightforward abstraction over alien-signals' effectScope. - Reason this comment was not posted:
Confidence changes required:0%<= threshold50%None
12. packages/unuse/src/unResolve/index.ts:113
- Draft comment:
unResolve: Switching to unEffect for reactive synchronization provides consistent behavior across different frameworks. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment is purely informative and does not provide any actionable feedback or suggestions for improvement. It simply states a fact about the change without asking for confirmation or suggesting an alternative.
13. packages/unuse/src/unWatch/index.ts:23
- Draft comment:
unWatch: The use of unEffectScope and unEffect for change observation is clear and consistent. - Reason this comment was not posted:
Comment did not seem useful. Confidence is useful =0%<= threshold50%This comment seems to be purely informative, as it is simply stating that the use of certain functions is clear and consistent. It does not provide any actionable feedback or suggestions for improvement.
Workflow ID: wflow_QjjGL6t3YrQdTnoh
You can customize
We now completely wrap alien-signals behind the scenes and expose our own un-signal/reactivity system.
Right now unEffect and unEffectScope are just wrappers around alien-signals effect and effectScope, but we can enhance it later with own functionality internally and control tracking of signal dependencies.
Important
Introduces
unEffectandunEffectScope, replacingalien-signalswith internal implementations across Angular, React, Solid, and Vue integrations.unEffectandunEffectScopeinunEffect/index.tsandunEffectScope/index.ts.unEffectandunEffectScopeinindex.ts.unuse-angular,unuse-react,unuse-solid, andunuse-vueto useunEffectfor reactive synchronization in their respectiveindex.tsfiles.alien-signalswith internalunEffectandunEffectScopeintoUnSignal/index.ts,unResolve/index.ts, andunWatch/index.ts.alien-signalsdependency frompackage.jsoninunuse-angular,unuse-react,unuse-solid, andunuse-vue.ten-melons-clap.mddescribing the new features and updates.This description was created by
for 4aa9125. You can customize this summary. It will automatically update as commits are pushed.
Summary by CodeRabbit
New Features
unEffectandunEffectScope.Refactor
unEffectfor reactive synchronization.Chores