Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor(cdk:utils): add some methods to control subscribers in createSharedComposable #1519

Closed
wants to merge 3 commits into from

Conversation

kovsu
Copy link
Member

@kovsu kovsu commented Mar 27, 2023

PR Checklist

Please check if your PR fulfills the following requirements:

  • The commit message follows our guidelines
  • Tests for the changes have been added/updated or not needed
  • Docs and demo have been added/updated or not needed

What is the current behavior?

fix #1436

What is the new behavior?

Other information

@idux-bot
Copy link

idux-bot bot commented Mar 27, 2023

This preview will be available after the AzureCI is passed.

@kovsu kovsu requested a review from danranVm March 27, 2023 18:25
@codecov
Copy link

codecov bot commented Mar 27, 2023

Codecov Report

Merging #1519 (6f1bd74) into main (703122f) will decrease coverage by 0.01%.
The diff coverage is 87.50%.

❗ Current head 6f1bd74 differs from pull request most recent head 74aba42. Consider uploading reports for the commit 74aba42 to get more accurate results

@@            Coverage Diff             @@
##             main    #1519      +/-   ##
==========================================
- Coverage   92.75%   92.74%   -0.01%     
==========================================
  Files         331      332       +1     
  Lines       30801    30923     +122     
  Branches     3533     3557      +24     
==========================================
+ Hits        28568    28679     +111     
- Misses       2233     2244      +11     
Impacted Files Coverage Δ
packages/pro/search/src/ProSearch.tsx 16.35% <0.00%> (ø)
packages/cdk/drag-drop/src/utils.ts 49.27% <21.42%> (-6.66%) ⬇️
packages/cdk/utils/src/composable.ts 96.07% <77.77%> (-3.93%) ⬇️
...ckages/components/_private/overlay/src/Overlay.tsx 95.53% <81.25%> (-1.15%) ⬇️
packages/cdk/a11y/src/focusMonitor.ts 91.59% <100.00%> (ø)
packages/cdk/a11y/src/inputModalityDetector.ts 85.96% <100.00%> (+0.12%) ⬆️
packages/cdk/breakpoint/src/breakpoints.ts 97.82% <100.00%> (ø)
packages/cdk/popper/src/usePopper.ts 100.00% <100.00%> (ø)
...ckages/components/_private/date-panel/src/utils.ts 100.00% <100.00%> (ø)
...ages/components/_private/selector/src/Selector.tsx 91.15% <100.00%> (+0.06%) ⬆️
... and 5 more

... and 1 file with indirect coverage changes

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

@danranVm danranVm requested a review from tuchg March 28, 2023 08:48
@danranVm
Copy link
Member

@tuchg 看下, document 作为 context 的时候,被意外的 cleanup 了,导致所有的事件监听都失效了。

tuchg
tuchg previously approved these changes Mar 28, 2023
@@ -568,4 +568,4 @@ export function useFocusMonitor(options?: FocusMonitorOptions): FocusMonitor {
return { monitor, stopMonitoring, focusVia, blurVia }
}

export const useSharedFocusMonitor = createSharedComposable(() => useFocusMonitor())
export const { useComposable: useSharedFocusMonitor } = createSharedComposable(() => useFocusMonitor())
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the code review:

The code patch looks good and there do not seem to be any bugs or risks. It looks like the author is trying to create a shared composable for the useFocusMonitor() function. The new syntax used for export is the latest standard and allows for better readability. Overall, it looks like a solid patch.

export const useSharedInputModalityDetector = createSharedComposable(() => useInputModalityDetector())
export const { useComposable: useSharedInputModalityDetector } = createSharedComposable(() =>
useInputModalityDetector(),
)
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

with code review

The patch above looks valid and should work as expected. To make sure it is error-free, I would suggest running a linter or static analysis tool to check for any potential issues. Additionally, it could be beneficial to add unit tests to ensure the code behaves as intended. Finally, if feasible, consider refactoring the code to make it more readable and maintainable.

@@ -43,4 +43,4 @@ export function useBreakpoints<T extends string>(value?: Record<T, string>): Rec
return match as Record<T, boolean>
}

export const useSharedBreakpoints = createSharedComposable(() => useBreakpoints())
export const { useComposable: useSharedBreakpoints } = createSharedComposable(() => useBreakpoints())
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

code review.

The code patch looks good. It is updating the function useSharedBreakpoints to make it a shared composable. The new code is using the createSharedComposable function, which will enable the use of the useBreakpoints function in multiple components. There are no bugs risks seen in this patch.

It can be improved by adding comments to the code, which will help explain the change and clarify why it was done. Additionally, adding error handling to the useBreakpoints function would be beneficial, to ensure that the code handles unexpected errors gracefully.

if (delSubscribers) {
delSubscribers()
}

registry.off(sourceElement)
listenerStops.forEach(listenerStop => listenerStop())

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The code looks alright. The main issue I can see is that the context variable is not declared with a const or let keyword, which may lead to unexpected behaviour. Also, the code does not have any comments which would help explain what it does and how it works.

Other than that, the code looks to be well written and organized. There are no major bug risks that I can see.

As for improvement suggestions, I would suggest adding comments to explain the purpose of each function and/or block of code. This would make the code easier to understand and maintain. Additionally, you could also add some type checking to ensure that the variables being passed in are of the correct type.

return targetContext
return {
context: targetContext,
}
}

/**
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the code review

  1. The changes made in the code have been done efficiently, as a better alternative to the existing code.
  2. The use of 'createSharedComposable' method, makes the code more efficient.
  3. The 'initContext' method has been improved to include the 'delSubscribers' function and also to check if the root is already present in the '_dnDContextMap' before creating one. This is a good practice as it avoids unnecessary creation of root context.
  4. The code is well-structured, making it easier to understand and read.

if (!state) {
scope = effectScope(true)
state = scope.run(() => composable(...args))
}
tryOnScopeDispose(dispose)
return state
}) as T

return { useComposable, addSubscribers, delSubscribers }
}

export function useState<T>(defaultOrFactory: T | (() => T), shallow = true): [ComputedRef<T>, (value: T) => void] {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the code review:

First, the code appears to be well commented and formatted, which helps to make it easy to read. It also follows best practices, such as using descriptive variable names and disabling eslint for specific lines.

The code is creating a function that returns an object with 3 properties - useComposable, addSubscribers, and delSubscribers. The useComposable function is used to create a composable function, while the other two properties are used to add and delete subscribers from the composable. The code also uses tryOnScopeDispose to ensure that any changes to the composable are properly disposed of when there are no more subscribers.

The only potential bug risk I can see is if the subscribers count is not updated correctly, which could result in the scope being stopped prematurely. To avoid this, it would be a good idea to use a more reliable method of tracking the number of subscribers, such as an array. Additionally, it might be helpful to add some additional logging to make sure that the subscribers count is accurate.

@kovsu kovsu changed the title fix(comp:modal): destroyOnHide cause can't drag refactor(cdk:utils): add some methods to control subscribers in createSharedComposable Apr 1, 2023
@kovsu kovsu closed this Apr 17, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[comp:modal] 弹窗配置destroyOnHide: true, 会导致回调里面的第2个弹窗的拖动不生效
3 participants