Merge pull request #7 from fleetbase/dev-v0.2.5

added invite routes/templates logic, few patches and udpates

app/controllers/invite/for-user.js

@@ -0,0 +1,57 @@
+import Controller from '@ember/controller';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { action } from '@ember/object';
+
+export default class InviteForUserController extends Controller {
+    @service fetch;
+    @service session;
+    @service notifications;
+    @service modalsManager;
+    @tracked code;
+    @tracked isLoading;
+
+    @action acceptInvite() {
+        const { code } = this;
+
+        this.isLoading = true;
+
+        this.fetch
+            .post('users/accept-company-invite', { code })
+            .then((response) => {
+                this.session.manuallyAuthenticate(response.token);
+                this.notifications.success('Invitation accepted, welcome to Fleetbase!');
+
+                this.isLoading = false;
+
+                return this.transitionToRoute('console').then(() => {
+                    if (response.needs_password && response.needs_password === true) {
+                        this.setPassword();
+                    }
+                });
+            })
+            .catch((error) => {
+                this.notifications.serverError(error);
+                this.isLoading = false;
+            });
+    }
+
+    @action setPassword() {
+        this.modalsManager.show('modals/set-password', {
+            title: 'Set a new password',
+            closeButton: false,
+            backdropClose: false,
+            hideDeclineButton: true,
+            declineButtonDisabled: true,
+            password: null,
+            password_confirmation: null,
+            confirm: (modal) => {
+                modal.startLoading();
+
+                const input = modal.getOptions(['password', 'password_confirmation']);
+
+                return this.fetch.post('users/set-password', input);
+            },
+        });
+    }
+}

app/router.js

@@ -15,6 +15,10 @@ Router.map(function () {
     this.route('onboard', function () {
         this.route('verify-email');
     });
+    this.route('invite', { path: 'join' }, function () {
+        this.route('for-driver', { path: '/fleet/:public_id' });
+        this.route('for-user', { path: '/org/:public_id' });
+    });
     this.route('console', { path: '/' }, function () {
         this.route('home', { path: '/' });
         this.route('extensions');

app/routes/invite.js

@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class InviteRoute extends Route {}

app/routes/invite/for-driver.js

@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class InviteForDriverRoute extends Route {}

app/routes/invite/for-user.js

@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class InviteForUserRoute extends Route {}

app/templates/console/admin.hbs

@@ -13,7 +13,7 @@
             {{/each}}
         </Layout::Sidebar::Panel>
     {{/each}}
-    <Layout::Sidebar::Panel @open={{true}} @title="System Configuration">
+    <Layout::Sidebar::Panel @open={{true}} @title="System Config">
         <Layout::Sidebar::Item @route="console.admin.config.services" @icon="bell-concierge">Services</Layout::Sidebar::Item>
         <Layout::Sidebar::Item @route="console.admin.config.mail" @icon="envelope">Mail</Layout::Sidebar::Item>
         <Layout::Sidebar::Item @route="console.admin.config.filesystem" @icon="hard-drive">Filesystem</Layout::Sidebar::Item>

app/templates/console/virtual.hbs

@@ -1,2 +1,10 @@
-{{page-title "Virtual"}}
-{{outlet}}
+{{page-title @model.title}}
+<Layout::Section::Header @title={{@model.title}} />
+
+<Layout::Section::Body class="overflow-y-scroll h-full">
+    <div class="container mx-auto h-screen" {{increase-height-by 300}}>
+        <div class="max-w-3xl my-10 mx-auto space-y-">
+            {{component @model.component params=@model.componentParams}}
+        </div>
+    </div>
+</Layout::Section::Body>

app/templates/invite.hbs

@@ -0,0 +1,2 @@
+{{page-title "Invite"}}
+{{outlet}}

app/templates/invite/for-driver.hbs

@@ -0,0 +1,2 @@
+{{page-title "ForDriver"}}
+{{outlet}}

app/templates/invite/for-user.hbs

@@ -0,0 +1,36 @@
+<div class="min-h-screen bg-gray-50 dark:bg-gray-900 flex flex-col justify-center py-12">
+    <div class="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
+        <div class="bg-white dark:bg-gray-800 py-8 px-4 shadow sm:rounded-lg sm:px-10">
+            <div class="mb-8">
+                <img class="mx-auto h-12 w-auto" src={{@brand.icon_url}} alt={{t "app.name"}}>
+                <h2 class="mt-6 text-center text-lg font-extrabold text-gray-900 dark:text-white truncate">
+                    You've been invited to join {{@model.name}}
+                </h2>
+            </div>
+
+            <div class="flex px-3 py-2 mb-6 rounded-md shadow-sm bg-blue-200">
+                <div>
+                    <FaIcon @icon="info-circle" class="text-blue-900 mr-4" />
+                </div>
+                <p class="flex-1 text-sm text-blue-900 dark:text-blue-900">
+                    You've been invited to join the {{@model.name}} organization on {{t "app.name"}}. To accept this invitation, input your invitation code received by email and click continue.
+                </p>
+            </div>
+
+            <form class="space-y-6" {{on "submit" this.acceptInvite}}>
+                <div>
+                    <label for="code" class="block text-sm font-medium text-gray-700 dark:text-gray-50">
+                        Your invitiation code
+                    </label>
+                    <div class="mt-2">
+                        <Input @value={{this.code}} id="code" name="code" @type="code" required class="form-input form-input-lg w-full" placeholder="Your invitiation code" />
+                    </div>
+                </div>
+
+                <div>
+                    <Button @icon="check" @size="lg" @type="primary" @buttonType="submit" @text="Accept Invitation" @onClick={{this.acceptInvite}} @isLoading={{this.isLoading}} />
+                </div>
+            </form>
+        </div>
+    </div>
+</div>

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@fleetbase/console",
-    "version": "0.2.4",
+    "version": "0.2.5",
     "private": true,
     "description": "Fleetbase Console",
     "repository": "",
@@ -25,12 +25,12 @@
     },
     "dependencies": {
         "@ember/legacy-built-in-components": "^0.4.1",
-        "@fleetbase/ember-core": "^0.1.3",
-        "@fleetbase/ember-ui": "^0.1.9",
+        "@fleetbase/ember-core": "^0.1.4",
+        "@fleetbase/ember-ui": "^0.2.0",
         "@fleetbase/dev-engine": "^0.1.8",
         "@fleetbase/iam-engine": "^0.0.6",
-        "@fleetbase/fleetops-engine": "^0.2.5",
-        "@fleetbase/fleetops-data": "^0.1.0",
+        "@fleetbase/fleetops-engine": "^0.2.6",
+        "@fleetbase/fleetops-data": "^0.1.1",
         "@fleetbase/storefront-engine": "^0.1.7",
         "@fleetbase/leaflet-routing-machine": "^3.2.16",
         "@fortawesome/ember-fontawesome": "^0.4.1",
@@ -125,9 +125,9 @@
     },
     "pnpm": {
         "overrides": {
-            "@fleetbase/fleetops-data": "0.1.0",
-            "@fleetbase/ember-core": "^0.1.3",
-            "@fleetbase/ember-ui": "^0.1.9"
+            "@fleetbase/fleetops-data": "^0.1.1",
+            "@fleetbase/ember-core": "^0.1.4",
+            "@fleetbase/ember-ui": "^0.2.0"
         }
     },
     "prettier": {