hamed
12d2e2e3f1
fix(progress): enhance accessibility by adding aria-label to LinearProgress component fix(share): add aria-label for better accessibility in Share button fix(title): change h3 to h2 for semantic correctness and add aria-labels for links fix(qrimg): add alt text for QR code image for improved accessibility fix(buttonmenu): add aria-label for mobile menu button to enhance accessibility
34 lines
911 B
JavaScript
34 lines
911 B
JavaScript
import { useState, useEffect } from "react";
|
|
import QRCode from "qrcode";
|
|
import { getStateInfoClient } from "@/lib/getStateInfoClient";
|
|
|
|
export default function QrImg() {
|
|
const [host, setHost] = useState("");
|
|
const [qrCodeData, setQrCodeData] = useState("");
|
|
|
|
useEffect(() => {
|
|
const info = getStateInfoClient();
|
|
const linkHost = info.host;
|
|
const linkURL = info.fullUrl;
|
|
|
|
setHost(linkHost);
|
|
|
|
if (linkURL) {
|
|
QRCode.toDataURL(linkURL).then(setQrCodeData);
|
|
}
|
|
}, []);
|
|
|
|
return (
|
|
<div className="flex items-center flex-col justify-center mt-[100%]">
|
|
{qrCodeData ? (
|
|
<img src={qrCodeData} width={167} height={167} alt="کد QR پروفایل پزشک" />
|
|
) : (
|
|
<p>در حال بارگذاری...</p>
|
|
)}
|
|
<p className="text-[#3987D4] min-h-[24px] font-semibold text-[16px] mt-[32px]">
|
|
{host || ""}
|
|
</p>
|
|
</div>
|
|
);
|
|
}
|