Add RTSP URL parsing utility and enhance camera settings handling

- Implement parseRTSPUrl function to extract username, password, IP, port, and path from RTSP URLs.
- Update CameraSettingFields to utilize parsed RTSP URL data for camera configuration.
- Modify WiFiSettingsForm to allow password visibility toggle.
- Improve SightingOverview loading and error handling UI.
- Adjust NavigationArrow component to reflect updated camera side logic.

src/components/SettingForms/WiFi&Modem/WiFiSettingsForm.tsx

@@ -3,8 +3,12 @@ import FormGroup from "../components/FormGroup";
 import type { WifiSettingValues } from "../../../types/types";
 import { useWifiAndModem } from "../../../hooks/useCameraWifiandModem";
 import { toast } from "sonner";
+import { useState } from "react";
+import { faEyeSlash, faEye } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
 const WiFiSettingsForm = () => {
+  const [showPwd, setShowPwd] = useState(false);
   const { wifiQuery, wifiMutation } = useWifiAndModem();
 
   const wifiSSID = wifiQuery?.data?.propSSID?.value;
@@ -32,7 +36,7 @@ const WiFiSettingsForm = () => {
     };
 
     wifiMutation.mutate(wifiConfig);
-    //todo: check what response is
+
     if (wifiMutation.error) {
       toast.error("Failed to update WiFi settings");
       return;
@@ -72,10 +76,16 @@ const WiFiSettingsForm = () => {
             <Field
               id="password"
               name="password"
-              type="password"
+              type={showPwd ? "text" : "password"}
               className="p-1.5 border border-gray-400 rounded-lg"
               placeholder="Enter Password"
             />
+            <FontAwesomeIcon
+              type="button"
+              className="absolute right-5 end-0"
+              onClick={() => setShowPwd((s) => !s)}
+              icon={showPwd ? faEyeSlash : faEye}
+            />
           </FormGroup>
           <FormGroup>
             <label