[frontend]: Add reset filters button

frontend/src/components/Sidebar.jsx

@@ -171,6 +171,20 @@ const Sidebar = ({ selectedSources, setSelectedSources, clusteringEnabled, setCl
         fetchData(enabledSources, numberInputValue);  // Use enabledSources for data fetching
     };
 
+    const resetFilters = () => {
+        const savedSources = Cookies.get("selectedSources");
+        const savedNumberInputValue = Cookies.get("numberInputValue");
+
+        if (savedSources) {
+            setSelectedSources(JSON.parse(savedSources));
+        } else {
+            setSelectedSources(customDefaultChecked);
+        }
+
+        setNumberInputValue(savedNumberInputValue || "");
+    };
+
+
     return (
         <div style={{
             position: "absolute", top: "6vh", right: "1vh",
@@ -227,14 +241,51 @@ const Sidebar = ({ selectedSources, setSelectedSources, clusteringEnabled, setCl
                             />
                         </div>
                     )}
-                        <button onClick={handleSubmit} style={{marginTop: "10px", color: "white"}}>Submit</button>
+                    <div style={{
+                        display: "flex",
+                        flexDirection: "row",
+                        justifyContent: "space-between",
+                        gap: "10px",
+                        marginTop: "10px",
+                        width: "100%"
+                    }}>
+                        <button
+                            onClick={handleSubmit}
+                            style={{
+                                flex: 1,
+                                color: "white",
+                                backgroundColor: "#4CAF50",
+                                padding: "6px 12px",
+                                borderRadius: "5px",
+                                border: "none",
+                                cursor: "pointer"
+                            }}
+                        >
+                            Submit
+                        </button>
+                        <button
+                            onClick={resetFilters}
+                            style={{
+                                flex: 1,
+                                color: "white",
+                                backgroundColor: "#f44336",
+                                padding: "6px 12px",
+                                borderRadius: "5px",
+                                border: "none",
+                                cursor: "pointer"
+                            }}
+                        >
+                            Reset
+                        </button>
+                    </div>
+
                 </div>
             )}
         </div>
     );
-            };
+};
 
-            Sidebar.propTypes = {
+Sidebar.propTypes = {
     selectedSources: PropTypes.array.isRequired,
     setSelectedSources: PropTypes.func.isRequired,
     clusteringEnabled: PropTypes.bool.isRequired,
@@ -243,6 +294,6 @@ const Sidebar = ({ selectedSources, setSelectedSources, clusteringEnabled, setCl
     userLocationAvailable: PropTypes.bool.isRequired,
     showFavouritesOnly: PropTypes.bool.isRequired,
     setShowFavouritesOnly: PropTypes.func.isRequired,
-        };
+};
 
-            export default Sidebar
+export default Sidebar