diff --git a/src/components/Form/Settings/Dropdown/Dropdown.jsx b/src/components/Form/Settings/Dropdown/Dropdown.jsx
index 243b8e46..d4585d45 100644
--- a/src/components/Form/Settings/Dropdown/Dropdown.jsx
+++ b/src/components/Form/Settings/Dropdown/Dropdown.jsx
@@ -1,6 +1,7 @@
import variables from 'config/variables';
import { memo, useState, useCallback, useRef, useEffect } from 'react';
-import { MdExpandMore, MdCheck } from 'react-icons/md';
+import { MdExpandMore, MdCheck, MdRefresh } from 'react-icons/md';
+import { toast } from 'react-toastify';
import EventBus from 'utils/eventbus';
@@ -103,13 +104,27 @@ const Dropdown = memo((props) => {
[onChange],
);
+ const resetItem = useCallback(() => {
+ const defaultValue = props.default || props.items[0]?.value;
+ onChange(defaultValue);
+ toast(variables.getMessage('toasts.reset'));
+ }, [onChange, props.default, props.items]);
+
const id = 'dropdown' + props.name;
const label = props.label || '';
const selectedItem = props.items.find((item) => item?.value === value);
return (
- {label &&
}
+ {label && (
+
+
+
+
+ {variables.getMessage('modals.main.settings.buttons.reset')}
+
+
+ )}
!props.disabled && setIsOpen(!isOpen)}
diff --git a/src/components/Form/Settings/Dropdown/Dropdown.scss b/src/components/Form/Settings/Dropdown/Dropdown.scss
index e0874aa7..e60f85f6 100644
--- a/src/components/Form/Settings/Dropdown/Dropdown.scss
+++ b/src/components/Form/Settings/Dropdown/Dropdown.scss
@@ -24,9 +24,14 @@
pointer-events: none;
}
- .dropdown-label {
- display: block;
+ .dropdown-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
margin-bottom: 8px;
+ }
+
+ .dropdown-label {
font-size: 12px;
font-weight: 500;
text-transform: uppercase;
@@ -37,6 +42,29 @@
}
}
+ .dropdown-reset {
+ display: flex;
+ align-items: center;
+ gap: 5px;
+ cursor: pointer;
+ font-size: 12px;
+ font-weight: 500;
+ text-transform: uppercase;
+ letter-spacing: 0.5px;
+
+ @include themed {
+ color: t($link);
+ }
+
+ &:hover {
+ opacity: 0.8;
+ }
+
+ svg {
+ font-size: 12px;
+ }
+ }
+
.dropdown-control {
display: flex;
align-items: center;