Added message popup for Server Errors https://github.com/libredirect/browser_extension/issues/936

src/assets/javascripts/services.js

@@ -667,6 +667,15 @@ function computeService(url) {
     resolve()
   })
 }
+export function computeFrontend(url) {
+  for (const service in config.services) {
+    for (const frontend in config.services[service].frontends) {
+      if (all(service, frontend, options, config).includes(utils.protocolHost(url))) {
+        return {service, frontend}
+      }
+    }
+  }
+}
 
 /**
  * @param {URL} url
@@ -975,4 +984,5 @@ export default {
   copyRaw,
   switchInstance,
   isException,
+  computeFrontend,
 }

src/pages/background/background.js

@@ -58,7 +58,7 @@ browser.webRequest.onBeforeRequest.addListener(
       return null
     }
 
-    const newUrl = servicesHelper.redirect(
+    let newUrl = servicesHelper.redirect(
       url,
       details.type,
       originUrl,
@@ -72,20 +72,16 @@ browser.webRequest.onBeforeRequest.addListener(
       const frontend = url.searchParams.get("frontend")
       const oldUrl = new URL(url.searchParams.get("url"))
 
-      browser.tabs.update({
-        url: browser.runtime.getURL(
-          `/pages/messages/index.html?message=no_instance&url=${encodeURIComponent(oldUrl)}&frontend=${encodeURIComponent(frontend)}`
-        ),
-      })
+      newUrl = browser.runtime.getURL(
+        `/pages/messages/index.html?message=no_instance&url=${encodeURIComponent(oldUrl)}&frontend=${encodeURIComponent(frontend)}`
+      )
     }
 
     if (!newUrl) {
       if (url.href.match(/^https?:\/{2}(.*\.)?libredirect\.invalid.*/)) {
-        browser.tabs.update({
-          url: browser.runtime.getURL(
-            `/pages/messages/index.html?message=disabled&url=${encodeURIComponent(url.href)}`
-          ),
-        })
+        newUrl = browser.runtime.getURL(
+          `/pages/messages/index.html?message=disabled&url=${encodeURIComponent(url.href)}`
+        )
       }
     }
 
@@ -108,6 +104,22 @@ browser.webRequest.onBeforeRequest.addListener(
   ["blocking"]
 )
 
+browser.webRequest.onHeadersReceived.addListener(
+  details => {
+    if (details.statusCode >= 501 || details.statusCode == 429 || details.statusCode == 403) {
+      const url = new URL(details.url)
+      const { service, frontend } = servicesHelper.computeFrontend(url)
+      if (!service) return
+      browser.tabs.update({
+        url: browser.runtime.getURL(
+          `/pages/messages/index.html?message=server_error&code=${details.statusCode}=&url=${encodeURIComponent(url.href)}&frontend=${encodeURIComponent(frontend)}&service=${encodeURIComponent(service)}`
+        ),
+      })
+    }
+  },
+  { urls: ["<all_urls>"] }
+)
+
 browser.tabs.onRemoved.addListener(tabId => {
   if (tabIdRedirects[tabId] != undefined) {
     delete tabIdRedirects[tabId]

src/pages/messages_src/App.svelte

@@ -9,6 +9,7 @@
   import { options, config, page } from "./stores"
   import Button from "../components/Button.svelte"
   import AutoPickIcon from "../icons/AutoPickIcon.svelte"
+  import SwitchInstanceIcon from "../icons/SwitchInstanceIcon.svelte"
 
   let _options
   const unsubscribeOptions = options.subscribe(val => {
@@ -49,7 +50,7 @@
   const params = new URLSearchParams(window.location.search)
   const oldUrl = new URL(params.get("url"))
 
-  async function autoPickInstance() {
+  async function autoPick() {
     const frontend = params.get("frontend")
     autoPicking = true
     const instances = utils.randomInstances(redirects[frontend]["clearnet"], 5)
@@ -59,6 +60,10 @@
     _options[frontend].push(pings[0][0])
     options.set(_options)
     autoPicking = false
+  }
+
+  async function autoPickInstance() {
+    await autoPick()
     await redirectUrl()
   }
 
@@ -73,6 +78,36 @@
     const newUrl = await servicesHelper.redirectAsync(oldUrl, "main_frame", null, null, false, true)
     browser.tabs.update({ url: newUrl })
   }
+
+  async function switchInstance() {
+    const newUrl = await servicesHelper.switchInstance(oldUrl)
+    browser.tabs.update({ url: newUrl })
+  }
+
+  async function removeInstance() {
+    const frontend = params.get("frontend")
+    const i = _options[frontend].indexOf(utils.protocolHost(oldUrl))
+    _options[frontend].splice(i, 1)
+    options.set(_options)
+    const newUrl = await servicesHelper.switchInstance(oldUrl, service)
+    browser.tabs.update({ url: newUrl })
+  }
+
+  async function removeAndAutoPickInstance() {
+    const frontend = params.get("frontend")
+    const i = _options[frontend].indexOf(utils.protocolHost(oldUrl))
+    _options[frontend].splice(i, 1)
+    options.set(_options)
+    await autoPick()
+    const newUrl = await servicesHelper.switchInstance(oldUrl, service)
+    browser.tabs.update({ url: newUrl })
+  }
+
+  async function addAutoPickInstance() {
+    await autoPick()
+    const newUrl = await servicesHelper.switchInstance(oldUrl)
+    browser.tabs.update({ url: newUrl })
+  }
 </script>
 
 {#if _options && _config}
@@ -84,6 +119,34 @@
           {browser.i18n.getMessage("enable") || "Enable"}
         </Button>
       </div>
+    {:else if window.location.search.includes("message=server_error")}
+      <!-- https://httpstat.us/403 for testing -->
+      <div>
+        <h1>Your selected instance gave out an error</h1>
+        {#if _options[params.get("frontend")].length > 1}
+          <Button on:click={switchInstance}>
+            <SwitchInstanceIcon class="margin margin_{document.body.dir}" />
+            {browser.i18n.getMessage("switchInstance") || "Switch Instance"}
+          </Button>
+          <Button on:click={removeInstance}>
+            <SwitchInstanceIcon class="margin margin_{document.body.dir}" />
+            {browser.i18n.getMessage("removeInstance") || "Remove Instance"}
+            +
+            {browser.i18n.getMessage("switchInstance") || "Switch Instance"}
+          </Button>
+        {:else}
+          <Button on:click={addAutoPickInstance} disabled={autoPicking}>
+            <AutoPickIcon class="margin margin_{document.body.dir}" />
+            {browser.i18n.getMessage("autoPickInstance") || "Auto Pick Instance"}
+          </Button>
+          <Button on:click={removeAndAutoPickInstance} disabled={autoPicking}>
+            <AutoPickIcon class="margin margin_{document.body.dir}" />
+            {browser.i18n.getMessage("removeInstance") || "Remove Instance"}
+            +
+            {browser.i18n.getMessage("autoPickInstance") || "Auto Pick Instance"}
+          </Button>
+        {/if}
+      </div>
     {:else if window.location.search.includes("message=no_instance")}
       <div>
         <h1>You have no instance selected for this frontend</h1>