diff --git a/src/common/MultiselectMenu/Dropdown/Dropdown.tsx b/src/common/MultiselectMenu/Dropdown/Dropdown.tsx
index 74b88b3c0..9f82106d1 100644
--- a/src/common/MultiselectMenu/Dropdown/Dropdown.tsx
+++ b/src/common/MultiselectMenu/Dropdown/Dropdown.tsx
@@ -14,7 +14,7 @@ type Props = {
menuOpen: boolean | (() => void);
level: number;
setLevel: (level: number) => void;
- onSelect: (event: any) => void;
+ onSelect: (value: number) => void;
};
const Dropdown = ({ level, setLevel, options, onSelect, selectedOption, menuOpen }: Props) => {
@@ -25,11 +25,11 @@ const Dropdown = ({ level, setLevel, options, onSelect, selectedOption, menuOpen
};
return (
-
+
{
level > 0 ?
: null
diff --git a/src/common/MultiselectMenu/Dropdown/Option/Option.less b/src/common/MultiselectMenu/Dropdown/Option/Option.less
index 067934dfc..a0ee1743f 100644
--- a/src/common/MultiselectMenu/Dropdown/Option/Option.less
+++ b/src/common/MultiselectMenu/Dropdown/Option/Option.less
@@ -15,7 +15,6 @@
.icon {
flex: none;
- // display: none;
width: 0.5rem;
height: 0.5rem;
border-radius: 100%;
diff --git a/src/common/MultiselectMenu/Dropdown/Option/Option.tsx b/src/common/MultiselectMenu/Dropdown/Option/Option.tsx
index 28a431b1f..4309e766e 100644
--- a/src/common/MultiselectMenu/Dropdown/Option/Option.tsx
+++ b/src/common/MultiselectMenu/Dropdown/Option/Option.tsx
@@ -9,7 +9,7 @@ import Icon from '@stremio/stremio-icons/react';
type Props = {
option: MultiselectMenuOption;
selectedOption?: MultiselectMenuOption | null;
- onSelect: (value: string) => void;
+ onSelect: (value: number) => void;
};
const Option = ({ option, selectedOption, onSelect }: Props) => {
@@ -32,7 +32,7 @@ const Option = ({ option, selectedOption, onSelect }: Props) => {
}
{
option.level ?
-
+
: null
}
diff --git a/src/common/MultiselectMenu/MultiselectMenu.less b/src/common/MultiselectMenu/MultiselectMenu.less
index 58eec12dd..3c7b81b59 100644
--- a/src/common/MultiselectMenu/MultiselectMenu.less
+++ b/src/common/MultiselectMenu/MultiselectMenu.less
@@ -3,11 +3,11 @@
@border-radius: 2.75rem;
.multiselect-menu {
- background-color: var(--overlay-color);
position: relative;
- min-width: 150px;
+ min-width: 8.5rem;
overflow: visible;
border-radius: @border-radius;
+
&.disabled {
pointer-events: none;
opacity: 0.3;
@@ -15,7 +15,6 @@
.multiselect-button {
color: var(--primary-foreground-color);
- background-color: rgba(255, 255, 255, 0.05);
padding: 0.75rem 1.5rem;
display: flex;
justify-content: space-between;
@@ -24,12 +23,17 @@
border-radius: @border-radius;
.icon {
- width: 1.5rem;
+ width: 1rem;
color: var(--primary-foreground-color);
+ opacity: 0.6;
&.open {
transform: rotate(180deg);
}
}
}
+
+ &:hover {
+ background-color: var(--overlay-color);
+ }
}
\ No newline at end of file
diff --git a/src/common/MultiselectMenu/MultiselectMenu.tsx b/src/common/MultiselectMenu/MultiselectMenu.tsx
index 030b097da..2bd298752 100644
--- a/src/common/MultiselectMenu/MultiselectMenu.tsx
+++ b/src/common/MultiselectMenu/MultiselectMenu.tsx
@@ -14,7 +14,7 @@ type Props = {
title?: string;
options: MultiselectMenuOption[];
selectedOption?: MultiselectMenuOption;
- onSelect: (event: any) => void;
+ onSelect: (value: number) => void;
};
const MultiselectMenu = ({ className, title, options, selectedOption, onSelect }: Props) => {
@@ -22,9 +22,8 @@ const MultiselectMenu = ({ className, title, options, selectedOption, onSelect }
const multiselectMenuRef = useOutsideClick(() => closeMenu());
const [level, setLevel] = React.useState(0);
- const onOptionSelect = (event: any) => {
- console.log(event.value);
- level ? setLevel(level + 1) : onSelect(event), closeMenu();
+ const onOptionSelect = (value: number) => {
+ level ? setLevel(level + 1) : onSelect(value), closeMenu();
};
return (
@@ -37,7 +36,7 @@ const MultiselectMenu = ({ className, title, options, selectedOption, onSelect }
aria-expanded={menuOpen}
>
{title}
-
+
{
menuOpen ?
diff --git a/src/common/MultiselectMenu/types.d.ts b/src/common/MultiselectMenu/types.d.ts
index a1724ab9b..7ed039ddd 100644
--- a/src/common/MultiselectMenu/types.d.ts
+++ b/src/common/MultiselectMenu/types.d.ts
@@ -1,7 +1,7 @@
type MultiselectMenuOption = {
id?: number;
label: string;
- value: string;
+ value: number;
destination?: string;
default?: boolean;
hidden?: boolean;
diff --git a/src/routes/MetaDetails/VideosList/SeasonsBar/SeasonsBar.js b/src/routes/MetaDetails/VideosList/SeasonsBar/SeasonsBar.js
index 6ecc2c815..71c10ce92 100644
--- a/src/routes/MetaDetails/VideosList/SeasonsBar/SeasonsBar.js
+++ b/src/routes/MetaDetails/VideosList/SeasonsBar/SeasonsBar.js
@@ -36,8 +36,7 @@ const SeasonsBar = ({ className, seasons, season, onSelect }) => {
});
}
}, [season, seasons, onSelect]);
- const seasonOnSelect = React.useCallback((event) => {
- const value = parseFloat(event.value);
+ const seasonOnSelect = React.useCallback((value) => {
if (typeof onSelect === 'function') {
onSelect({
type: 'select',