Github-Mirror/GoMFT
1
0 Fork 0
mirror of https://github.com/StarFleetCPTN/GoMFT.git synced 2026-10-24 15:00:26 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: Implement Two-Factor Authentication (2FA) functionality

Browse Source 
- Added support for Two-Factor Authentication, including setup, verification, and disabling features.
- Introduced new components for 2FA setup and verification, enhancing user security.
- Updated user model to include fields for 2FA secret, status, and backup codes.
- Created migration to add necessary database fields for 2FA.
- Enhanced authentication handlers to manage 2FA processes during login and profile updates.
- Updated routes to include 2FA-related endpoints for setup and verification.
This commit is contained in:
StarFleetCPTN committed 2025-03-17 05:17:03 -07:00
1 parent ef4bee88b8
commit a7d912aa44
14 files changed
+955 -18
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

components/profile.templ
+133
View File
@@ -5,8 +5,112 @@ import (
"github.com/starfleetcptn/gomft/internal/db"
)
// Dialog component for 2FA disable confirmation
templ TwoFactorDisableDialog() {
<div id="disable-2fa-dialog" class="hidden fixed inset-0 bg-secondary-900/50 dark:bg-secondary-900/80 backdrop-blur-sm z-50 flex items-center justify-center">
<div class="bg-white dark:bg-secondary-800 rounded-lg shadow-xl max-w-md w-full mx-4 overflow-hidden">
<div class="px-6 pt-5 pb-3 text-center">
<div class="flex justify-center mb-2">
<i class="fas fa-shield-alt text-yellow-400 text-3xl"></i>
</div>
<h3 class="text-xl font-medium text-secondary-900 dark:text-secondary-100">
Disable Two-Factor Authentication
</h3>
</div>
<div class="px-6 py-4">
<p class="text-secondary-700 dark:text-secondary-300 mb-4">
Are you sure you want to disable two-factor authentication? This will make your account less secure.
</p>
<div class="space-y-4">
<div>
<label for="current-password-2fa" class="block text-sm font-medium text-secondary-700 dark:text-secondary-300 mb-1">
<i class="fas fa-lock mr-1"></i> Current Password
</label>
<div class="relative">
<div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
<i class="fas fa-key text-secondary-400 dark:text-secondary-600"></i>
</div>
<input
type="password"
id="current-password-2fa"
name="current_password"
class="form-input pl-10 w-full"
placeholder="Enter your current password"
required/>
</div>
</div>
<div id="disable-2fa-result"></div>
</div>
</div>
<div class="px-6 py-4 flex justify-end space-x-3">
<button type="button" class="btn-secondary" onclick="hideDisable2FADialog()">
Cancel
</button>
<button
type="button"
class="btn-danger"
onclick="submitDisable2FA()">
<i class="fas fa-times mr-1"></i>
Disable 2FA
</button>
</div>
</div>
</div>
}
templ Profile(ctx context.Context, user db.User) {
@LayoutWithContext("Profile", ctx) {
<script>
// Initialize dialog functionality
document.addEventListener('DOMContentLoaded', function() {
console.log('Initializing 2FA dialog functionality');
// Global functions for dialog control
window.hideDisable2FADialog = function() {
document.getElementById('disable-2fa-dialog').classList.add('hidden');
document.getElementById('current-password-2fa').value = '';
document.getElementById('disable-2fa-result').innerHTML = '';
};
window.showDisable2FADialog = function() {
console.log('Showing 2FA disable dialog');
document.getElementById('disable-2fa-dialog').classList.remove('hidden');
};
window.submitDisable2FA = function() {
const password = document.getElementById('current-password-2fa').value;
if (!password) {
document.getElementById('disable-2fa-result').innerHTML = `
<div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded" role="alert">
<span class="block sm:inline">Current password is required</span>
</div>`;
return;
}
htmx.ajax('POST', '/profile/2fa/disable', {
target: '#disable-2fa-result',
swap: 'innerHTML',
values: { current_password: password }
});
};
// Close dialog when clicking outside
document.getElementById('disable-2fa-dialog').addEventListener('click', function(e) {
if (e.target === this) {
hideDisable2FADialog();
}
});
// Close dialog on escape key
document.addEventListener('keydown', function(e) {
if (e.key === 'Escape' && !document.getElementById('disable-2fa-dialog').classList.contains('hidden')) {
hideDisable2FADialog();
}
});
});
</script>
@TwoFactorDisableDialog()
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<div class="flex items-center justify-between mb-6">
<h1 class="text-3xl font-bold text-secondary-900 dark:text-secondary-100">
@@ -45,6 +149,35 @@ templ Profile(ctx context.Context, user db.User) {
}
</dd>
</div>
<div class="flex flex-col sm:flex-row">
<dt class="text-sm font-medium text-secondary-500 dark:text-secondary-400 sm:w-1/3 mb-1 sm:mb-0">Two-Factor Authentication</dt>
<dd class="text-sm text-secondary-900 dark:text-secondary-100 sm:w-2/3">
if user.TwoFactorEnabled {
<div class="flex items-center space-x-4">
<span class="badge badge-success">
<i class="fas fa-shield-alt mr-1"></i> Enabled
</span>
<button
type="button"
class="btn-danger btn-sm"
onclick="showDisable2FADialog()">
<i class="fas fa-times mr-1"></i>
Disable 2FA
</button>
</div>
} else {
<div class="flex items-center space-x-4">
<span class="badge badge-warning">
<i class="fas fa-shield-alt mr-1"></i> Disabled
</span>
<a href="/profile/2fa/setup" class="btn-primary btn-sm">
<i class="fas fa-lock mr-1"></i>
Enable 2FA
</a>
</div>
}
</dd>
</div>
<div class="flex flex-col sm:flex-row">
<dt class="text-sm font-medium text-secondary-500 dark:text-secondary-400 sm:w-1/3 mb-1 sm:mb-0">Theme</dt>
<dd class="text-sm text-secondary-900 dark:text-secondary-100 sm:w-2/3">