-
Notifications
You must be signed in to change notification settings - Fork 141
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
chore: ComboBoxのuseOptionsのロジックを整理する #5332
base: master
Are you sure you want to change the base?
Conversation
802117a
to
0df395e
Compare
commit: |
const isSelected = useCallback( | ||
(item: ComboBoxItem<T>) => selected !== null && selected.label === item.label, | ||
[selected], | ||
) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
isSelectedはoptionの数分実行されることになるため、配列チェックなどが多数実行されることになり、SingleComboBoxとMultiComboBoxで共通化するメリットが少なかったため、hookを分割しました
const getOptionId = useCallback( | ||
(optionIndex: number) => `${optionIdPrefix}-${optionIndex}`, | ||
[optionIdPrefix], | ||
) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
メソッド化する意味が薄かったため削除しています
const addingOption: ComboBoxOption<T> | null = useMemo( | ||
() => | ||
creatable && inputValue && items.every((item) => item.label !== inputValue) | ||
? { | ||
id: newItemId, | ||
isNew: true, | ||
selected: false, | ||
item: { label: inputValue, value: inputValue }, | ||
} | ||
: null, | ||
[inputValue, items, creatable, newItemId], |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
creatableがtrueになる可能性はかなり低く、nullになる可能性が高くなります。
別途メモ化することで他のmemoが更新される可能性が下がります
return allOptions | ||
} | ||
return allOptions.filter(({ item: { label } }) => { | ||
if (!inputValue) return true |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
filter内で処理する意味がないため、isFilteringDisabledと同時にチェックするようにしています
関連URL
概要
変更内容
確認方法