Improve script

source/background.js

@@ -1,3 +1,4 @@
+import 'webext-dynamic-content-scripts'
 import localforage from 'localforage'
 import { isEmpty } from './libs/utils'
 import { renderBadge } from './libs/browser'

source/content.css

@@ -30,10 +30,13 @@
   color: #edb200 !important;
 }
 
+/* close button */
 .qui-possede-les-medias-button {
+  cursor: pointer;
   background: none !important;
   color: white !important;
   border: none !important;
-  float: right !important;
+  float: left !important;
   margin: -1.5em !important;
+  font-size: 1em;
 }

source/content.js

@@ -1,4 +1,3 @@
-import 'webext-dynamic-content-scripts'
 import select from 'select-dom'
 import elementReady from 'element-ready'
 
@@ -27,7 +26,7 @@ async function init () {
 
   const button = document.createElement('button')
   button.className = 'qui-possede-les-medias-button'
-  button.innerHTML = '✖'
+  button.innerHTML = '×'
   button.addEventListener('click', (e) => e.currentTarget.parentNode.remove())
   box.appendChild(button)
 

source/libs/browser.js

@@ -18,7 +18,7 @@ export const queryPermission = async (permission) => {
 
 export const requestPermission = async (permission) => {
   try {
-    return browser.permissions.request({permissions: [permission]})
+    return browser.permissions.request({origins: [permission]})
   } catch (error) {
     console.log(error)
     return false

source/libs/utils.js

@@ -1,11 +1,6 @@
 export const isEmpty = variable => (!variable || variable.length === 0 || Object.getOwnPropertyNames(variable).length === 0)
 
-export const renderData = (data) => [
-  renderPlural(data.filter(entity => entity.type === 'group'), 'du groupe', 'des groupes'),
-  renderPlural(data.filter(entity => entity.type === 'holder'), 'appartient à', 'appartient à'),
-].join(' ')
-
-export const renderPlural = (data, preSingular, prePlural) => {
+export const renderPlural = (data) => {
   if (data.length < 1) {
     return null
   }
@@ -14,14 +9,14 @@ export const renderPlural = (data, preSingular, prePlural) => {
     : entity.name
   )
   if (data.length === 1) {
-    return `${preSingular} ${data.pop()}`
+    return data.pop()
   }
   if (typeof Intl !== 'undefined' && Intl.ListFormat) {
     const lf = new Intl.ListFormat('fr')
-    return `${prePlural} ${lf.format(data)}`
+    return lf.format(data)
   }
   const last = data.pop()
-  return prePlural + ' ' + [
+  return [
     data.join(', '),
     last
   ].join(' et ')
@@ -30,6 +25,6 @@ export const renderPlural = (data, preSingular, prePlural) => {
 export const renderText = (data) => {
   const text = document.createElement('p')
   text.className = 'qui-possede-les-medias-text'
-  text.innerHTML = `Ce média ${renderData(data)}.`
+  text.innerHTML = `Ce média appartient à ${renderPlural(data)}.`
   return text
 }