diff --git a/web/src/components/Calender.jsx b/web/src/components/Calender.jsx
index fa84676ec..e6639cba1 100644
--- a/web/src/components/Calender.jsx
+++ b/web/src/components/Calender.jsx
@@ -189,11 +189,11 @@ const Calender = ({ onChange, calenderRef }) => {
${isFirstDayInRange(day) ? ' rounded-l-xl ' : ''}
${isSelectedRange(day) ? ' bg-blue-500 dark:hover:bg-blue-600' : ''}
${isLastDayInRange(day) ? ' rounded-r-xl ' : ''}
- ${isCurrentDay(day) ? 'rounded-full bg-gray-100 dark:hover:bg-gray-100 ' : ''}`}
+ ${isCurrentDay(day) && !isLastDayInRange(day) ? 'rounded-full bg-gray-100 dark:hover:bg-gray-100 ' : ''}`}
key={index}
>
-
-
{day.date}
+
+ {day.date}
);
diff --git a/web/src/components/Select.jsx b/web/src/components/Select.jsx
index 504b5aef0..b4c282d8e 100644
--- a/web/src/components/Select.jsx
+++ b/web/src/components/Select.jsx
@@ -68,7 +68,7 @@ export default function Select({
)
);
}
- }, [inputOptions, propSelected, setSelected]);
+ }, [type, options, inputOptions, propSelected, setSelected]);
const [focused, setFocused] = useState(null);
const [showDatePicker, setShowDatePicker] = useState(false);
@@ -91,7 +91,7 @@ export default function Select({
onChange && onChange(range, 'range');
setShowMenu(false);
},
- [onChange, options]
+ [onChange]
);
const handleClick = useCallback(() => {
@@ -135,7 +135,16 @@ export default function Select({
setShowMenu(false);
}, [setShowMenu]);
+ const findDOMNodes = (component) => {
+ return (component && (component.base || (component.nodeType === 1 && component))) || null;
+ };
+
useEffect(() => {
+ const addBackDrop = (e) => {
+ if (showDatePicker && !findDOMNodes(calenderRef.current).contains(e.target)) {
+ setShowDatePicker(false);
+ }
+ };
window.addEventListener('click', addBackDrop);
// setDateToInput(state.selectedDay);
return function cleanup() {
@@ -143,16 +152,6 @@ export default function Select({
};
}, [showDatePicker]);
- const findDOMNode = (component) => {
- return (component && (component.base || (component.nodeType === 1 && component))) || null;
- };
-
- const addBackDrop = (e) => {
- if (showDatePicker && !findDOMNode(calenderRef.current).contains(e.target)) {
- setShowDatePicker(false);
- }
- };
-
switch (type) {
case 'datepicker':
return (
diff --git a/web/src/routes/Events.jsx b/web/src/routes/Events.jsx
index 12a0ddea0..70816fe00 100644
--- a/web/src/routes/Events.jsx
+++ b/web/src/routes/Events.jsx
@@ -307,7 +307,7 @@ function Filter({ onChange, searchParams, paramName, options, type, ...rest }) {
[searchParams, paramName, onChange]
);
- let obj = {};
+ const obj = {};
paramName.map((p) => Object.assign(obj, { [p]: searchParams.get(p) }), [searchParams]);
return (
diff --git a/web/src/routes/Events/components/filter.jsx b/web/src/routes/Events/components/filter.jsx
index 775682b8d..923070d95 100644
--- a/web/src/routes/Events/components/filter.jsx
+++ b/web/src/routes/Events/components/filter.jsx
@@ -19,7 +19,7 @@ function Filter({ onChange, searchParams, paramName, options, type, ...rest }) {
[searchParams, paramName, onChange]
);
- let obj = {};
+ const obj = {};
paramName.map((p) => Object.assign(obj, { [p]: searchParams.get(p) }), [searchParams]);
return (
diff --git a/web/src/routes/Events/components/filterable.jsx b/web/src/routes/Events/components/filterable.jsx
index 9c7cd6882..35018fadb 100644
--- a/web/src/routes/Events/components/filterable.jsx
+++ b/web/src/routes/Events/components/filterable.jsx
@@ -15,7 +15,7 @@ function Filterable({ onFilter, pathname, searchParams, paramName, name }) {
params.set(paramName, name);
removeDefaultSearchKeys(params);
return `${pathname}?${params.toString()}`;
- }, [searchParams, paramName, pathname, name]);
+ }, [searchParams, paramName, pathname, name, removeDefaultSearchKeys]);
const handleClick = useCallback(
(event) => {