Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-05-13 18:30:46 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

refactor(MultiselectMenu): lint & types

Browse source
This commit is contained in:
Timothy Z. 2025-06-03 12:39:08 +03:00
parent fd4c9e73c8
commit a162397d29
3 changed files with 14 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/MultiselectMenu/Dropdown/Dropdown.tsx
View file

@ -10,11 +10,11 @@ import styles from './Dropdown.less';
type Props = { type Props = {
options: MultiselectMenuOption[]; options: MultiselectMenuOption[];
value?: string | number | null; value?: string | number;
menuOpen: boolean | (() => void); menuOpen: boolean | (() => void);
level: number; level: number;
setLevel: (level: number) => void; setLevel: (level: number) => void;
onSelect: (value: string | number | null) => void; onSelect: (value: string | number) => void;
}; };
const Dropdown = ({ level, setLevel, options, onSelect, value, menuOpen }: Props) => { const Dropdown = ({ level, setLevel, options, onSelect, value, menuOpen }: Props) => {
@ -22,7 +22,7 @@ const Dropdown = ({ level, setLevel, options, onSelect, value, menuOpen }: Props
const optionsRef = useRef(new Map()); const optionsRef = useRef(new Map());
const containerRef = useRef(null); const containerRef = useRef(null);
const selectedOption = options.find(opt => opt.value === value) || null; const selectedOption = options.find((opt) => opt.value === value);
const handleSetOptionRef = useCallback((optionValue: string | number) => (node: HTMLButtonElement | null) => { const handleSetOptionRef = useCallback((optionValue: string | number) => (node: HTMLButtonElement | null) => {
if (node) { if (node) {

4
src/components/MultiselectMenu/Dropdown/Option/Option.tsx
View file

@ -8,8 +8,8 @@ import Icon from '@stremio/stremio-icons/react';
type Props = { type Props = {
option: MultiselectMenuOption; option: MultiselectMenuOption;
selectedValue?: string | number | null; selectedValue?: string | number;
onSelect: (value: string | number | null) => void; onSelect: (value: string | number) => void;
}; };
const Option = forwardRef<HTMLButtonElement, Props>(({ option, selectedValue, onSelect }, ref) => { const Option = forwardRef<HTMLButtonElement, Props>(({ option, selectedValue, onSelect }, ref) => {

18
src/components/MultiselectMenu/MultiselectMenu.tsx
View file

@ -13,8 +13,8 @@ type Props = {
className?: string, className?: string,
title?: string | (() => string); title?: string | (() => string);
options: MultiselectMenuOption[]; options: MultiselectMenuOption[];
value?: string | number | null; value?: string | number;
onSelect: (value: string | number | null) => void; onSelect: (value: string | number) => void;
}; };
const MultiselectMenu = ({ className, title, options, value, onSelect }: Props) => { const MultiselectMenu = ({ className, title, options, value, onSelect }: Props) => {
@ -22,9 +22,9 @@ const MultiselectMenu = ({ className, title, options, value, onSelect }: Props)
const multiselectMenuRef = useOutsideClick(() => closeMenu()); const multiselectMenuRef = useOutsideClick(() => closeMenu());
const [level, setLevel] = React.useState<number>(0); const [level, setLevel] = React.useState<number>(0);
const selectedOption = options.find(opt => opt.value === value); const selectedOption = options.find((opt) => opt.value === value);
const onOptionSelect = (selectedValue: string | number | null) => { const onOptionSelect = (selectedValue: string | number) => {
level ? setLevel(level + 1) : onSelect(selectedValue), closeMenu(); level ? setLevel(level + 1) : onSelect(selectedValue), closeMenu();
}; };
@ -38,11 +38,11 @@ const MultiselectMenu = ({ className, title, options, value, onSelect }: Props)
aria-expanded={menuOpen} aria-expanded={menuOpen}
> >
<div className={styles['label']}> <div className={styles['label']}>
{ {
typeof title === 'function' typeof title === 'function'
? title() ? title()
: title ?? selectedOption?.label : title ?? selectedOption?.label
} }
</div> </div>
<Icon name={'caret-down'} className={classNames(styles['icon'], { [styles['open']]: menuOpen })} /> <Icon name={'caret-down'} className={classNames(styles['icon'], { [styles['open']]: menuOpen })} />
</Button> </Button>