Adding the form and the api call

frontend/src/api/qrcode.ts

@@ -0,0 +1,27 @@
+import axios from 'axios';
+import type { GenerateResult } from '@types/qrcode';
+
+export async function generateQr(payload: { text: string; size: number }): Promise<GenerateResult> {
+  const url = 'http://localhost:5000/api/qrcode/generate';
+  const resp = await axios.post(url, payload, {
+    responseType: 'arraybuffer',
+    validateStatus: (s) => s >= 200 && s < 300,
+  });
+
+  const contentType = (resp.headers['content-type'] || '').toString();
+
+  // Try JSON parse in case backend returns { imageUrl }
+  try {
+    const decoded = new TextDecoder().decode(resp.data);
+    const parsed = JSON.parse(decoded);
+    if (parsed?.imageUrl) return { imageUrl: parsed.imageUrl };
+  } catch (error) {
+    console.error(error);
+  }
+
+  if (contentType.startsWith('image/')) {
+    return { mime: contentType, data: resp.data as ArrayBuffer };
+  }
+
+  return { mime: contentType || 'image/png', data: resp.data as ArrayBuffer };
+}