Feature: Access tokens for API access (#604)

Co-authored-by: Pranav Raj Sreepuram <pranavrajs@gmail.com>

app/javascript/dashboard/api/channel/webChannel.js

@@ -2,7 +2,7 @@ import ApiClient from '../ApiClient';
 
 class WebChannel extends ApiClient {
   constructor() {
-    super('widget/inboxes');
+    super('widget/inboxes', { accountScoped: true });
   }
 }
 

app/javascript/dashboard/components/Code.vue

@@ -26,7 +26,8 @@ export default {
     },
   },
   methods: {
-    onCopy() {
+    onCopy(e) {
+      e.preventDefault();
       copy(this.script);
       bus.$emit('newToastMessage', this.$t('COMPONENTS.CODE.COPY_SUCCESSFUL'));
     },

app/javascript/dashboard/i18n/locale/en/settings.json

@@ -18,6 +18,10 @@
         "TITLE": "Password",
         "NOTE": "Updating your password would reset your logins in multiple devices."
       },
+      "ACCESS_TOKEN": {
+        "TITLE": "Access Token",
+        "NOTE": "This token can be used if you are building an API based integration"
+      },
       "EMAIL_NOTIFICATIONS_SECTION" : {
         "TITLE": "Email Notifications",
         "NOTE": "Update your email notification preferences here",

app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue

@@ -83,6 +83,17 @@
         </div>
       </div>
       <email-notifications />
+      <div class="profile--settings--row row">
+        <div class="columns small-3 ">
+          <h4 class="block-title">
+            {{ $t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.TITLE') }}
+          </h4>
+          <p>{{ $t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.NOTE') }}</p>
+        </div>
+        <div class="columns small-9 medium-5">
+          <woot-code :script="currentUser.access_token"></woot-code>
+        </div>
+      </div>
       <woot-submit-button
         class="button nice success button--fixed-right-top"
         :button-text="$t('PROFILE_SETTINGS.BTN_TEXT')"