fix: adding a pat account

Author: freaktechnik

_locales/en/messages.json

@@ -121,11 +121,11 @@
     "account_enterprise": {
         "message": "GitHub Enterprise"
     },
-    "account_github_light": {
+    "account_github-light": {
         "message": "GitHub (no private repos)"
     },
-    "account_github_user": {
-        "message": "GitHub (User Access Token)"
+    "account_github-user": {
+        "message": "GitHub (Personal access token)"
     },
     "addAccount": {
         "message": "Add account"
@@ -143,6 +143,9 @@
         "message": "Instance URL"
     },
     "userToken": {
-        "message": "User Access Token"
+        "message": "Personal access token"
+    },
+    "generate_token": {
+        "message": "Create personal access token"
     }
 }

options.html

@@ -15,9 +15,9 @@
             <form id="login">
                 <select class="browser-style">
                     <option value="github" data-l10n-id="account_github" disabled>GitHub</option>
-                    <option value="github-light" data-l10n-id="account_github_light" disabled>GitHub (no private repos)</option>
+                    <option value="github-light" data-l10n-id="account_github-light" disabled>GitHub (no private repos)</option>
                     <option value="enterprise" data-l10n-id="account_enterprise">GitHub Enterprise</option>
-                    <option value="github-user" data-l10n-id="account_github_user" selected>GitHub (User Access Token)</option><!-- default because OAuth flow is broken -->
+                    <option value="github-user" data-l10n-id="account_github-user" selected>GitHub (Personal access token)</option><!-- default because OAuth flow is broken -->
                 </select>
                 <fieldset name="enterprise" hidden>
                     <p class="browser-style">
@@ -35,8 +35,9 @@
                 </fieldset>
                 <fieldset name="github-user" hidden>
                     <p class="browser-style">
-                        <label for="github-user-token" data-l10n-id="userToken">User Access Token</label>
-                        <input type="password" id="github-user-token" name="token" disabled>
+                        <label for="github-user-token" data-l10n-id="userToken">Personal access token</label>
+                        <input type="password" id="github-user-token" class="browser-style" name="token" disabled>
+                        <a href="https://github.com/settings/tokens/new" data-l10n-id="generate_token" rel="noopener" target="_blank">Create personal access token</a>
                     </p>
                 </fieldset>
                 <button class="browser-style" type="submit" data-l10n-id="addAccount">Add account</button>

scripts/background.js

@@ -178,21 +178,29 @@ const init = async () => {
     if(!count) {
         needsAuth();
     }
-    //TODO only here should we have an online check?
     else {
         await setupNotificationWorkers();
     }
 };
 
-if(navigator.onLine) {
-    init().catch(console.error);
-}
-else {
-    window.addEventListener("online", () => {
-        init().catch(console.error);
-    }, {
-        passive: true,
-        capture: false,
-        once: true
-    });
-}
+window.requestIdleCallback(async () => {
+    if(navigator.onLine) {
+        await init().catch(console.error);
+    }
+    else {
+        // If we can't retrieve the accounts, wait for internet and try again.
+        const records = await manager.getRecords().catch(() => [ 0, 1 ]);
+        if(!records.length) {
+            needsAuth();
+        }
+        else {
+            window.addEventListener("online", () => {
+                init().catch(console.error);
+            }, {
+                passive: true,
+                capture: false,
+                once: true
+            });
+        }
+    }
+});

scripts/options.js

@@ -94,7 +94,7 @@ class AccountManager extends window.StorageManager {
             browser.runtime.sendMessage({
                 topic: "login",
                 type: typeForm.value,
-                details: this.getDetails()
+                details: this.getDetails(typeForm.value)
             }).catch((error) => {
                 this.showError(error.message);
             });
@@ -128,8 +128,8 @@ class AccountManager extends window.StorageManager {
         return this.list.querySelector(`[data-id="${id}"]`);
     }
 
-    getDetails() {
-        const inputs = this.form.querySelectorAll('fieldset[nane="enterprise"] input'),
+    getDetails(type) {
+        const inputs = this.form.querySelectorAll(`fieldset[name="${type}"] input`),
             details = {};
         for(const input of inputs) {
             if(input.value && !input.disabled) {