created frontend for saving

console/app/components/two-fa-settings.js

@@ -31,9 +31,12 @@ export default class TwoFaSettingsComponent extends Component {
         } else {
             this.selected2FAMethod = this.TwoFaMethods.find((method) => method.recommended);
         }
+
+        console.log('selected2FAMethod:', this.selected2FAMethod);
     }
 
     @action select2FAMethod(method) {
         this.selected2FAMethod = method;
+        console.log('selected2FAMethod:', this.selected2FAMethod);
     }
 }

console/app/controllers/console/admin/two-fa-settings.js

@@ -4,56 +4,72 @@ import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
 
 export default class ConsoleAdminTwoFaSettingsController extends Controller {
+    /**
+     * Inject the notifications service.
+     *
+     * @memberof ConsoleAdminTwoFaSettingsController
+     */
     @service notifications;
-    @service currentUser;
+
+    /**
+     * Inject the fetch service.
+     *
+     * @memberof ConsoleAdminTwoFaSettingsController
+     */
+    @service fetch;
 
     @tracked selected2FAMethod;
-    @tracked is2FAEnabled = false;
 
-    // @action
-    // async saveSettings() {
-    //     const currentUser = this.currentUser.user;
-    //     if (currentUser) {
-    //         console.log('Before setting meta:', currentUser.meta);
-    //         currentUser.meta = {
-    //             two_factor_method: this.selected2FAMethod,
-    //         };
-    //         console.log('After setting meta:', currentUser.meta);
-    //         try {
-    //             await currentUser.save();
-    //             this.notifications.success('Settings saved successfully.');
-    //         } catch (error) {
-    //             console.error('Error saving settings:', error);
-    //             this.notifications.error('Failed to save settings.');
-    //         }
-    //     } else {
-    //         console.error('Current user not found.');
-    //         this.notifications.error('User not found.');
-    //     }
-    // }
+    @tracked is2FAEnabled;
 
-    @action
-    async saveSettings() {
-        const currentUser = this.currentUser.user;
-        if (currentUser) {
-            if (this.selected2FAMethod) {
-                currentUser.meta = {
-                    two_factor_method: this.selected2FAMethod,
-                };
-                try {
-                    await currentUser.save();
-                    this.notifications.success('Settings saved successfully.');
-                } catch (error) {
-                    console.error('Error saving settings:', error);
-                    this.notifications.error('Failed to save settings.');
-                }
-            } else {
-                console.error('No selected 2FA method.');
-                this.notifications.warning('Please select a 2FA method before saving.');
-            }
-        } else {
-            console.error('Current user not found.');
-            this.notifications.error('User not found.');
-        }
+    /**
+     * The 2FA settings value JSON.
+     *
+     * @memberof ConsoleAdminNotificationsController
+     * @var {Object}
+     */
+    @tracked twoFaSettings = {
+        selectedMethod: null,
+        isEnabled: false,
+    };
+
+    /**
+     * Tracked property for the loading state
+     *
+     * @memberof ConsoleAdminTwoFaSettingsController
+     * @var {Boolean}
+     */
+    @tracked isLoading = false;
+
+    constructor(){
+        super(...arguments);
+    }
+
+    /**
+     * Save Two Factor settings to the server.
+     *
+     * @action
+     * @method saveSettings
+     * @returns {Promise}
+     * @memberof ConsoleAdminTwoFaSettingsController
+     */
+    @action saveSettings() {
+        const { twoFaSettings } = this;
+
+        console.log('settings', twoFaSettings)
+
+        this.isLoading = true;
+
+        return this.fetch
+            .post('two-fa-settings/save-settings', { twoFaSettings })
+            .then(() => {
+                this.notifications.success('2FA settings successfully saved.');
+            })
+            .catch((error) => {
+                this.notifications.serverError(error);
+            })
+            .finally(() => {
+                this.isLoading = false;
+            });
     }
 }

console/app/models/user.js

@@ -80,7 +80,7 @@ export default class UserModel extends Model {
     @not('isPhoneVerified') phoneIsNotVerified;
 
     /** @computed */
-    @computed('meta') get isTwoFactorEnabled() {
+    @computed('meta.two_factor_enabled') get isTwoFactorEnabled() {
         return this.meta && this.meta.two_factor_enabled;
     }
 

console/app/router.js

@@ -11,7 +11,6 @@ Router.map(function () {
         this.route('login', { path: '/' });
         this.route('forgot-password');
         this.route('reset-password');
-        this.route('two-fa');
     });
     this.route('onboard', function () {
         this.route('verify-email');
@@ -58,15 +57,15 @@ Router.map(function () {
             path: 'iam',
         });
 
-        this.mount('@fleetbase/storefront-engine', {
-            as: 'storefront',
-            path: 'storefront',
-        });
-
         this.mount('@fleetbase/fleetops-engine', {
             as: 'fleet-ops',
             path: 'fleet-ops',
         });
+
+        this.mount('@fleetbase/storefront-engine', {
+            as: 'storefront',
+            path: 'storefront',
+        });
     });
     this.route('install');
 });

console/app/routes/console/admin/two-fa-settings.js

@@ -1,10 +1,3 @@
 import Route from '@ember/routing/route';
-import { inject as service } from '@ember/service';
 
-export default class ConsoleAdminTwoFaSettingsRoute extends Route {
-    @service store;
-
-    model(params) {
-        return this.store.query('user', params);
-    }
-}
+export default class ConsoleAdminTwoFaSettingsRoute extends Route {}

console/app/serializers/two-fa-settings.js

@@ -0,0 +1,4 @@
+import ApplicationSerializer from '@fleetbase/ember-core/serializers/application';
+import { EmbeddedRecordsMixin } from '@ember-data/serializer/rest';
+
+export default class TwoFaSettingsSerializer extends ApplicationSerializer.extend(EmbeddedRecordsMixin) {}

console/app/templates/console/admin/two-fa-settings.hbs

@@ -7,8 +7,8 @@
     <div class="container mx-auto h-screen" {{increase-height-by 1200}}>
         <div class="max-w-3xl my-10 mx-auto space-y-4">
             <ContentPanel @title="Two-Factor Authentication Settings" @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800">
-                <TwoFaSettings />
+                <TwoFaSettings @twoFaSettings={{this.twoFaSettings}} @selected2FAMethod={{this.selected2FAMethod}} @is2FAEnabled={{this.is2FAEnabled}} @toggle2FA={{this.toggle2FA}}/>
             </ContentPanel>
         </div>
     </div>
-</Layout::Section::Body>
+</Layout::Section::Body>

console/router.map.js

@@ -43,6 +43,7 @@ Router.map(function () {
             });
             this.route('branding');
             this.route('notifications');
+            this.route('two-fa-settings');
             this.route('virtual', { path: '/:slug/:view' });
         });
     });

console/tests/unit/serializers/two-fa-settings-test.js

@@ -0,0 +1,23 @@
+import { module, test } from 'qunit';
+import { setupTest } from '@fleetbase/console/tests/helpers';
+
+module('Unit | Serializer | two fa settings', function (hooks) {
+    setupTest(hooks);
+
+    // Replace this with your real tests.
+    test('it exists', function (assert) {
+        let store = this.owner.lookup('service:store');
+        let serializer = store.serializerFor('two-fa-settings');
+
+        assert.ok(serializer);
+    });
+
+    test('it serializes records', function (assert) {
+        let store = this.owner.lookup('service:store');
+        let record = store.createRecord('two-fa-settings', {});
+
+        let serializedRecord = record.serialize();
+
+        assert.ok(serializedRecord);
+    });
+});