Merge pull request #1221 from Shelf-nu/1214-feat-implement-url-shortner

fix: fix issue with in-app scanner and shortened urls

app/components/zxing-scanner.tsx

@@ -9,6 +9,7 @@ import { useClientNotification } from "~/hooks/use-client-notification";
 import type { loader } from "~/routes/_layout+/scanner";
 import { ShelfError } from "~/utils/error";
 import { isFormProcessing } from "~/utils/form";
+import { isQrId } from "~/utils/id";
 import { Spinner } from "./shared/spinner";
 
 export const ZXingScanner = ({
@@ -27,11 +28,18 @@ export const ZXingScanner = ({
   // Function to decode the QR code
   const decodeQRCodes = (result: string) => {
     if (result != null && !isRedirecting) {
-      const regex = /^(https?:\/\/)([^/:]+)(:\d+)?\/qr\/([a-zA-Z0-9]+)$/;
-      /** We make sure the value of the QR code matches the structure of Shelf qr codes */
+      /**
+       * - ^(https?:\/\/[^\/]+\/ matches the protocol, domain, and the initial slash.
+       * - (?:qr\/)? optionally matches the /qr/ part.
+       * - ([a-zA-Z0-9]+))$ matches the QR ID which is the last segment of the URL.
+       */
+      // Regex to match both old and new QR code structures
+      const regex = /^(https?:\/\/[^/]+\/(?:qr\/)?([a-zA-Z0-9]+))$/;
+
+      /** We make sure the value of the QR code matches the structure of Shelf QR codes */
       const match = result.match(regex);
       if (!match) {
-        /** If the QR code does not match the structure of Shelf qr codes, we show an error message */
+        /** If the QR code does not match the structure of Shelf QR codes, we show an error message */
         sendNotification({
           title: "QR Code Not Valid",
           message: "Please Scan valid asset QR",
@@ -40,12 +48,22 @@ export const ZXingScanner = ({
         return;
       }
 
+      const qrId = match[2]; // Get the QR id from the URL
+      if (!isQrId(qrId)) {
+        sendNotification({
+          title: "QR ID Not Valid",
+          message: "Please Scan valid asset QR",
+          icon: { name: "trash", variant: "error" },
+        });
+        return;
+      }
+
       sendNotification({
         title: "Shelf's QR Code detected",
         message: "Redirecting to mapped asset",
         icon: { name: "success", variant: "success" },
       });
-      const qrId = match[4]; // Get the last segment of the URL as the QR id
+
       navigate(`/qr/${qrId}`);
     }
   };

app/utils/env.ts

@@ -14,6 +14,7 @@ declare global {
       ENABLE_PREMIUM_FEATURES: string;
       MAINTENANCE_MODE: string;
       CHROME_EXECUTABLE_PATH: string;
+      URL_SHORTENER: string;
     };
   }
 }
@@ -223,5 +224,6 @@ export function getBrowserEnv() {
     ENABLE_PREMIUM_FEATURES,
     MAINTENANCE_MODE,
     CHROME_EXECUTABLE_PATH,
+    URL_SHORTENER,
   };
 }