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: useEventNotStable type #2741

Merged
merged 1 commit into from
Oct 21, 2024

Conversation

yomybaby
Copy link
Member

@yomybaby yomybaby commented Oct 10, 2024

This pull request includes several changes to improve type safety and optimize the performance of React components by using useCallback and ensuring proper type handling in hooks. The most important changes include modifications to DynamicInputNumber, DynamicUnitInputNumberWithSlider, and VFolderTable components, as well as updates to the useEventNotStable hook.

Type Safety Improvements:

Performance Optimizations:

Code Cleanup:

Copy link

graphite-app bot commented Oct 10, 2024

Your org requires the Graphite merge queue for merging into main

Add the label “flow:merge-queue” to the PR and Graphite will automatically add it to the merge queue when it’s ready to merge. Or use the label “flow:hotfix” to add to the merge queue as a hot fix.

You must have a Graphite account and log in to Graphite in order to use the merge queue. Sign up using this link.

@github-actions github-actions bot added the size:S 10~30 LoC label Oct 10, 2024
Copy link
Member Author

yomybaby commented Oct 10, 2024

This stack of pull requests is managed by Graphite. Learn more about stacking.

Join @yomybaby and the rest of your teammates on Graphite Graphite

@yomybaby yomybaby mentioned this pull request Oct 10, 2024
6 tasks
Copy link

github-actions bot commented Oct 10, 2024

Coverage report for ./react

St.
Category Percentage Covered / Total
🔴 Statements 5.15% 348/6760
🔴 Branches
4.69% (-0% 🔻)
218/4649
🔴 Functions 3.01% 67/2226
🔴 Lines 5.04% 333/6605

Test suite run success

93 tests passing in 12 suites.

Report generated by 🧪jest coverage report action from 253d05e

@yomybaby yomybaby marked this pull request as ready for review October 10, 2024 04:00
@yomybaby yomybaby requested a review from lizable October 11, 2024 09:16
Comment on lines +253 to 264
const inputToAliasPath = useCallback(
(name: VFolderKey, input?: string) => {
if (_.isEmpty(input)) {
if (input === undefined || input === '') {
return `${aliasBasePath}${name}`;
} else if (input?.startsWith('/')) {
} else if (input.startsWith('/')) {
return input;
} else {
return `${aliasBasePath}${input}`;
}
},
[aliasBasePath],
);
Copy link
Contributor

Choose a reason for hiding this comment

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

I understood that the reason you used the useCallback hook is to prevent the component from declaring a function with new memory allocation when the component is re-rendered, but is it always a good idea to declare the function using useCallback even if the computation of the function is not heavy?

Copy link
Member Author

Choose a reason for hiding this comment

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

Yes, it's not necessary in that case. But let's keep this code to distinguish that aliasBasePath is a dependency.

Copy link
Contributor

@ironAiken2 ironAiken2 left a comment

Choose a reason for hiding this comment

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

LGTM

Copy link

graphite-app bot commented Oct 21, 2024

Merge activity

This pull request includes several changes to improve type safety and optimize the performance of React components by using `useCallback` and ensuring proper type handling in hooks. The most important changes include modifications to `DynamicInputNumber`, `DynamicUnitInputNumberWithSlider`, and `VFolderTable` components, as well as updates to the `useEventNotStable` hook.

### Type Safety Improvements:
* [`react/src/components/DynamicStepInputNumber.tsx`](diffhunk://#diff-b3d890e46cddb08acfce125b27ff3da0ca9db076ab3ebcd35fadace06e7c8d92L32-R32): Updated the `updateKey` call to use `value.toString()` to ensure the value is a string.
* [`react/src/components/DynamicUnitInputNumberWithSlider.tsx`](diffhunk://#diff-26552acf4047ca1f6af64dbcf17ecdce04c84a7f669f055db97e13afe873a6e7L54-R54): Updated the `updateKey` call to use `value?.toString()` to handle potential undefined values safely.

### Performance Optimizations:
* [`react/src/components/VFolderTable.tsx`](diffhunk://#diff-14f34a27406ff418af22058ec3978654932614d41995f8f9a6f52f92e32f47c8L247-R263): Replaced `useEventNotStable` with `useCallback` for `inputToAliasPath` to improve performance and stability.
* [`react/src/hooks/useEventNotStable.tsx`](diffhunk://#diff-44cbecbfeea00712d81f6d06b52dbb0e5c7bad616c790244d4b238851e70e83dL3-R7): Enhanced the `useEventNotStable` hook to use generics for better type safety and updated the return type to `undefined` instead of `null`. [[1]](diffhunk://#diff-44cbecbfeea00712d81f6d06b52dbb0e5c7bad616c790244d4b238851e70e83dL3-R7) [[2]](diffhunk://#diff-44cbecbfeea00712d81f6d06b52dbb0e5c7bad616c790244d4b238851e70e83dL14-R19)

### Code Cleanup:
* [`react/src/components/VFolderTable.tsx`](diffhunk://#diff-14f34a27406ff418af22058ec3978654932614d41995f8f9a6f52f92e32f47c8L34-R40): Added missing imports for `useCallback` to ensure the code compiles correctly.
@yomybaby yomybaby force-pushed the refactor/use-event-type-definition branch from 1d7ea84 to 253d05e Compare October 21, 2024 06:39
@graphite-app graphite-app bot merged commit 253d05e into main Oct 21, 2024
8 checks passed
@graphite-app graphite-app bot deleted the refactor/use-event-type-definition branch October 21, 2024 06:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
size:S 10~30 LoC
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants