github/TREK
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(mfa): generate SVG QR code

Browse Source 
Replace the rasterized 180px PNG QR code with a crisp 250px SVG
This commit is contained in:
jubnl
2026-04-05 17:14:36 +02:00
parent 9ee5d21c3a
commit c6148ba4f2
4 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
client/src/components/Settings/AccountTab.tsx
View File

@@ -253,8 +253,8 @@ export default function AccountTab(): React.ReactElement {
onClick={async () => {
setMfaLoading(true)
try {
const data = await authApi.mfaSetup() as { qr_data_url: string; secret: string }
setMfaQr(data.qr_data_url)
const data = await authApi.mfaSetup() as { qr_svg: string; secret: string }
setMfaQr(data.qr_svg)
setMfaSecret(data.secret)
setMfaSetupCode('')
} catch (err: unknown) {
@@ -274,7 +274,7 @@ export default function AccountTab(): React.ReactElement {
{!user?.mfa_enabled && mfaQr && (
<div className="space-y-3">
<p className="text-sm" style={{ color: 'var(--text-muted)' }}>{t('settings.mfa.scanQr')}</p>
<img src={mfaQr} alt="" className="rounded-lg border mx-auto block" style={{ maxWidth: 200, borderColor: 'var(--border-primary)' }} />
<div className="rounded-lg border mx-auto block overflow-hidden" style={{ width: 'fit-content', borderColor: 'var(--border-primary)' }} dangerouslySetInnerHTML={{ __html: mfaQr! }} />
<div>
<label className="block text-xs font-medium mb-1" style={{ color: 'var(--text-secondary)' }}>{t('settings.mfa.secretLabel')}</label>
<code className="block text-xs p-2 rounded break-all" style={{ background: 'var(--bg-hover)', color: 'var(--text-primary)' }}>{mfaSecret}</code>