lint

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}
           >
-            <div className=" font-light ">
-              <span className="text-gray-400 ">{day.date}</span>
+            <div className="font-light">
+              <span className="text-gray-400">{day.date}</span>
             </div>
           </div>
         );

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 (

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 (

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 (

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) => {