fix(): Handle invalid URL format error with proper response message

frontend/package-lock.json

@@ -1,11 +1,11 @@
 {
-  "name": "frontend",
+  "name": "shortenit",
   "version": "0.1.0",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
-      "name": "frontend",
+      "name": "shortenit",
       "version": "0.1.0",
       "dependencies": {
         "@testing-library/jest-dom": "^5.17.0",

frontend/src/components/URLShortener/URLShortener.tsx

@@ -35,23 +35,66 @@ export default function URLShortener() {
       const api_url = `${config.url}${api_endpoint}`;
 
       // Send the POST request to the backend
-      await axios
+      const response = await axios.post(api_url , {url: url})
-        .post(api_url , {
+      if (response.data.url) {
-          url: url
-        })
-        .then((response) => {
-          if (response) {
         const shortUrl: string = response.data.url;
         setShortenedUrl(shortUrl);
         setShowInput(true);
-          }
+        toast.success("URL Shortened Successfully", {
+          position: "top-right",
+          autoClose: 5000,
+          hideProgressBar: false,
+          closeOnClick: true,
+          pauseOnHover: true,
+          draggable: true,
+          progress: undefined,
+          theme: "dark",
+          className: "custom-toast",
         });
+      } else {
+        toast.error("Something went wrong while shortening the URL", {
+          position: "top-right",
+          autoClose: 5000,
+          hideProgressBar: false,
+          closeOnClick: true,
+          pauseOnHover: true,
+          draggable: true,
+          progress: undefined,
+          theme: "dark",
+          className: "custom-toast",
+        });
+      }
 
       setTimeout(() => {
         setShowInput(false);
       }, 900000);
-    } catch (error) {
+    } catch (error : any) {
-      console.log(error);
+      if (error.response) {
+        const errorMessage : string = error.response.data.msg || "An error occurred. Please try again.";
+        toast.error(errorMessage, {
+          position: "top-right",
+          autoClose: 5000,
+          hideProgressBar: false,
+          closeOnClick: true,
+          pauseOnHover: true,
+          draggable: true,
+          progress: undefined,
+          theme: "dark",
+          className: "custom-toast",
+        });
+      } else {
+        toast.error("Network error. Please check your connection and try again.", {
+          position: "top-right",
+          autoClose: 5000,
+          hideProgressBar: false,
+          closeOnClick: true,
+          pauseOnHover: true,
+          draggable: true,
+          progress: undefined,
+          theme: "dark",
+          className: "custom-toast",
+        });
+      }
     }
   }
 
@@ -76,6 +119,7 @@ export default function URLShortener() {
     }
   }
   return (
+    <>
       <div className="URLShortener-component">
         <div className="left-side">
           <h1>Paste the URL</h1>
@@ -108,7 +152,9 @@ export default function URLShortener() {
             </p>
           </div>
         </div>
-      <ToastContainer />
+        
       </div>
+      <ToastContainer />
+    </>
   );
 }

shortenit/web.py

@@ -80,7 +80,7 @@ class SiteHandler:
             data = self.shortenit_load_format(data)
         except Exception as e:
             self.logger.error(e)
-            return {}, 400
+            return {"msg" : "Invalid URL format"}, 400
             self.logger.error(e)
             abort(400)
         try: