feat: ⚡ new portal web for qr scan

packages/portal/src/components/qr/qr.css

@@ -0,0 +1,12 @@
+div img {
+    display: block;
+    background-color: #f0f0f0;
+    width: 350px;
+    height: 350px;
+    object-fit: contain;
+    border-radius: 10px;
+}
+div {
+    display: flex;
+    justify-content: center;
+}

packages/portal/src/components/qr/qr.tsx

@@ -0,0 +1,35 @@
+import {
+    component$,
+    useClientEffect$,
+    useStore,
+    useStylesScoped$,
+} from '@builder.io/qwik'
+import { useLocation } from '@builder.io/qwik-city'
+import style from './qr.css?inline'
+
+export const QR = component$(() => {
+    useStylesScoped$(style)
+    const state = useStore({
+        count: 0,
+    })
+
+    useClientEffect$(() => {
+        setInterval(() => {
+            state.count++
+        }, 800)
+    })
+
+    const location = useLocation()
+    const qrImage = location.query?.qr ?? 'qr.png'
+
+    return (
+        <div>
+            <img
+                width={350}
+                height={350}
+                src={qrImage + '?time=' + state.count}
+                alt="QR"
+            />
+        </div>
+    )
+})