feat: recovery page when local gateway is unreachable

add-on/_locales/en/messages.json

@@ -750,5 +750,37 @@
   "option_telemetryGroupTracking_description": {
     "message": "Tracking description",
     "description": "A description for the 'tracking' grouping of metrics we collect (option_telemetryGroupTracking_description)"
+  },
+  "recovery_page_title" : {
+    "message": "Node Offline | IPFS Companion",
+    "description": "Title of the recovery page (recovery_page_title)"
+  },
+  "recovery_page_header" : {
+    "message": "Companion",
+    "description": "Main header on the recovery screen (recovery_page_header)"
+  },
+  "recovery_page_sub_header": {
+    "message": "Unable to reach the IPFS node :(",
+    "description": "Sub-Header on the recovery screen (recovery_page_sub_header)"
+  },
+  "recovery_page_message_p1": {
+    "message": "Make sure IPFS Desktop is running and provides the HTTP Gateway Functionality.",
+    "description": "Message Para-1 on the recovery screen (recovery_page_message_p1)"
+  },
+  "recovery_page_message_p2": {
+    "message": "Alternatively, you can try to open the requested resource using the Public Gateway configured in IPFS Companion. In doing so you will be delegating trust to that HTTP server and the hash verification will no longer occur on your machine.",
+    "description": "Message Para-2 on the recovery screen (recovery_page_message_p2)"
+  },
+  "recovery_page_button": {
+    "message": "Continue to the public gateway",
+    "description": "Button on the recovery screen (recovery_page_button)"
+  },
+  "recovery_page_learn_more": {
+    "message": "Learn more about public gateways",
+    "description": "Learn more link on the recovery screen (recovery_page_learn_more)"
+  },
+  "recovery_page_update_preferences": {
+    "message": "Update your IPFS Companion preferences",
+    "description": "Learn more link on the recovery screen (recovery_page_learn_more)"
   }
 }

add-on/manifest.common.json

@@ -33,7 +33,10 @@
     "icons/png/ipfs-logo-off_38.png",
     "icons/png/ipfs-logo-off_128.png",
     "icons/ipfs-logo-on.svg",
-    "icons/ipfs-logo-off.svg"
+    "icons/ipfs-logo-off.svg",
+    "dist/recovery/recovery.css",
+    "dist/recovery/recovery.html",
+    "dist/recovery/recovery.js"
   ],
   "content_security_policy": "script-src 'self'; object-src 'self'; frame-src 'self';",
   "default_locale": "en"

add-on/src/landing-pages/welcome/page.js

