fix: use QR images

1 files changed, 5 insertions, 1 deletions

diff --git a/packages/merchant-backoffice-ui/src/components/exception/QR.tsx b/packages/merchant-backoffice-ui/src/components/exception/QR.tsx
index 246ce0229..029a87879 100644
--- a/packages/merchant-backoffice-ui/src/components/exception/QR.tsx
+++ b/packages/merchant-backoffice-ui/src/components/exception/QR.tsx
@@ -25,9 +25,13 @@ export function QR({ text }: { text: string }): VNode {
     qr.addData(text);
     qr.make();
     if (divRef.current) {
-      divRef.current.innerHTML = qr.createSvgTag({
+      const image = qr.createSvgTag({
         scalable: true,
       });
+      const imageURL = `data:image/svg+xml,${encodeURIComponent(image)}`;
+      divRef.current.innerHTML = `<img src=${JSON.stringify(
+        imageURL,
+      )} alt=${JSON.stringify(`QR Code containing the data ${text}`)} />`;
     }
   });