Remove mastodon posts on delete and OTP

frontend/static/profile.js

@@ -9,6 +9,15 @@ const profileLogoutButton = document.querySelector('#logout-button');
 const accessToken = localStorage.getItem('linklogAccessToken');
 const defaultPostPrefix = 'From my #LinkLog: ';
 const mastodonConnectButton = document.querySelector('#mastodon-connect');
+const otpSetupButton = document.querySelector('#otp-setup');
+const otpEnableButton = document.querySelector('#otp-enable');
+const otpDisableButton = document.querySelector('#otp-disable');
+const otpProvisioning = document.querySelector('#otp-provisioning');
+const otpDisabled = document.querySelector('#otp-disabled');
+const otpEnabled = document.querySelector('#otp-enabled');
+const otpSecret = document.querySelector('#otp-secret');
+const otpUri = document.querySelector('#otp-uri');
+const otpStatus = document.querySelector('#otp-status');
 
 function authHeaders(includeJson = false) {
   return {
@@ -23,6 +32,64 @@ function setStatus(selector, message, isError = false) {
   status.style.color = isError ? '#b91c1c' : '#166534';
 }
 
+function setOtpStatus(message, isError = false) {
+  otpStatus.textContent = message;
+  otpStatus.style.color = isError ? '#b91c1c' : '#166534';
+}
+
+async function loadOtp() {
+  const response = await fetch('/api/user/otp', {headers: authHeaders()});
+  if (!response.ok) throw new Error('Could not load one-time password settings');
+  const result = await response.json();
+  otpDisabled.classList.toggle('hidden', result.enabled);
+  otpEnabled.classList.toggle('hidden', !result.enabled);
+}
+
+otpSetupButton.addEventListener('click', async () => {
+  const response = await fetch('/api/user/otp/setup', {method: 'POST', headers: authHeaders()});
+  const result = await response.json();
+  if (!response.ok) {
+    setOtpStatus(result.detail || 'Could not start one-time password setup.', true);
+    return;
+  }
+  otpSecret.textContent = result.secret;
+  otpUri.href = result.otpauth_url;
+  otpProvisioning.classList.remove('hidden');
+  setOtpStatus('Enter a code from your authenticator app to confirm setup.');
+});
+
+otpEnableButton.addEventListener('click', async () => {
+  const code = document.querySelector('#otp-setup-code').value.trim();
+  const response = await fetch('/api/user/otp', {
+    method: 'POST', headers: authHeaders(true), body: JSON.stringify({action: 'enable', code}),
+  });
+  const result = await response.json();
+  if (!response.ok) {
+    setOtpStatus(result.detail || 'Could not enable one-time password.', true);
+    return;
+  }
+  otpDisabled.classList.add('hidden');
+  otpEnabled.classList.remove('hidden');
+  otpProvisioning.classList.add('hidden');
+  setOtpStatus('One-time password enabled.');
+});
+
+otpDisableButton.addEventListener('click', async () => {
+  const code = document.querySelector('#otp-disable-code').value.trim();
+  const response = await fetch('/api/user/otp', {
+    method: 'POST', headers: authHeaders(true), body: JSON.stringify({action: 'disable', code}),
+  });
+  const result = await response.json();
+  if (!response.ok) {
+    setOtpStatus(result.detail || 'Could not disable one-time password.', true);
+    return;
+  }
+  otpDisabled.classList.remove('hidden');
+  otpEnabled.classList.add('hidden');
+  document.querySelector('#otp-disable-code').value = '';
+  setOtpStatus('One-time password disabled.');
+});
+
 async function loadProfile() {
   const response = await fetch('/api/user/me', {headers: authHeaders()});
   if (!response.ok) throw new Error('Could not load profile');
@@ -136,7 +203,7 @@ passwordForm.addEventListener('submit', async (event) => {
   if (response.ok) passwordForm.reset();
 });
 
-Promise.all([loadProfile(), loadMastodonConfig()]).catch((error) => {
+Promise.all([loadProfile(), loadMastodonConfig(), loadOtp()]).catch((error) => {
   setStatus('#profile-status', accessToken ? error.message : 'Please sign in first.', true);
 });
 })();