Two buttons: share files, go to my node

ipfs · Jul 2, 2020 · 931cd00 · 931cd00
1 parent 765df30
commit 931cd00
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 17 deletions.
diff --git a/add-on/_locales/en/messages.json b/add-on/_locales/en/messages.json
@@ -40,11 +40,11 @@
     "description": "A menu item in Browser Action pop-up (panel_quickImport)"
   },
   "panel_openWebui": {
-    "message": "Go to node",
+    "message": "Go to my node",
     "description": "A menu item in Browser Action pop-up (panel_openWebui)"
   },
   "panel_redirectToggle": {
-    "message": "F",
+    "message": "Fetch all sites via IPFS",
     "description": "A menu item in Browser Action pop-up (panel_redirectToggle)"
   },
   "panel_redirectToggleTooltip": {
@@ -56,7 +56,7 @@
     "description": "A menu item in Browser Action pop-up (panel_toolsSectionHeader)"
   },
   "panel_openPreferences": {
-    "message": "Open Preferences of Browser Extension",
+    "message": "Preferences",
     "description": "A menu item in Browser Action pop-up (panel_openPreferences)"
   },
   "panel_activeTabSectionHeader": {

diff --git a/add-on/src/popup/browser-action/page.js b/add-on/src/popup/browser-action/page.js
@@ -26,7 +26,7 @@ module.exports = function browserActionPage (state, emit) {
 
   const headerProps = Object.assign({ onToggleActive, onOpenPrefs, onOpenWelcomePage }, state)
   const activeTabActionsProps = Object.assign({ onViewOnGateway, onToggleSiteIntegrations, onCopy, onPin, onUnPin }, state)
-  const opsProps = Object.assign({ onQuickImport, onOpenWebUi, onToggleGlobalRedirect }, state)
+  const opsProps = Object.assign({ onQuickImport, onOpenPrefs, onOpenWebUi, onToggleGlobalRedirect }, state)
 
   return html`
     <div class="sans-serif" style="text-rendering: optimizeLegibility;">

diff --git a/add-on/src/popup/browser-action/tools-button.js b/add-on/src/popup/browser-action/tools-button.js
@@ -2,10 +2,9 @@
 /* eslint-env browser, webextensions */
 
 const html = require('choo/html')
-const switchToggle = require('../../pages/components/switch-toggle')
 
-function toolsButton ({ icon, text, title, disabled, style, onClick, switchValue }) {
-  let buttonStyle = 'teal button-reset db bg-white b--none outline-0--focus pv2 ph3 tc mh1 br-pill f6 tl'
+function toolsButton ({ icon, text, title, disabled, style, onClick }) {
+  let buttonStyle = 'teal button-reset db bg-white b--none outline-0--focus pv1 ph2 tc mh1 br-pill f6 tl'
   if (disabled) {
     buttonStyle += ' o-40'
   } else {
@@ -20,9 +19,9 @@ function toolsButton ({ icon, text, title, disabled, style, onClick, switchValue
 
   return html`
 
-    <button class="inline-flex flex-row items-center ${buttonStyle}"
+    <button class="inline-flex items-center w-50 ${buttonStyle}"
             onclick=${disabled ? null : onClick}  title="${title || ''}" ${disabled ? 'disabled' : ''}>
-      <div class="tc truncate">${text}</div>${switchToggle({ checked: switchValue, disabled, style: 'fr ml2' })}
+      <div class="w-100 tc truncate">${text}</div>
     </button>
   `
 }

diff --git a/add-on/src/popup/browser-action/tools.js b/add-on/src/popup/browser-action/tools.js
@@ -6,6 +6,7 @@ const html = require('choo/html')
 const toolsButton = require('./tools-button')
 const toolsItem = require('./tools-item')
 
+
 module.exports = function tools ({
   active,
   redirect,
@@ -21,7 +22,7 @@ module.exports = function tools ({
   const activeRedirectSwitch = active && ipfsNodeType !== 'embedded'
 
   return html`
-    <div class="bg-aqua-muted pv1 ph1 br bl bb bw1 b--white flex">
+    <div class="bg-aqua-muted pv1 br bl bb bw1 b--white flex">
       ${toolsButton({
         text: browser.i18n.getMessage('panel_quickImport'),
         disabled: !activeQuickImport,
@@ -32,13 +33,15 @@ module.exports = function tools ({
         disabled: !activeWebUI,
         onClick: onOpenWebUi
       })}
-      ${toolsItem({
-        text: browser.i18n.getMessage('panel_redirectToggle'),
-        title: browser.i18n.getMessage('panel_redirectToggleTooltip'),
-        disabled: !activeRedirectSwitch,
-        switchValue: redirect && activeRedirectSwitch,
-        onClick: onToggleGlobalRedirect
-      })}
+    </div>
+    <div>
+    ${toolsItem({
+      text: browser.i18n.getMessage('panel_redirectToggle'),
+      title: browser.i18n.getMessage('panel_redirectToggleTooltip'),
+      disabled: !activeRedirectSwitch,
+      switchValue: redirect && activeRedirectSwitch,
+      onClick: onToggleGlobalRedirect
+    })}
     </div>
   `
 }