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.

Sign up for GitHub

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

Jump to bottom

[MenuItem][Base] Pass idGenerator function #37364

Merged
merged 5 commits into from
May 29, 2023
Merged

[MenuItem][Base] Pass idGenerator function #37364

merged 5 commits into from
May 29, 2023

Conversation

sai6855
Copy link
Contributor

@sai6855 sai6855 commented May 22, 2023 •
edited
Loading

@sai6855

This comment was marked as outdated.

Sign in to view
@sai6855 sai6855 added component: menu This is the name of the generic UI component, not the React module! package: base-ui Specific to @mui/base regression A bug, but worse labels May 22, 2023
@mui-bot
Copy link

mui-bot commented May 22, 2023 •
edited
Loading

Netlify deploy preview

https://deploy-preview-37364--material-ui.netlify.app/

Bundle size report

Details of bundle changes

Generated by 🚫 dangerJS against 9f92907

@sai6855 sai6855 mentioned this pull request May 22, 2023
Closed
@sai6855 sai6855 marked this pull request as draft May 22, 2023 14:24
@sai6855 sai6855 changed the title [MenuItem][Base] Pass missingKeyGenerator to useCompoundItem [MenuItem][Base][Joy] Add missingKeyGenerator prop to MenuItem May 22, 2023
@sai6855 sai6855 mentioned this pull request May 22, 2023
Closed
1 task
@sai6855 sai6855 changed the title [MenuItem][Base][Joy] Add missingKeyGenerator prop to MenuItem [MenuItem][Base] Pass idGenerator function May 23, 2023
@sai6855 sai6855 mentioned this pull request May 23, 2023
Closed
1 task
sai6855
sai6855 commented May 23, 2023
View reviewed changes
packages/mui-base/src/utils/useCompound.ts Outdated
);
}
if (typeof id === 'function') {
providedOrGeneratedId = (id as MissingKeyGenerator<Key>)(subitemKeys.current);
Copy link
Contributor Author

@sai6855 sai6855 May 23, 2023 •
edited
Loading

Choose a reason for hiding this comment

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

facing below typescript error, if type of id is not casted to MissingKeyGenerator<Key>. Wasn't sure how to fix it. so went with casting approach.

Screenshot 2023-05-23 at 2 33 12 PM

Copy link
Member

Choose a reason for hiding this comment

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

Technically TS is correct because Key can be a function type. But I think we can leave it as is. I don't expect anyone to create a key that's a function.

sai6855
sai6855 commented May 23, 2023
View reviewed changes
packages/mui-base/src/utils/useCompoundItem.ts
@@ -55,13 +57,13 @@ export function useCompoundItem<Key, Subitem>(
}

const { registerItem } = context;
const [registeredId, setRegisteredId] = React.useState(id);
const [registeredId, setRegisteredId] = React.useState(typeof id === 'function' ? undefined : id);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

since parameter to pass to the id function is not available at this point, i initiated value of registeredId to undefined if id is function.

sai6855
sai6855 commented May 23, 2023
View reviewed changes
packages/mui-base/src/useMenuItem/useMenuItem.ts
@@ -11,6 +11,10 @@ import {
import { useListItem } from '../useList';
import { useCompoundItem } from '../utils/useCompoundItem';

function idGenerator(existingKeys: Set<string>) {
Copy link
Contributor Author

@sai6855 sai6855 May 23, 2023 •
edited
Loading

Choose a reason for hiding this comment

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

Not really sure how to test that if this function is being called or not as this function runs only on react versions less than 18.

@sai6855 sai6855 marked this pull request as ready for review May 23, 2023 09:10
@sai6855 sai6855 requested a review from michaldudak May 23, 2023 09:16
michaldudak
michaldudak reviewed May 23, 2023
View reviewed changes
packages/mui-base/src/utils/useCompound.ts Outdated
@@ -12,22 +12,22 @@ interface RegisterItemReturnValue<Key> {
deregister: () => void;
}

export type MissingKeyGenerator<Key> = (existingKeys: Set<Key>) => Key;
Copy link
Member

Choose a reason for hiding this comment

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

Let's just call it KeyGenerator or KeyProvider

packages/mui-base/src/utils/useCompound.ts Outdated
*/
registerItem: (
id: Key | undefined,
id: Key | MissingKeyGenerator<Key> | undefined,
Copy link
Member

Choose a reason for hiding this comment

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

I think undefined is no longer a valid option

packages/mui-base/src/utils/useCompound.ts Outdated
);
}
if (typeof id === 'function') {
providedOrGeneratedId = (id as MissingKeyGenerator<Key>)(subitemKeys.current);
Copy link
Member

Choose a reason for hiding this comment

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

Technically TS is correct because Key can be a function type. But I think we can leave it as is. I don't expect anyone to create a key that's a function.

packages/mui-base/src/utils/useCompoundItem.ts Outdated
@@ -32,18 +36,16 @@ export interface UseCompoundItemReturnValue<Key> {
* @ignore - internal hook.
*/
export function useCompoundItem<Key, Subitem>(
id: Key | undefined,
id: Key | MissingKeyGenerator<Key> | undefined,
Copy link
Member

Choose a reason for hiding this comment

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

As above, I think undefined can be dropped from here.

sai6855
sai6855 commented May 23, 2023
View reviewed changes
packages/mui-base/src/utils/useCompound.ts
let providedOrGeneratedId: Key;
if (id === undefined) {
if (missingKeyGenerator === undefined) {
throw new Error(
Copy link
Contributor Author

Choose a reason for hiding this comment

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

since id cannot be undefined, i don't think throwing error makes much sense

@sai6855
Copy link
Contributor Author

sai6855 commented May 23, 2023

@michaldudak done with all changes

michaldudak
michaldudak approved these changes May 24, 2023
View reviewed changes
Copy link
Member

@michaldudak michaldudak left a comment

Choose a reason for hiding this comment

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

👍 Looks good!

@sai6855 sai6855 requested a review from michaldudak May 24, 2023 13:33
@hbjORbj hbjORbj merged commit f3f93a3 into mui:master May 29, 2023
@oliviertassinari oliviertassinari mentioned this pull request Jan 28, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@michaldudak michaldudak michaldudak approved these changes

Assignees
No one assigned
Labels
component: menu This is the name of the generic UI component, not the React module! package: base-ui Specific to @mui/base regression A bug, but worse
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[MenuItem][Joy] MenuItem breaks in React 17 since release v5.12.1
4 participants
@sai6855 @mui-bot @michaldudak @hbjORbj