New my website usger

[mdafridihosen-wq]

import React, { useState } from 'react';

export default function TwoFactorAuth({ userId }) {
const [qrCode, setQrCode] = useState('');
const [token, setToken] = useState('');
const [message, setMessage] = useState('');
const [is2FAEnabled, setIs2FAEnabled] = useState(false);
const [setupInProgress, setSetupInProgress] = useState(false);

const startSetup = () => {
setSetupInProgress(true);
setMessage('');
fetch('http://localhost:4000/2fa/setup', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ userId }),
})
.then(res => res.json())
.then(data => {
if (data.qrCode) {
setQrCode(data.qrCode);
setMessage('Scan the QR code with your authenticator app.');
} else {
setMessage(data.error || 'Error generating 2FA setup.');
setSetupInProgress(false);
}
})
.catch(() => {
setMessage('Could not contact server.');
setSetupInProgress(false);
});
};

const activate2FA = e => {
e.preventDefault();
if (token.length !== 6) {
setMessage('Please enter a valid 6-digit code.');
return;
}
fetch('http://localhost:4000/2fa/activate', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ userId, token }),
})
.then(res => res.json())
.then(data => {
if (data.success) {
setMessage(data.message);
setIs2FAEnabled(true);
setSetupInProgress(false);
setQrCode('');
setToken('');
} else {
setMessage(data.message || 'Activation failed.');
}
})
.catch(() => setMessage('Activation error.'));
};

const deactivate2FA = () => {
// প্রকৃত প্রোজেক্টে এখানে API কল করে ডাটাবেজে ডিএক্টিভেট করো
setIs2FAEnabled(false);
setMessage('2FA is disabled. You can enable it anytime.');
};

return (

২-ফ্যাক্টর অথেনটিকেশন

  {!is2FAEnabled ? (
    <>
      {!setupInProgress ? (
        <button
          onClick={startSetup}
          className="w-full bg-indigo-600 text-white py-2 rounded hover:bg-indigo-700 mb-3"
        >
          2FA চালু করুন
        </button>
      ) : (
        <>
          {qrCode && (
            <div className="text-center mb-4">
              <p>{message}</p>
              <img src={qrCode} alt="2FA QR Code" className="mx-auto my-2 w-48 h-48" />
            </div>
          )}
          <form onSubmit={activate2FA} className="space-y-3">
            <input
              type="text"
              maxLength={6}
              value={token}
              onChange={e => setToken(e.target.value)}
              placeholder="৬ ডিজিট কোড লিখুন"
              className="w-full border rounded p-2"
            />
            <button
              type="submit"
              className="w-full bg-green-600 text-white py-2 rounded hover:bg-green-700"
            >
              যাচাই ও চালু করুন
            </button>
          </form>
        </>
      )}
    </>
  ) : (
    <>
      <p className="mb-3