@@ -47,16 +47,24 @@ export default function createWelcomePage (i18n) {
 /* ========================================================
    Render functions for the left side
    ======================================================== */
-
-const renderCompanionLogo = (i18n, isIpfsOnline) => {
+export const renderLogo = (isIpfsOnline, logoSize = 128) => {
   const logoPath = '../../../icons'
-  const logoSize = 128
+
+  return html`
+    ${logo({ path: logoPath, size: logoSize, isIpfsOnline })}
+  `
+}
+
+export const renderCompanionLogo = (i18n, isIpfsOnline, showTitle = true) => {
   const stateUnknown = isIpfsOnline === null
 
   return html`
     <div class="mt4 mb2 flex flex-column justify-center items-center transition-all ${stateUnknown && 'state-unknown'}">
-      ${logo({ path: logoPath, size: logoSize, isIpfsOnline })}
-      <p class="montserrat mt3 mb0 f2">${i18n.getMessage('page_landingWelcome_logo_title')}</p>
+      ${renderLogo(isIpfsOnline)}
+      ${showTitle
+        ? html`<p class="montserrat mt3 mb0 f2">${i18n.getMessage('page_landingWelcome_logo_title')}</p>`
+        : ''
+      }
     </div>
   `
 }

add-on/src/lib/constants.js

@@ -3,4 +3,5 @@
 
 export const welcomePage = '/dist/landing-pages/welcome/index.html'
 export const optionsPage = '/dist/options/options.html'
+export const recoveryPagePath = '/dist/recovery/recovery.html'
 export const tickMs = 250 // no CPU spike, but still responsive enough

add-on/src/lib/ipfs-companion.js

@@ -10,7 +10,7 @@ import LRU from 'lru-cache'
 import all from 'it-all'
 import { optionDefaults, storeMissingOptions, migrateOptions, guiURLString, safeURL } from './options.js'
 import { initState, offlinePeerCount } from './state.js'
-import { createIpfsPathValidator, sameGateway, safeHostname } from './ipfs-path.js'
+import { createIpfsPathValidator, dropSlash, sameGateway, safeHostname } from './ipfs-path.js'
 import createDnslinkResolver from './dnslink.js'
 import { createRequestModifier } from './ipfs-request.js'
 import { initIpfsClient, destroyIpfsClient, reloadIpfsClientOfflinePages } from './ipfs-client/index.js'
@@ -223,7 +223,6 @@ export default async function init () {
 
   async function sendStatusUpdateToBrowserAction () {
     if (!browserActionPort) return
-    const dropSlash = url => url.replace(/\/$/, '')
     const currentTab = await browser.tabs.query({ active: true, currentWindow: true }).then(tabs => tabs[0])
     const { version } = browser.runtime.getManifest()
     const info = {

add-on/src/lib/ipfs-path.js

@@ -8,6 +8,8 @@ import isFQDN from 'is-fqdn'
 // For how long more expensive lookups (DAG traversal etc) should be cached
 const RESULT_TTL_MS = 300000 // 5 minutes
 
+export const dropSlash = url => url.replace(/\/$/, '')
+
 // Turns URL or URIencoded path into a content path
 export function ipfsContentPath (urlOrPath, opts) {
   opts = opts || {}

add-on/src/lib/ipfs-request.js

@@ -6,9 +6,11 @@ import debug from 'debug'
 import LRU from 'lru-cache'
 import isIPFS from 'is-ipfs'
 import isFQDN from 'is-fqdn'
-import { pathAtHttpGateway, sameGateway, ipfsUri } from './ipfs-path.js'
+import { dropSlash, ipfsUri, pathAtHttpGateway, sameGateway } from './ipfs-path.js'
 import { safeURL } from './options.js'
 import { braveNodeType } from './ipfs-client/brave.js'
+import { recoveryPagePath } from './constants.js'
+
 const log = debug('ipfs-companion:request')
 log.error = debug('ipfs-companion:request:error')
 
@@ -140,6 +142,13 @@ export function createRequestModifier (getState, dnslinkResolver, ipfsPathValida
       const state = getState()
       if (!state.active) return
 
+      // When local IPFS node is unreachable , show recovery page where user can redirect
+      // to public gateway.
+      if (!state.nodeActive && request.type === 'main_frame' && sameGateway(request.url, state.gwURL)) {
+        const publicUri = ipfsPathValidator.resolveToPublicUrl(request.url, state.pubGwURLString)
+        return { redirectUrl: `${dropSlash(runtimeRoot)}${recoveryPagePath}#${encodeURIComponent(publicUri)}` }
+      }
+
       // When Subdomain Proxy is enabled we normalize address bar requests made
       // to the local gateway and replace raw IP with 'localhost' hostname to
       // take advantage of subdomain redirect provided by go-ipfs >= 0.5

add-on/src/lib/state.js

@@ -50,8 +50,11 @@ export function initState (options, overrides) {
       return false
     }
   }
-  // TODO state.connected ~= state.peerCount > 0
-  // TODO state.nodeActive ~= API is online,eg. state.peerCount > offlinePeerCount
+  // TODO refactor this into a class. It's getting too big and messy.
+  Object.defineProperty(state, 'nodeActive', {
+    // TODO: make quick fetch to confirm it works?
+    get: function () { return this.peerCount !== offlinePeerCount }
+  })
   Object.defineProperty(state, 'localGwAvailable', {
     // TODO: make quick fetch to confirm it works?
     get: function () { return this.ipfsNodeType !== 'embedded' }

add-on/src/recovery/recovery.css

@@ -0,0 +1,61 @@
+@import url('~tachyons/css/tachyons.css');
+@import url('~ipfs-css/ipfs.css');
+
+#left-col {
+  background-image: url('../../images/stars.png'), linear-gradient(to bottom, #041727 0%, #043b55 100%);
+  background-size: 100%;
+  background-repeat: repeat;
+}
+
+a:hover {
+  text-decoration: underline;
+}
+
+/*
+  https://github.com/tachyons-css/tachyons-queries
+  Tachyons: $point == large
+*/
+@media (min-width: 60em) {
+  #left-col {
+    position: fixed;
+    top: 0;
+    right: 55%;
+    width: 45%;
+    background-image: url('../../images/stars.png'), linear-gradient(to bottom, #041727 0%, #043b55 100%);
+    background-size: 100%;
+    background-repeat: repeat;
+  }
+
+  #right-col {
+    margin-left: 57%;
+    margin-right: 7%;
+  }
+}
+
+@media (max-height: 800px) {
+  #left-col img {
+    width: 98px !important;
+    height: 98px !important;
+  }
+
+  #left-col svg {
+    width: 60px;
+  }
+}
+
+header {
+  z-index: 1;
+  border-color: #69c4cd;
+  text-transform: uppercase;
+}
+
+#header-logo {
+  height: 50px;
+  width: 117.5px;
+}
+
+.recovery-root {
+  width: 100%;
+  height: 100%;
+  text-align: left;
+}

add-on/src/recovery/recovery.html

@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <title>IPFS Node is Offline</title>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width">
+    <link rel="shortcut icon" href="data:image/x-icon;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlo89/56ZQ/8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACUjDu1lo89/6mhTP+zrVP/nplD/5+aRK8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHNiIS6Wjz3/ubFY/761W/+vp1D/urRZ/8vDZf/GvmH/nplD/1BNIm8AAAAAAAAAAAAAAAAAAAAAAAAAAJaPPf+knEj/vrVb/761W/++tVv/r6dQ/7q0Wf/Lw2X/y8Nl/8vDZf+tpk7/nplD/wAAAAAAAAAAAAAAAJaPPf+2rVX/vrVb/761W/++tVv/vrVb/6+nUP+6tFn/y8Nl/8vDZf/Lw2X/y8Nl/8G6Xv+emUP/AAAAAAAAAACWjz3/vrVb/761W/++tVv/vrVb/761W/+vp1D/urRZ/8vDZf/Lw2X/y8Nl/8vDZf/Lw2X/nplD/wAAAAAAAAAAlo89/761W/++tVv/vrVb/761W/++tVv/r6dQ/7q0Wf/Lw2X/y8Nl/8vDZf/Lw2X/y8Nl/56ZQ/8AAAAAAAAAAJaPPf++tVv/vrVb/761W/++tVv/vbRa/5aPPf+emUP/y8Nl/8vDZf/Lw2X/y8Nl/8vDZf+emUP/AAAAAAAAAACWjz3/vrVb/761W/++tVv/vrVb/5qTQP+inkb/op5G/6KdRv/Lw2X/y8Nl/8vDZf/Lw2X/nplD/wAAAAAAAAAAlo89/761W/++tVv/sqlS/56ZQ//LxWb/0Mlp/9DJaf/Kw2X/oJtE/7+3XP/Lw2X/y8Nl/56ZQ/8AAAAAAAAAAJaPPf+9tFr/mJE+/7GsUv/Rymr/0cpq/9HKav/Rymr/0cpq/9HKav+xrFL/nplD/8vDZf+emUP/AAAAAAAAAACWjz3/op5G/9HKav/Rymr/0cpq/9HKav/Rymr/0cpq/9HKav/Rymr/0cpq/9HKav+inkb/nplD/wAAAAAAAAAAAAAAAKKeRv+3slb/0cpq/9HKav/Rymr/0cpq/9HKav/Rymr/0cpq/9HKav+1sFX/op5G/wAAAAAAAAAAAAAAAAAAAAAAAAAAop5GUKKeRv/Nxmf/0cpq/9HKav/Rymr/0cpq/83GZ/+inkb/op5GSAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAop5G16KeRv/LxWb/y8Vm/6KeRv+inkaPAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAop5G/6KeRtcAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA/n8AAPgfAADwDwAAwAMAAIABAACAAQAAgAEAAIABAACAAQAAgAEAAIABAACAAQAAwAMAAPAPAAD4HwAA/n8AAA==" />
+    <link rel="stylesheet" href="/dist/bundles/uiCommons.css">
+    <link rel="stylesheet" href="/dist/bundles/recoveryPage.css">
+  </head>
+  <body class="navy bg-white sans-serif">
+    <app class="flex flex-column transition-all vh-100">
+      <header class="flex-l items-center pa3 bg-navy bb bw3 border-aqua tc tl-l justify-between">
+        <div class="flex-none v-mid">
+          <svg alt="IPFS" id="header-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 553 235.3"><path d="M239 63h17.8v105H239V63zm35.6 0h36.3c7.9 0 14.5.9 19.6 2.6s9.2 4.1 12.1 7.1a24.45 24.45 0 016.2 10.2 40.75 40.75 0 011.8 12.1 45.69 45.69 0 01-1.8 12.9 26.58 26.58 0 01-6.2 10.8 30.59 30.59 0 01-12.1 7.3c-5.1 1.8-11.5 2.7-19.3 2.7h-19.1V168h-17.5V63zm36.2 51a38.37 38.37 0 0011.1-1.3 16.3 16.3 0 006.8-3.7 13.34 13.34 0 003.5-5.8 29.75 29.75 0 001-7.6 25.68 25.68 0 00-1-7.7 12 12 0 00-3.6-5.5 17.15 17.15 0 00-6.9-3.4 41.58 41.58 0 00-10.9-1.2h-18.5V114h18.5zm119.9-51v15.3h-49.2V108h46.3v15.4h-46.3V168h-17.8V63h67zm26.2 72.9c.8 6.9 3.3 11.9 7.4 15s10.4 4.7 18.6 4.7a32.61 32.61 0 0010.1-1.3 20.52 20.52 0 006.6-3.5 12 12 0 003.5-5.2 19.08 19.08 0 001-6.4 16.14 16.14 0 00-.7-4.9 12.87 12.87 0 00-2.6-4.5 16.59 16.59 0 00-5.1-3.6 35 35 0 00-8.2-2.4l-13.4-2.5a89.76 89.76 0 01-14.1-3.7 33.51 33.51 0 01-10.4-5.8 22.28 22.28 0 01-6.3-8.8 34.1 34.1 0 01-2.1-12.7 26 26 0 0111.3-22.4 36.35 36.35 0 0112.6-5.6 65.89 65.89 0 0115.8-1.8c7.2 0 13.3.8 18.2 2.5a34.46 34.46 0 0111.9 6.5 28.21 28.21 0 016.9 9.3 42.1 42.1 0 013.2 11l-16.8 2.6c-1.4-5.9-3.7-10.2-7.1-13.1s-8.7-4.3-16.1-4.3a43.9 43.9 0 00-10.5 1.1 19.47 19.47 0 00-6.8 3.1 11.63 11.63 0 00-3.7 4.6 14.08 14.08 0 00-1.1 5.4c0 4.6 1.2 8 3.7 10.3s6.9 4 13.2 5.3l14.5 2.8c11.1 2.1 19.2 5.6 24.4 10.5s7.8 12.1 7.8 21.4a31.37 31.37 0 01-2.4 12.3 25.27 25.27 0 01-7.4 9.8 36.58 36.58 0 01-12.4 6.6 56 56 0 01-17.3 2.4c-13.4 0-24-2.8-31.6-8.5s-11.9-14.4-12.6-26.2h18z" fill="#fff"/><path fill="#469ea2" d="M30.3 164l84 48.5 84-48.5V67l-84-48.5-84 48.5v97z"/><path d="M105.7 30.1l-61 35.2a18.19 18.19 0 010 3.3l60.9 35.2a14.55 14.55 0 0117.3 0l60.9-35.2a18.19 18.19 0 010-3.3L123 30.1a14.55 14.55 0 01-17.3 0zm84 48.2l-61 35.6a14.73 14.73 0 01-8.6 15l.1 70a15.57 15.57 0 012.8 1.6l60.9-35.2a14.73 14.73 0 018.6-15V79.9a20 20 0 01-2.8-1.6zm-150.8.4a15.57 15.57 0 01-2.8 1.6v70.4a14.38 14.38 0 018.6 15l60.9 35.2a15.57 15.57 0 012.8-1.6v-70.4a14.38 14.38 0 01-8.6-15L38.9 78.7z" fill="#6acad1"/><path fill="#469ea2" d="M114.3 29l75.1 43.4v86.7l-75.1 43.4-75.1-43.4V72.3L114.3 29m0-10.3l-84 48.5v97l84 48.5 84-48.5v-97l-84-48.5z"/><path fill="#469ea2" d="M114.9 132h-1.2A15.66 15.66 0 0198 116.3v-1.2a15.66 15.66 0 0115.7-15.7h1.2a15.66 15.66 0 0115.7 15.7v1.2a15.66 15.66 0 01-15.7 15.7zm0 64.5h-1.2a15.65 15.65 0 00-13.7 8l14.3 8.2 14.3-8.2a15.65 15.65 0 00-13.7-8zm83.5-48.5h-.6a15.66 15.66 0 00-15.7 15.7v1.2a15.13 15.13 0 002 7.6l14.3-8.3V148zm-14.3-89a15.4 15.4 0 00-2 7.6v1.2a15.66 15.66 0 0015.7 15.7h.6V67.2L184.1 59zm-69.8-40.3L100 26.9a15.73 15.73 0 0013.7 8.1h1.2a15.65 15.65 0 0013.7-8l-14.3-8.3zM44.6 58.9l-14.3 8.3v16.3h.6a15.66 15.66 0 0015.7-15.7v-1.2a16.63 16.63 0 00-2-7.7zM30.9 148h-.6v16.2l14.3 8.3a15.4 15.4 0 002-7.6v-1.2A15.66 15.66 0 0030.9 148z"/><path d="M114.3 213.2v-97.1l-84-48.5v97.1z" fill-opacity=".15" fill="#083b54"/><path d="M198.4 163.8v-97l-84 48.5v97.1z" fill-opacity=".05" fill="#083b54"/></svg>
+        </div>
+        <h1 id="header-text" class="pt2 pt0-l ma0 f3 fw2 montserrat aqua ttu flex-none no-select"></h1>
+      </header>
+      <main class="bg-white pv3 pa3 pa4-l flex-grow-1">
+          <div id="root"></div>
+      </main>
+      <script src="/dist/bundles/uiCommons.bundle.js"></script>
+      <script src="/dist/bundles/recoveryPage.bundle.js"></script>
+    </app>
+  </body>
+</html>

add-on/src/recovery/recovery.js

@@ -0,0 +1,78 @@
+'use strict'
+/* eslint-env browser, webextensions */
+
+import choo from 'choo'
+import html from 'choo/html/index.js'
+import icon from 'ipfs-css/icons/stroke_attention.svg'
+import browser, { i18n, runtime } from 'webextension-polyfill'
+import { renderCompanionLogo } from '../landing-pages/welcome/page.js'
+import createWelcomePageStore from '../landing-pages/welcome/store.js'
+import { optionsPage } from '../lib/constants.js'
+import './recovery.css'
+
+const app = choo()
+
+const learnMoreLink = html`<a class="no-underline" href="https://docs.ipfs.tech/how-to/companion-node-types/" target="_blank" rel="noopener noreferrer">${i18n.getMessage('recovery_page_learn_more')}</a>`
+
+const optionsPageLink = html`<a class="no-underline" id="learn-more" href="${optionsPage}" target="_blank" rel="noopener noreferrer">${i18n.getMessage('recovery_page_update_preferences')}</a>`
+
+// TODO (whizzzkid): refactor base store to be more generic.
+app.use(createWelcomePageStore(i18n, runtime))
+// Register our single route
+app.route('*', (state) => {
+  browser.runtime.sendMessage({ telemetry: { trackView: 'recovery' } })
+  const { hash } = window.location
+  const { href: publicURI } = new URL(decodeURIComponent(hash.slice(1)))
+  const { version } = browser.runtime.getManifest()
+
+  if (!publicURI) {
+    return
+  }
+
+  const openURLFromHash = () => {
+    try {
+      console.log('Opening URL from hash:', publicURI)
+      window.location.replace(publicURI)
+    } catch (err) {
+      console.error('Failed to open URL from hash:', err)
+    }
+  }
+
+  // if the IPFS node is online, open the URL from the hash, this will redirect to the local node.
+  if (state.isIpfsOnline) {
+    openURLFromHash()
+    return
+  }
+
+  return html`<div class="flex flex-column flex-row-l">
+    <div id="left-col" class="min-vh-100 flex flex-column justify-center items-center bg-navy white">
+      ${renderCompanionLogo(i18n, false)}
+      <p class="montserrat mt3 mb0 f3">${version}</p>
+    </div>
+
+    <div id="right-col" class="pt4 w-100 flex flex-column justify-around items-center">
+      <img src="${icon}" class="w4 h4" />
+      <h1 class="f3 fw6">${i18n.getMessage('recovery_page_sub_header')}</h1>
+      <p class="f3 fw5">${i18n.getMessage('recovery_page_message_p1')}</p>
+      <p class="f4 fw4">${i18n.getMessage('recovery_page_message_p2')}</p>
+      <p class="f4 fw4 w-100"><span class="b-ns">Public URL:</span> <a href="${publicURI}" rel="noopener noreferrer" target="_blank">${publicURI}</a></p>
+      <button
+        class="fade-in ba bw1 b--teal bg-teal snow f7 ph2 pv3 br4 ma1 pointer"
+        onclick=${openURLFromHash}
+        href="${publicURI}"
+      >
+        <span class="f5 fw6">${i18n.getMessage('recovery_page_button')}</span>
+      </button>
+      <p class="f5 fw2 pt6">
+        ${learnMoreLink} | ${optionsPageLink}
+      </span>
+    </div>
+  </div>`
+})
+
+// Start the application and render it to the given querySelector
+app.mount('#root')
+
+// Set page title and header translation
+document.getElementById('header-text').innerText = i18n.getMessage('recovery_page_header')
+document.title = i18n.getMessage('recovery_page_title')

test/functional/lib/ipfs-request-gateway-redirect.test.js

@@ -33,6 +33,7 @@ describe('modifyRequest.onBeforeRequest:', function () {
     global.URL = URL
     global.browser = browser
     browser.runtime.id = 'testid'
+    browser.runtime.getURL.returns('chrome-extension://testid/')
   })
 
   beforeEach(async function () {
@@ -425,6 +426,24 @@ describe('modifyRequest.onBeforeRequest:', function () {
     })
   })
 
+  describe('Recovers Page if node is unreachable', function () {
+    beforeEach(function () {
+      global.browser = browser
+      state.ipfsNodeType = 'external'
+      state.redirect = true
+      state.peerCount = -1
+      state.gwURLString = 'http://localhost:8080'
+      state.gwURL = new URL('http://localhost:8080')
+      state.pubGwURLString = 'https://ipfs.io'
+      state.pubGwURL = new URL('https://ipfs.io')
+    })
+    it('should present recovery page if node is offline', function () {
+      expect(state.nodeActive).to.be.equal(false)
+      const request = url2request('https://localhost:8080/ipfs/QmbWqxBEKC3P8tqsKc98xmWNzrzDtRLMiMPL8wBuTGsMnR/foo/bar')
+      expect(modifyRequest.onBeforeRequest(request).redirectUrl).to.equal('chrome-extension://testid/dist/recovery/recovery.html#https%3A%2F%2Fipfs.io%2Fipfs%2FQmbWqxBEKC3P8tqsKc98xmWNzrzDtRLMiMPL8wBuTGsMnR%2Ffoo%2Fbar')
+    })
+  })
+
   after(function () {
     delete global.URL
     delete global.browser

webpack.config.js

@@ -156,6 +156,7 @@ const uiConfig = merge(commonConfig, {
     browserAction: './add-on/src/popup/browser-action/index.js',
     importPage: './add-on/src/popup/quick-import.js',
     optionsPage: './add-on/src/options/options.js',
+    recoveryPage: './add-on/src/recovery/recovery.js',
     welcomePage: './add-on/src/landing-pages/welcome/index.js'
   },
   optimization: {