From f1255b9348df8245d5ba69de43e4db7d11681087 Mon Sep 17 00:00:00 2001 From: wanhose Date: Sat, 5 Oct 2024 17:17:46 +0200 Subject: [PATCH 01/30] chore(browser-extension): upgrade manifest version --- packages/browser-extension/src/manifest.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/browser-extension/src/manifest.json b/packages/browser-extension/src/manifest.json index 4039f6e..43c746a 100644 --- a/packages/browser-extension/src/manifest.json +++ b/packages/browser-extension/src/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 3, "name": "Cookie Dialog Monster", - "version": "7.3.2", + "version": "7.3.3", "default_locale": "en", "description": "__MSG_appDesc__", "icons": { @@ -10,7 +10,7 @@ "128": "assets/icons/128.png" }, "action": { - "default_icon": "assets/icons/disabled.png", + "default_icon": "assets/icons/off.png", "default_title": "Cookie Dialog Monster" }, "options_page": "options.html", -- 2.45.2 From 69831ab07dc9d50872487b6e8fdce53cebd3ea71 Mon Sep 17 00:00:00 2001 From: wanhose Date: Sat, 5 Oct 2024 17:18:14 +0200 Subject: [PATCH 02/30] refactor(browser-extension): assets naming --- .../src/assets/icons/{disabled.png => off.png} | Bin .../src/assets/icons/{enabled.png => on.png} | Bin .../browser-extension/src/assets/icons/warn.png | Bin 0 -> 1493 bytes 3 files changed, 0 insertions(+), 0 deletions(-) rename packages/browser-extension/src/assets/icons/{disabled.png => off.png} (100%) rename packages/browser-extension/src/assets/icons/{enabled.png => on.png} (100%) create mode 100644 packages/browser-extension/src/assets/icons/warn.png diff --git a/packages/browser-extension/src/assets/icons/disabled.png b/packages/browser-extension/src/assets/icons/off.png similarity index 100% rename from packages/browser-extension/src/assets/icons/disabled.png rename to packages/browser-extension/src/assets/icons/off.png diff --git a/packages/browser-extension/src/assets/icons/enabled.png b/packages/browser-extension/src/assets/icons/on.png similarity index 100% rename from packages/browser-extension/src/assets/icons/enabled.png rename to packages/browser-extension/src/assets/icons/on.png diff --git a/packages/browser-extension/src/assets/icons/warn.png b/packages/browser-extension/src/assets/icons/warn.png new file mode 100644 index 0000000000000000000000000000000000000000..829e21d08e80132f204715e6143b6e34350f1fcd GIT binary patch literal 1493 zcmV;`1uFW9P)CzJO;Q3Tc#Yr1QzFS7oGfgzwe}U-A5RLYqr|6k)DboC8MsSX05L#)wakFa% za0n!n`)AT{m!GU?_z!8W%SlGU2d;oOlP@WL?SP~J%0Wh<7;q)Am4vsihQM;lh9b>N zCnclDjF953oDJYIH>NOpc28DdqJeKxWG?>FLTxLmsBPt=)YrN{qfAmRwB+sq6c@%6 zn#q?1agrv>Fz}xjEi}39>Bln4B!yA83kJZ@m_n``8O=~S&6pL!y9Sr3i@RaEmf*ea;G|O){$A<1 zjj@|y#ED_;E)R9RR7yu{$|zW0G-beo^+nXVwu}O=&$e9~l44OJi4}^^GcNqhLr2!k zP1O2>RSW3E#!~9tW}k3Qx%Z=)baGQE9jvNI>~m~g87Z&F;!xp>aNok^~;KcqzdO8oF10>hVXdQjKAqcAY<&m_ zZ)gd~<^O6JN!Vw1a-0hsLRJ8B;e%BR%suRJh#%6;K$o1jpHFzI4Cq)@?ko&ZgeDlE zBt+xMVc82#*Op9~0fE{Qo0E@Wpy*Zzof_e?m6E>gGpJ>8rR(5Z7FU|OZ49`m zr07sm^rQ=+MuqT>LeXyLLQYJ#4LGr})Jg2OhopE@qi9NFfTt?tFDmEyYNv>M!>`NI zm%qvIZ_DOU$ZH?_3gN5Ey9(xnB~+&wrpI!jaFdfny1ZkCD@GhzI-f3m;;@Gx)Mf;p z@I-@H7!weu?Gy%g7ExzS*`&dDu5~z?#4lLkhJw3o4TyO`bcB7d&e8pVo7|RSYG2{p z8|^F0&Bmx5=#F71tWgq<8cr#UVoCgAZj&R|#`)j(XVIxwOX$d&a%!!vp#6_jn#|pm zzvJI{O*T5UguOwW4xxs^<&F&)cf}l0D0<>|2D&yZhLsfm@SbU}klB!uP{)Il^1?HA zP0kGtA&e@7)n*Q&c+bd{cwk~9`1%&liz}I?#9Ua#fR8F4ypY&4d02Cc%!f=UB4LE} zN Date: Sat, 5 Oct 2024 17:20:32 +0200 Subject: [PATCH 03/30] feat(browser-extension): add issue banner to popup giving user some information about what's wrong and where to find the issue easily --- packages/browser-extension/src/popup.html | 270 ++++++++++-------- .../browser-extension/src/scripts/popup.js | 39 ++- .../browser-extension/src/styles/popup.css | 19 +- 3 files changed, 199 insertions(+), 129 deletions(-) diff --git a/packages/browser-extension/src/popup.html b/packages/browser-extension/src/popup.html index 7e8316b..124dd52 100644 --- a/packages/browser-extension/src/popup.html +++ b/packages/browser-extension/src/popup.html @@ -29,129 +29,157 @@
- - - - - - - - - - - - - - - - - - - - -
diff --git a/packages/browser-extension/src/scripts/popup.js b/packages/browser-extension/src/scripts/popup.js index 27ad6a6..4988025 100644 --- a/packages/browser-extension/src/scripts/popup.js +++ b/packages/browser-extension/src/scripts/popup.js @@ -1,3 +1,15 @@ +/** + * @typedef {Object} ExtensionState + * @property {boolean} on + * @property {ExtensionIssue} [issue] + */ + +/** + * @typedef {Object} PopupState + * @extends {ExtensionState} + * @property {number} [tabId] + */ + if (typeof browser === 'undefined') { browser = chrome; } @@ -46,10 +58,10 @@ const isEdge = navigator.userAgent.indexOf('Edg') !== -1; const isFirefox = navigator.userAgent.indexOf('Firefox') !== -1; /** - * @description Extension state - * @type {{ enabled: boolean, tabId: number | undefined }} + * @description Popup state + * @type {PopupState} */ -let state = { enabled: true, tabId: undefined }; +let state = { on: true }; /** * @async @@ -63,9 +75,22 @@ async function handleContentLoaded() { ? new URL(tab.url).hostname.split('.').slice(-3).join('.').replace('www.', '') : undefined; - const next = await browser.runtime.sendMessage({ hostname, type: 'GET_HOSTNAME_STATE' }); + const next = await browser.runtime.sendMessage({ hostname, type: 'GET_STATE' }); state = { ...(next ?? state), tabId: tab?.id }; + if (state.issue?.url) { + const issueBanner = document.getElementById('issue-banner'); + issueBanner.removeAttribute('aria-hidden'); + + const issueBannerText = document.getElementById('issue-banner-text'); + if (state.issue.flags.includes('wontfix')) + issueBannerText.innerText = browser.i18n.getMessage('popup_bannerIssueWontFix'); + else issueBannerText.innerText = browser.i18n.getMessage('popup_bannerIssueOpen'); + + const issueBannerUrl = document.getElementById('issue-banner-url'); + issueBannerUrl.setAttribute('href', state.issue.url); + } + const hostTextElement = document.getElementById('host'); hostTextElement.innerText = hostname ?? 'unknown'; @@ -83,7 +108,7 @@ async function handleContentLoaded() { const powerButtonElement = document.getElementById('power-option'); powerButtonElement?.addEventListener('click', handlePowerToggle); - if (state.enabled) powerButtonElement?.setAttribute('data-value', 'on'); + if (state.on) powerButtonElement?.setAttribute('data-value', 'on'); else powerButtonElement?.setAttribute('data-value', 'off'); const rateButtonElement = document.getElementById('rate-option'); @@ -150,9 +175,9 @@ async function handleLinkRedirect(event) { * @returns {void} */ function handlePowerToggle() { - const next = { enabled: !state.enabled }; + const next = { on: !state.on }; - browser.runtime.sendMessage({ hostname, state: next, type: 'SET_HOSTNAME_STATE' }); + browser.runtime.sendMessage({ hostname, state: next, type: 'UPDATE_STORE' }); browser.tabs.reload(state.tabId, { bypassCache: true }); window.close(); } diff --git a/packages/browser-extension/src/styles/popup.css b/packages/browser-extension/src/styles/popup.css index aaefc85..fe3342b 100644 --- a/packages/browser-extension/src/styles/popup.css +++ b/packages/browser-extension/src/styles/popup.css @@ -59,7 +59,24 @@ header { padding: 0 16px; } -main { +main > .banner { + background-color: #f39c12; + color: #c0392b; + margin: 0px; + padding: 16px; + + &[aria-hidden='true'] { + display: none; + } + + & #issue-banner-url { + color: inherit; + display: inline-block; + vertical-align: middle; + } +} + +main > .content { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; -- 2.45.2 From 1c4928d89e8a0556d3467305ee6e0a9968cc9fa6 Mon Sep 17 00:00:00 2001 From: wanhose Date: Sat, 5 Oct 2024 17:21:50 +0200 Subject: [PATCH 04/30] feat(browser-extension): add request batching, issue details fetching and minor refactors to scripts --- .../src/scripts/background.js | 206 ++++++++++++++---- .../browser-extension/src/scripts/content.js | 34 +-- .../browser-extension/src/scripts/options.js | 16 +- 3 files changed, 195 insertions(+), 61 deletions(-) diff --git a/packages/browser-extension/src/scripts/background.js b/packages/browser-extension/src/scripts/background.js index 069ddc2..362111d 100644 --- a/packages/browser-extension/src/scripts/background.js +++ b/packages/browser-extension/src/scripts/background.js @@ -1,7 +1,49 @@ +/** + * @typedef {Object} ExtensionIssue + * @property {number} [expiresIn] + * @property {string[]} [flags] + * @property {string} [url] + */ + +/** + * @typedef {Object} ExtensionState + * @property {ExtensionIssue} issue + * @property {boolean} on + */ + if (typeof browser === 'undefined') { browser = chrome; } +/** + * @description Class for request batching + */ +class RequestManager { + constructor() { + this.requests = new Map(); // Store ongoing requests + } + + /** + * @description Fetch wrapper to play with the request map + * @param {string} input + * @param {RequestInit} [init] + * @returns {Promise} + */ + fetchData(input, init) { + if (this.requests.has(input)) { + return this.requests.get(input); + } + + const promise = fetch(input, init) + .then((response) => response.json()) + .finally(() => this.requests.delete(input)); + + this.requests.set(input, promise); + + return promise; + } +} + /** * @description API URL * @type {string} @@ -20,6 +62,11 @@ const extensionMenuItemId = 'CDM-MENU'; */ const reportMenuItemId = 'CDM-REPORT'; +/** + * @description Request manager instance + */ +const requestManager = new RequestManager(); + /** * @description Context menu identifier * @type {string} @@ -32,6 +79,12 @@ const settingsMenuItemId = 'CDM-SETTINGS'; */ const script = browser.scripting; +/** + * @description Default value for extension state + * @type {ExtensionState} + */ +const stateByDefault = { issue: { expiresIn: 0 }, on: true }; + /** * @description The storage to use * @type {browser.storage.LocalStorageArea} @@ -43,6 +96,34 @@ const storage = browser.storage.local; */ const suppressLastError = () => void browser.runtime.lastError; +/** + * @async + * @description Enable extension icon + * @param {number} tabId + * @returns {Promise} + */ +async function enableIcon(hostname, tabId) { + const state = await getState(hostname); + const path = state.issue.url ? '/assets/icons/warn.png' : '/assets/icons/on.png'; + + await browser.action.setIcon({ path, tabId }, suppressLastError); +} + +/** + * @async + * @description Get database + * @returns {Promise} + */ +async function getData() { + const { data } = await storage.get('data'); + + if (!data) { + return await refreshData(); + } + + return data; +} + /** * @description Calculate current hostname * @param {string} url @@ -52,6 +133,22 @@ function getHostname(url) { return new URL(url).hostname.split('.').slice(-3).join('.').replace('www.', ''); } +/** + * @async + * @description Get state for the given hostname + * @param {string} hostname + * @returns {Promise} + */ +async function getState(hostname) { + const { [hostname]: state = stateByDefault } = await storage.get(hostname); + + if ((state.issue && Date.now() > state.issue.expiresIn) || !state.issue?.expiresIn) { + state.issue = await refreshIssue(hostname); + } + + return state; +} + /** * @description Format number to avoid errors * @param {number} [value] @@ -81,20 +178,45 @@ function matchToPattern(match) { } /** + * @async * @description Refresh data - * @param {void?} callback - * @returns {void} + * @returns {Promise} */ -function refreshData(callback) { +async function refreshData() { try { - fetch(`${apiUrl}/data/`).then((result) => { - result.json().then(({ data }) => { - storage.set({ data }, suppressLastError); - callback?.(data); - }); - }); + const { data } = await requestManager.fetchData(`${apiUrl}/data/`); + + await triggerStoreUpdate('data', data); + + return data; } catch { - refreshData(callback); + return await refreshData(); + } +} + +/** + * @async + * @description Refresh issues for the given hostname + * @param {string} hostname + * @returns {Promise} + */ +async function refreshIssue(hostname) { + try { + const { data } = await requestManager.fetchData(`${apiUrl}/issues/${hostname}`); + + if (Object.keys(data).length === 0) { + await triggerStoreUpdate(hostname, { issue: { expiresIn: Date.now() + 8 * 60 * 60 * 1000 } }); + + return undefined; + } + + const issue = { expiresIn: Date.now() + 4 * 60 * 60 * 1000, flags: data.flags, url: data.url }; + + await triggerStoreUpdate(hostname, { issue }); + + return data; + } catch { + return await refreshData(); } } @@ -104,9 +226,9 @@ function refreshData(callback) { * @param {any} message * @param {browser.tabs.Tab} tab * @param {void?} callback - * @returns {void} + * @returns {Promise} */ -async function report(message, tab, callback) { +async function report(message) { try { const reason = message.reason; const url = message.url; @@ -114,14 +236,29 @@ async function report(message, tab, callback) { const version = browser.runtime.getManifest().version; const body = JSON.stringify({ reason, url, userAgent, version }); const headers = { 'Cache-Control': 'no-cache', 'Content-type': 'application/json' }; + const requestInit = { body, headers, method: 'POST' }; - const response = await fetch(`${apiUrl}/report/`, { body, headers, method: 'POST' }); - callback?.((await response.json()).data); + return (await requestManager.fetchData(`${apiUrl}/report/`, requestInit)).data; } catch { console.error("Can't send report"); } } +/** + * @async + * @description Update extension store for a given key + * @param {string} [key] + * @param {Object} value + * @returns {Promise} + */ +async function triggerStoreUpdate(key, value) { + if (key) { + const { [key]: prev } = await storage.get(key); + + await storage.set({ [key]: { ...prev, ...value } }, suppressLastError); + } +} + /** * @description Listen to context menus clicked */ @@ -153,13 +290,11 @@ browser.runtime.onMessage.addListener((message, sender, callback) => { switch (message.type) { case 'DISABLE_ICON': if (isPage && tabId !== undefined) { - browser.action.setIcon({ path: '/assets/icons/disabled.png', tabId }, suppressLastError); + browser.action.setIcon({ path: '/assets/icons/off.png', tabId }, suppressLastError); } break; case 'ENABLE_ICON': - if (isPage && tabId !== undefined) { - browser.action.setIcon({ path: '/assets/icons/enabled.png', tabId }, suppressLastError); - } + if (isPage && tabId !== undefined) enableIcon(hostname, tabId); break; case 'ENABLE_POPUP': if (isPage && tabId !== undefined) { @@ -167,24 +302,19 @@ browser.runtime.onMessage.addListener((message, sender, callback) => { } break; case 'GET_DATA': - storage.get('data', ({ data }) => { - if (data) callback(data); - else refreshData(callback); - }); + getData().then(callback); return true; case 'GET_EXCLUSION_LIST': storage.get(null, (exclusions) => { const exclusionList = Object.entries(exclusions || {}).flatMap((exclusion) => - exclusion[0] !== 'data' && !exclusion[1]?.enabled ? [exclusion[0]] : [] + exclusion[0] !== 'data' && !exclusion[1]?.on ? [exclusion[0]] : [] ); callback(exclusionList); }); return true; - case 'GET_HOSTNAME_STATE': + case 'GET_STATE': if (hostname) { - storage.get(hostname, (state) => { - callback(state[hostname] ?? { enabled: true }); - }); + getState(hostname).then(callback); return true; } break; @@ -199,25 +329,22 @@ browser.runtime.onMessage.addListener((message, sender, callback) => { } break; case 'REFRESH_DATA': - refreshData(callback); + refreshData().then(callback); return true; case 'REPORT': if (tabId !== undefined) { - report(message, sender.tab, callback); + report(message).then(callback); return true; } break; - case 'SET_BADGE': + case 'UPDATE_BADGE': if (isPage && tabId !== undefined) { browser.action.setBadgeBackgroundColor({ color: '#6b7280' }); browser.action.setBadgeText({ tabId, text: formatNumber(message.value) }); } break; - case 'SET_HOSTNAME_STATE': - if (hostname) { - if (message.state.enabled === false) storage.set({ [hostname]: message.state }); - else storage.remove(hostname); - } + case 'UPDATE_STORE': + triggerStoreUpdate(hostname, message.state); break; default: break; @@ -285,8 +412,9 @@ browser.webRequest.onBeforeRequest.addListener( return; } + const data = await getData(); const hostname = getHostname(url); - const { data, [hostname]: state = { enabled: true } } = await storage.get(['data', hostname]); + const state = await getState(hostname); if (data?.rules?.length) { const rules = data.rules.map((rule) => ({ @@ -295,7 +423,7 @@ browser.webRequest.onBeforeRequest.addListener( })); await browser.declarativeNetRequest.updateSessionRules({ - addRules: state.enabled ? rules : undefined, + addRules: state.on ? rules : undefined, removeRuleIds: data.rules.map((rule) => rule.id), }); } @@ -313,9 +441,9 @@ browser.webRequest.onErrorOccurred.addListener( if (error === 'net::ERR_BLOCKED_BY_CLIENT' && tabId > -1) { const hostname = getHostname(url); - const { [hostname]: state = { enabled: true } } = await storage.get(hostname); + const state = await getState(hostname); - if (state.enabled) { + if (state.on) { await browser.tabs.sendMessage(tabId, { type: 'INCREASE_ACTIONS_COUNT' }); } } diff --git a/packages/browser-extension/src/scripts/content.js b/packages/browser-extension/src/scripts/content.js index 5f4a0fc..582a4c0 100644 --- a/packages/browser-extension/src/scripts/content.js +++ b/packages/browser-extension/src/scripts/content.js @@ -6,6 +6,12 @@ * @property {{ backdrops: string[], classes: string[], containers: string[], selectors: string[] }} tokens */ +/** + * @typedef {Object} ExtensionState + * @property {boolean} on + * @property {ExtensionIssue} [issue] + */ + /** * @typedef {Object} Fix * @property {string} action @@ -91,9 +97,9 @@ const seen = new Set(); /** * @description Extension state - * @type {{ enabled: boolean }} + * @type {ExtensionState} */ -let state = { enabled: true }; +let state = { on: true }; /** * @description Clean DOM @@ -115,8 +121,8 @@ function clean(elements, skipMatch) { if (element instanceof HTMLDialogElement) element.close(); hide(element); - actions.add(new Date().getTime().toString()); - dispatch({ type: 'SET_BADGE', value: actions.size }); + actions.add(`${Date.now()}`); + dispatch({ type: 'UPDATE_BADGE', value: actions.size }); } seen.add(element); @@ -295,7 +301,7 @@ function fix() { for (const backdrop of backdrops) { if (backdrop.children.length === 0 && !seen.has(backdrop)) { - actions.add(new Date().getTime().toString()); + actions.add(`${Date.now()}`); seen.add(backdrop); hide(backdrop); } @@ -366,7 +372,7 @@ function fix() { t4Wrapper.removeAttribute('inert'); } - dispatch({ type: 'SET_BADGE', value: actions.size }); + dispatch({ type: 'UPDATE_BADGE', value: actions.size }); } /** @@ -390,7 +396,7 @@ function hide(element) { function run(params = {}) { const { containers, elements, skipMatch } = params; - if (document.body?.children.length && state.enabled && tokens.selectors.length) { + if (document.body?.children.length && state.on && tokens.selectors.length) { fix(); if (elements?.length) { @@ -409,10 +415,10 @@ function run(params = {}) { * @param {SetUpParams} [params] */ async function setUp(params = {}) { - state = (await dispatch({ hostname, type: 'GET_HOSTNAME_STATE' })) ?? state; + state = (await dispatch({ hostname, type: 'GET_STATE' })) ?? state; dispatch({ type: 'ENABLE_POPUP' }); - if (state.enabled) { + if (state.on) { const data = await dispatch({ hostname, type: 'GET_DATA' }); commonWords = data?.commonWords ?? commonWords; @@ -420,13 +426,13 @@ async function setUp(params = {}) { skips = data?.skips ?? skips; tokens = data?.tokens ?? tokens; - dispatch({ type: 'ENABLE_ICON' }); - dispatch({ type: 'SET_BADGE', value: actions.size }); + dispatch({ hostname, type: 'ENABLE_ICON' }); + dispatch({ type: 'UPDATE_BADGE', value: actions.size }); observer.observe(document.body ?? document.documentElement, options); if (!params.skipRunFn) run({ containers: tokens.containers }); } else { dispatch({ type: 'DISABLE_ICON' }); - dispatch({ type: 'SET_BADGE', value: actions.size }); + dispatch({ type: 'UPDATE_BADGE', value: actions.size }); observer.disconnect(); } } @@ -449,7 +455,7 @@ async function setUpAfterWaitForBody() { * @type {MutationObserver} */ const observer = new MutationObserver((mutations) => { - if (!state.enabled || !tokens.selectors.length) { + if (!state.on || !tokens.selectors.length) { return; } @@ -466,7 +472,7 @@ const observer = new MutationObserver((mutations) => { browser.runtime.onMessage.addListener(async (message) => { switch (message.type) { case 'INCREASE_ACTIONS_COUNT': { - actions.add(new Date().getTime().toString()); + actions.add(`${Date.now()}`); break; } } diff --git a/packages/browser-extension/src/scripts/options.js b/packages/browser-extension/src/scripts/options.js index 619772f..3e5247b 100644 --- a/packages/browser-extension/src/scripts/options.js +++ b/packages/browser-extension/src/scripts/options.js @@ -62,8 +62,8 @@ async function handleAddClick() { if (exclusionValue?.trim() && (domainRx.test(exclusionValue) || exclusionValue === 'localhost')) { const filterInputElement = document.getElementById('filter-input'); - const state = { enabled: false }; - await dispatch({ hostname: exclusionValue, state, type: 'SET_HOSTNAME_STATE' }); + const state = { on: false }; + await dispatch({ hostname: exclusionValue, state, type: 'UPDATE_STORE' }); exclusionList = [...new Set([...exclusionList, exclusionValue])].sort(); createList(); @@ -80,8 +80,8 @@ async function handleClearClick() { const filterInputElement = document.getElementById('filter-input'); for (const exclusionValue of exclusionList) { - const state = { enabled: true }; - await dispatch({ hostname: exclusionValue, state, type: 'SET_HOSTNAME_STATE' }); + const state = { on: true }; + await dispatch({ hostname: exclusionValue, state, type: 'UPDATE_STORE' }); } exclusionList = []; @@ -128,9 +128,9 @@ async function handleDeleteClick(event) { const filterInputElement = document.getElementById('filter-input'); const { value } = event.currentTarget.parentElement.dataset; const itemElement = document.querySelector(`[data-value="${value}"]`); - const state = { enabled: true }; + const state = { on: true }; - await dispatch({ hostname: value, state, type: 'SET_HOSTNAME_STATE' }); + await dispatch({ hostname: value, state, type: 'UPDATE_STORE' }); exclusionList = exclusionList.filter((exclusionValue) => exclusionValue !== value); itemElement?.remove(); updateList(filterInputElement.value.trim()); @@ -172,8 +172,8 @@ function handleFileChange(event) { const newExclusionList = event.currentTarget.result.split('\n').filter((x) => x.trim()); for (const exclusionValue of newExclusionList) { - const state = { enabled: false }; - await dispatch({ hostname: exclusionValue, state, type: 'SET_HOSTNAME_STATE' }); + const state = { on: false }; + await dispatch({ hostname: exclusionValue, state, type: 'UPDATE_STORE' }); } if (newExclusionList.length) { -- 2.45.2 From 79d6d84774c773675559cec55dd98957214ec71a Mon Sep 17 00:00:00 2001 From: wanhose Date: Sat, 5 Oct 2024 17:32:48 +0200 Subject: [PATCH 05/30] feat(browser-extension): add issue banner translations --- packages/browser-extension/src/_locales/de/messages.json | 6 ++++++ packages/browser-extension/src/_locales/en/messages.json | 6 ++++++ packages/browser-extension/src/_locales/es/messages.json | 6 ++++++ packages/browser-extension/src/_locales/fr/messages.json | 6 ++++++ packages/browser-extension/src/_locales/it/messages.json | 6 ++++++ packages/browser-extension/src/_locales/pl/messages.json | 6 ++++++ packages/browser-extension/src/_locales/pt_BR/messages.json | 6 ++++++ packages/browser-extension/src/_locales/pt_PT/messages.json | 6 ++++++ packages/browser-extension/src/_locales/ro/messages.json | 6 ++++++ packages/browser-extension/src/_locales/ru/messages.json | 6 ++++++ 10 files changed, 60 insertions(+) diff --git a/packages/browser-extension/src/_locales/de/messages.json b/packages/browser-extension/src/_locales/de/messages.json index 67a465f..65421a2 100644 --- a/packages/browser-extension/src/_locales/de/messages.json +++ b/packages/browser-extension/src/_locales/de/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Liste importieren" }, + "popup_bannerIssueOpen": { + "message": "Ein Problem wurde für diese Seite gemeldet. Die Erweiterung funktioniert möglicherweise vorübergehend nicht wie erwartet. Verfolgen Sie das Problem oder fügen Sie weitere Informationen hinzu." + }, + "popup_bannerIssueWontFix": { + "message": "Ein Problem wurde für diese Seite gemeldet, wird jedoch nicht behoben. Bitte beachten Sie, dass die Erweiterung auf dieser Seite möglicherweise nicht wie erwartet funktioniert. Wir empfehlen dringend, die Erweiterung über die Schaltfläche unten zu deaktivieren." + }, "popup_contributeOption": { "message": "Zu diesem Projekt beitragen" }, diff --git a/packages/browser-extension/src/_locales/en/messages.json b/packages/browser-extension/src/_locales/en/messages.json index f55a197..203e950 100644 --- a/packages/browser-extension/src/_locales/en/messages.json +++ b/packages/browser-extension/src/_locales/en/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Import list" }, + "popup_bannerIssueOpen": { + "message": "An issue has been reported for this page. The extension may not work as expected temporarily. Follow the issue, or add more information" + }, + "popup_bannerIssueWontFix": { + "message": "An issue has been reported for this page, but it won't be fixed. Please be aware that the extension may not function as expected on this page. We highly recommend turning off the extension using the button below" + }, "popup_contributeOption": { "message": "Contribute to this project" }, diff --git a/packages/browser-extension/src/_locales/es/messages.json b/packages/browser-extension/src/_locales/es/messages.json index efd176f..724b5f4 100644 --- a/packages/browser-extension/src/_locales/es/messages.json +++ b/packages/browser-extension/src/_locales/es/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Importar lista" }, + "popup_bannerIssueOpen": { + "message": "Se ha informado de un problema en esta página. La extensión puede no funcionar como se espera temporalmente. Siga el problema o agregue más información." + }, + "popup_bannerIssueWontFix": { + "message": "Se ha informado de un problema en esta página, pero no se solucionará. Tenga en cuenta que la extensión puede no funcionar como se espera en esta página. Recomendamos encarecidamente desactivar la extensión utilizando el botón a continuación." + }, "popup_contributeOption": { "message": "Contribuir a este proyecto" }, diff --git a/packages/browser-extension/src/_locales/fr/messages.json b/packages/browser-extension/src/_locales/fr/messages.json index 501539a..bb45ea5 100644 --- a/packages/browser-extension/src/_locales/fr/messages.json +++ b/packages/browser-extension/src/_locales/fr/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Importer la liste" }, + "popup_bannerIssueOpen": { + "message": "Un problème a été signalé pour cette page. L'extension peut ne pas fonctionner comme prévu temporairement. Suivez le problème ou ajoutez plus d'informations." + }, + "popup_bannerIssueWontFix": { + "message": "Un problème a été signalé pour cette page, mais il ne sera pas résolu. Veuillez noter que l'extension pourrait ne pas fonctionner comme prévu sur cette page. Nous vous recommandons vivement de désactiver l'extension en utilisant le bouton ci-dessous." + }, "popup_contributeOption": { "message": "Contribuer à ce projet" }, diff --git a/packages/browser-extension/src/_locales/it/messages.json b/packages/browser-extension/src/_locales/it/messages.json index 14b5aab..ae1d199 100644 --- a/packages/browser-extension/src/_locales/it/messages.json +++ b/packages/browser-extension/src/_locales/it/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Importa lista" }, + "popup_bannerIssueOpen": { + "message": "È stato segnalato un problema per questa pagina. L'estensione potrebbe non funzionare temporaneamente come previsto. Segui il problema o aggiungi ulteriori informazioni." + }, + "popup_bannerIssueWontFix": { + "message": "È stato segnalato un problema per questa pagina, ma non verrà risolto. Si prega di notare che l'estensione potrebbe non funzionare come previsto su questa pagina. Si consiglia vivamente di disattivare l'estensione utilizzando il pulsante qui sotto." + }, "popup_contributeOption": { "message": "Contribuisci a questo progetto" }, diff --git a/packages/browser-extension/src/_locales/pl/messages.json b/packages/browser-extension/src/_locales/pl/messages.json index 38bc3d1..f43fcf0 100644 --- a/packages/browser-extension/src/_locales/pl/messages.json +++ b/packages/browser-extension/src/_locales/pl/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Importuj listę" }, + "popup_bannerIssueOpen": { + "message": "Zgłoszono problem z tą stroną. Rozszerzenie może tymczasowo nie działać zgodnie z oczekiwaniami. Śledź problem lub dodaj więcej informacji." + }, + "popup_bannerIssueWontFix": { + "message": "Zgłoszono problem z tą stroną, ale nie zostanie on naprawiony. Należy pamiętać, że rozszerzenie może nie działać zgodnie z oczekiwaniami na tej stronie. Zdecydowanie zalecamy wyłączenie rozszerzenia za pomocą poniższego przycisku." + }, "popup_contributeOption": { "message": "Wesprzyj ten projekt" }, diff --git a/packages/browser-extension/src/_locales/pt_BR/messages.json b/packages/browser-extension/src/_locales/pt_BR/messages.json index 5e5ea87..640d7a6 100644 --- a/packages/browser-extension/src/_locales/pt_BR/messages.json +++ b/packages/browser-extension/src/_locales/pt_BR/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Importar lista" }, + "popup_bannerIssueOpen": { + "message": "Um problema foi relatado para esta página. A extensão pode não funcionar conforme o esperado temporariamente. Acompanhe o problema ou adicione mais informações." + }, + "popup_bannerIssueWontFix": { + "message": "Um problema foi relatado para esta página, mas não será corrigido. Esteja ciente de que a extensão pode não funcionar conforme o esperado nesta página. Recomendamos desativar a extensão usando o botão abaixo." + }, "popup_contributeOption": { "message": "Contribuir para este projeto" }, diff --git a/packages/browser-extension/src/_locales/pt_PT/messages.json b/packages/browser-extension/src/_locales/pt_PT/messages.json index 46b2b18..cafabbc 100644 --- a/packages/browser-extension/src/_locales/pt_PT/messages.json +++ b/packages/browser-extension/src/_locales/pt_PT/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Importar lista" }, + "popup_bannerIssueOpen": { + "message": "Foi relatado um problema para esta página. A extensão pode não funcionar conforme o esperado temporariamente. Siga o problema ou adicione mais informações." + }, + "popup_bannerIssueWontFix": { + "message": "Foi relatado um problema para esta página, mas não será resolvido. Esteja ciente de que a extensão pode não funcionar conforme o esperado nesta página. Recomendamos desativar a extensão usando o botão abaixo." + }, "popup_contributeOption": { "message": "Contribuir para este projeto" }, diff --git a/packages/browser-extension/src/_locales/ro/messages.json b/packages/browser-extension/src/_locales/ro/messages.json index b71ebd8..3b5f5c3 100644 --- a/packages/browser-extension/src/_locales/ro/messages.json +++ b/packages/browser-extension/src/_locales/ro/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Importă lista" }, + "popup_bannerIssueOpen": { + "message": "A fost raportată o problemă pentru această pagină. Extensia poate să nu funcționeze temporar conform așteptărilor. Urmăriți problema sau adăugați mai multe informații." + }, + "popup_bannerIssueWontFix": { + "message": "A fost raportată o problemă pentru această pagină, dar nu va fi rezolvată. Rețineți că extensia poate să nu funcționeze conform așteptărilor pe această pagină. Vă recomandăm cu insistență să dezactivați extensia folosind butonul de mai jos." + }, "popup_contributeOption": { "message": "Contribuie la acest proiect" }, diff --git a/packages/browser-extension/src/_locales/ru/messages.json b/packages/browser-extension/src/_locales/ru/messages.json index 186abbb..bedb5dd 100644 --- a/packages/browser-extension/src/_locales/ru/messages.json +++ b/packages/browser-extension/src/_locales/ru/messages.json @@ -32,6 +32,12 @@ "options_importButton": { "message": "Импорт списка" }, + "popup_bannerIssueOpen": { + "message": "Для этой страницы было сообщено о проблеме. Расширение может временно не работать должным образом. Следите за проблемой или добавьте дополнительную информацию." + }, + "popup_bannerIssueWontFix": { + "message": "Для этой страницы было сообщено о проблеме, но она не будет исправлена. Обратите внимание, что расширение может работать некорректно на этой странице. Мы настоятельно рекомендуем отключить расширение, используя кнопку ниже." + }, "popup_contributeOption": { "message": "Содействовать этому проекту" }, -- 2.45.2 From c76192ffafe7a106b72207f9291256e2984a8d2b Mon Sep 17 00:00:00 2001 From: wanhose Date: Sat, 5 Oct 2024 18:30:25 +0200 Subject: [PATCH 06/30] fix(browser-extension): off/on performance --- packages/browser-extension/src/scripts/background.js | 4 ++-- packages/browser-extension/src/scripts/content.js | 7 +++---- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/packages/browser-extension/src/scripts/background.js b/packages/browser-extension/src/scripts/background.js index 362111d..a68ddf5 100644 --- a/packages/browser-extension/src/scripts/background.js +++ b/packages/browser-extension/src/scripts/background.js @@ -7,7 +7,7 @@ /** * @typedef {Object} ExtensionState - * @property {ExtensionIssue} issue + * @property {ExtensionIssue} [issue] * @property {boolean} on */ @@ -146,7 +146,7 @@ async function getState(hostname) { state.issue = await refreshIssue(hostname); } - return state; + return { ...stateByDefault, ...state }; } /** diff --git a/packages/browser-extension/src/scripts/content.js b/packages/browser-extension/src/scripts/content.js index 582a4c0..55f00de 100644 --- a/packages/browser-extension/src/scripts/content.js +++ b/packages/browser-extension/src/scripts/content.js @@ -7,9 +7,8 @@ */ /** - * @typedef {Object} ExtensionState + * @typedef {Object} ContentState * @property {boolean} on - * @property {ExtensionIssue} [issue] */ /** @@ -97,7 +96,7 @@ const seen = new Set(); /** * @description Extension state - * @type {ExtensionState} + * @type {ContentState} */ let state = { on: true }; @@ -415,7 +414,7 @@ function run(params = {}) { * @param {SetUpParams} [params] */ async function setUp(params = {}) { - state = (await dispatch({ hostname, type: 'GET_STATE' })) ?? state; + state = await dispatch({ hostname, type: 'GET_STATE' }); dispatch({ type: 'ENABLE_POPUP' }); if (state.on) { -- 2.45.2 From c1d2a3d93a74f6741e4ad0f49bb3e07655a4db94 Mon Sep 17 00:00:00 2001 From: wanhose Date: Tue, 8 Oct 2024 01:46:47 +0200 Subject: [PATCH 07/30] feat(browser-extension): switch to warn mode after reporting an issue --- packages/browser-extension/src/scripts/background.js | 9 ++++++--- packages/browser-extension/src/scripts/dialog.js | 3 +++ 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/packages/browser-extension/src/scripts/background.js b/packages/browser-extension/src/scripts/background.js index a68ddf5..6b55bb7 100644 --- a/packages/browser-extension/src/scripts/background.js +++ b/packages/browser-extension/src/scripts/background.js @@ -294,7 +294,10 @@ browser.runtime.onMessage.addListener((message, sender, callback) => { } break; case 'ENABLE_ICON': - if (isPage && tabId !== undefined) enableIcon(hostname, tabId); + if (isPage && tabId !== undefined) { + enableIcon(hostname, tabId).then(callback); + return true; + } break; case 'ENABLE_POPUP': if (isPage && tabId !== undefined) { @@ -344,8 +347,8 @@ browser.runtime.onMessage.addListener((message, sender, callback) => { } break; case 'UPDATE_STORE': - triggerStoreUpdate(hostname, message.state); - break; + triggerStoreUpdate(hostname, message.state).then(callback); + return true; default: break; } diff --git a/packages/browser-extension/src/scripts/dialog.js b/packages/browser-extension/src/scripts/dialog.js index 211ac15..c9af5d6 100644 --- a/packages/browser-extension/src/scripts/dialog.js +++ b/packages/browser-extension/src/scripts/dialog.js @@ -219,7 +219,10 @@ async function submitButtonClickHandler(event) { const submitView = dialog?.getElementsByClassName('report-dialog-submit-view')[0]; const userAgent = window.navigator.userAgent; const issueUrl = await dispatch({ userAgent, reason: reasonText, url: urlText, type: 'REPORT' }); + const issue = { expiresIn: Date.now() + 8 * 60 * 60 * 1000, flags: ['bug'], url: issueUrl }; + await dispatch({ hostname, state: { issue }, type: 'UPDATE_STORE' }); + await dispatch({ hostname, type: 'ENABLE_ICON' }); formView?.setAttribute('hidden', 'true'); issueButton?.addEventListener('click', () => window.open(issueUrl, '_blank')); submitView?.removeAttribute('hidden'); -- 2.45.2 From 46aefd46885d0c1fbef71092077dc8fd071bca1d Mon Sep 17 00:00:00 2001 From: wanhose Date: Wed, 9 Oct 2024 01:52:18 +0200 Subject: [PATCH 08/30] feat(api): add issues and version endpoints --- packages/api/src/routes/v5/version.ts | 27 +++++++++++++++++++++++++++ 1 file changed, 27 insertions(+) create mode 100644 packages/api/src/routes/v5/version.ts diff --git a/packages/api/src/routes/v5/version.ts b/packages/api/src/routes/v5/version.ts new file mode 100644 index 0000000..f6b7b51 --- /dev/null +++ b/packages/api/src/routes/v5/version.ts @@ -0,0 +1,27 @@ +import { FastifyInstance, RouteShorthandOptions } from 'fastify'; +import fetch from 'node-fetch'; +import environment from 'services/environment'; + +export default (server: FastifyInstance, _options: RouteShorthandOptions, done: () => void) => { + server.get('/version/', async (_request, reply) => { + try { + const options = { headers: { 'Cache-Control': 'no-cache' } }; + const url = `${environment.github.files}/packages/browser-extension/src/manifest.json`; + const { version } = await (await fetch(url, options)).json(); + + reply.send({ + data: { + version, + }, + success: true, + }); + } catch (error) { + reply.send({ + errors: [error.message], + success: false, + }); + } + }); + + done(); +}; -- 2.45.2 From c7f0b31dd95fae757115909ef7f2b5e105e2c7a4 Mon Sep 17 00:00:00 2001 From: wanhose Date: Wed, 9 Oct 2024 02:00:09 +0200 Subject: [PATCH 09/30] refactor: drop old dialog stuff --- packages/browser-extension/src/manifest.json | 2 +- .../browser-extension/src/scripts/dialog.js | 275 ----------------- .../browser-extension/src/styles/dialog.css | 276 ------------------ 3 files changed, 1 insertion(+), 552 deletions(-) delete mode 100644 packages/browser-extension/src/scripts/dialog.js delete mode 100644 packages/browser-extension/src/styles/dialog.css diff --git a/packages/browser-extension/src/manifest.json b/packages/browser-extension/src/manifest.json index 43c746a..7cb0bf1 100644 --- a/packages/browser-extension/src/manifest.json +++ b/packages/browser-extension/src/manifest.json @@ -51,7 +51,7 @@ "*://translate.google.it/*", "*://www.cookie-dialog-monster.com/*" ], - "js": ["scripts/content.js", "scripts/dialog.js"], + "js": ["scripts/content.js"], "matches": ["http://*/*", "https://*/*"], "run_at": "document_start" } diff --git a/packages/browser-extension/src/scripts/dialog.js b/packages/browser-extension/src/scripts/dialog.js deleted file mode 100644 index c9af5d6..0000000 --- a/packages/browser-extension/src/scripts/dialog.js +++ /dev/null @@ -1,275 +0,0 @@ -if (typeof browser === 'undefined') { - browser = chrome; -} - -/** - * @description Report dialog ID - */ -const reportDialogId = 'report-dialog'; - -/** - * @description Report dialog outer HTML - */ -const reportDialogHtml = ` - -
-
Cookie Dialog Monster
-
- - - - -
-
-
-
-
- ${browser.i18n.getMessage('reportDialog_bodyText')} -
-
-
-
- ${browser.i18n.getMessage('reportDialog_urlInputLabel')} - * -
- -
- ${browser.i18n.getMessage('reportDialog_urlInputError')} -
-
-
-
- ${browser.i18n.getMessage('reportDialog_reasonInputLabel')} - * -
- -
- ${browser.i18n.getMessage('reportDialog_reasonInputError')} -
-
-
- ${browser.i18n.getMessage('contextMenu_reportOption')?.replace('...', '')} -
-
-
- -
- -`; - -/** - * @description Dialog close button click handler - * @param {MouseEvent} event - */ -function closeButtonClickHandler(event) { - const dialog = document.getElementById(reportDialogId); - - event.preventDefault(); - dialog?.remove(); -} - -/** - * @description Hide report dialog - */ -function hideReportDialog() { - document.getElementById(reportDialogId)?.remove(); -} - -/** - * @description Input change handler - * @param {InputEvent} event - */ -function inputChangeHandler(event) { - event.currentTarget.removeAttribute('aria-invalid'); -} - -/** - * @description Input key down handler - * @param {KeyboardEvent} event - */ -function inputKeyDownHandler(event) { - if (event.key === 'Enter') { - event.preventDefault(); - event.currentTarget.blur(); - } -} - -/** - * @description Show report dialog - */ -function showReportDialog() { - const existingDialog = document.getElementById(reportDialogId); - - if (existingDialog) { - const submitButton = existingDialog.getElementsByClassName('report-dialog-submit-button')[0]; - const urlInput = existingDialog.querySelector('#report-dialog-input-url'); - - existingDialog.showModal(); - submitButton.setAttribute('aria-disabled', 'false'); - urlInput.setAttribute('value', window.location.origin + window.location.pathname); - return; - } - - const parser = new DOMParser(); - const result = parser.parseFromString(reportDialogHtml, 'text/html'); - const dialog = result.body.firstElementChild; - const closeButton = dialog.getElementsByClassName('report-dialog-close-button')[0]; - const link = document.createElement('link'); - const reasonInput = dialog?.querySelector('#report-dialog-input-reason'); - const submitButton = dialog?.getElementsByClassName('report-dialog-submit-button')[0]; - const urlInput = dialog?.querySelector('#report-dialog-input-url'); - - closeButton.addEventListener('click', closeButtonClickHandler); - urlInput.setAttribute('value', window.location.origin + window.location.pathname); - link.setAttribute('href', 'https://fonts.googleapis.com/css?family=Inter'); - link.setAttribute('id', 'report-dialog-font'); - link.setAttribute('rel', 'stylesheet'); - reasonInput.addEventListener('input', inputChangeHandler); - reasonInput.addEventListener('keydown', inputKeyDownHandler); - submitButton.addEventListener('click', submitButtonClickHandler); - urlInput.addEventListener('input', inputChangeHandler); - urlInput.addEventListener('keydown', inputKeyDownHandler); - - dispatch({ type: 'INSERT_DIALOG_CSS' }); - document.body.appendChild(dialog); - document.head.appendChild(link); - dialog.showModal(); -} - -/** - * @description Dialog submit button click handler - * @param {MouseEvent} event - */ -async function submitButtonClickHandler(event) { - event.preventDefault(); - - if (event.currentTarget.getAttribute('aria-disabled') === 'true') { - return; - } - - event.currentTarget.setAttribute('aria-disabled', 'true'); - - const dialog = document.getElementById(reportDialogId); - const reasonInput = dialog?.querySelector('#report-dialog-input-reason'); - const reasonText = reasonInput?.value.trim(); - const urlInput = dialog?.querySelector('#report-dialog-input-url'); - const urlText = urlInput?.value.trim(); - - const errors = validateForm({ reason: reasonText, url: urlText }); - - if (errors) { - if (errors.reason) { - reasonInput?.setAttribute('aria-invalid', 'true'); - reasonInput?.setAttribute('aria-errormessage', 'report-dialog-input-reason-error'); - } - - if (errors.url) { - urlInput?.setAttribute('aria-invalid', 'true'); - urlInput?.setAttribute('aria-errormessage', 'report-dialog-input-url-error'); - } - - event.currentTarget.setAttribute('aria-disabled', 'false'); - return; - } - - const formView = dialog?.getElementsByClassName('report-dialog-form-view')[0]; - const issueButton = dialog?.getElementsByClassName('report-dialog-issue-button')[0]; - const submitView = dialog?.getElementsByClassName('report-dialog-submit-view')[0]; - const userAgent = window.navigator.userAgent; - const issueUrl = await dispatch({ userAgent, reason: reasonText, url: urlText, type: 'REPORT' }); - const issue = { expiresIn: Date.now() + 8 * 60 * 60 * 1000, flags: ['bug'], url: issueUrl }; - - await dispatch({ hostname, state: { issue }, type: 'UPDATE_STORE' }); - await dispatch({ hostname, type: 'ENABLE_ICON' }); - formView?.setAttribute('hidden', 'true'); - issueButton?.addEventListener('click', () => window.open(issueUrl, '_blank')); - submitView?.removeAttribute('hidden'); -} - -/** - * @description Validate form - * @param {{ reason: string | undefined | undefined, url: string | undefined }} params - * @returns {{ reason: string | undefined, url: string | undefined } | undefined} - */ -function validateForm(params) { - const { reason, url } = params; - let errors = undefined; - - if (!reason || reason.length < 10 || reason.length > 1000) { - errors = { - ...(errors ?? {}), - reason: browser.i18n.getMessage('reportDialog_reasonInputError'), - }; - } - - try { - new URL(url); - } catch { - errors = { - ...(errors ?? {}), - url: browser.i18n.getMessage('reportDialog_urlInputError'), - }; - } - - return errors; -} - -/** - * @description Listen to messages - */ -browser.runtime.onMessage.addListener((message) => { - const isPage = window === window.top; - - switch (message.type) { - case 'HIDE_REPORT_DIALOG': - if (isPage) hideReportDialog(); - break; - case 'SHOW_REPORT_DIALOG': - if (isPage) showReportDialog(); - break; - default: - break; - } -}); diff --git a/packages/browser-extension/src/styles/dialog.css b/packages/browser-extension/src/styles/dialog.css deleted file mode 100644 index 091fa3a..0000000 --- a/packages/browser-extension/src/styles/dialog.css +++ /dev/null @@ -1,276 +0,0 @@ -:root { - --cookie-dialog-monster-color-error: #cc0000; - --cookie-dialog-monster-color-primary: #3dd9eb; - --cookie-dialog-monster-color-secondary: #34495e; - --cookie-dialog-monster-color-success: #5cb85c; - --cookie-dialog-monster-color-tertiary: #6b7280; - --cookie-dialog-monster-color-white: #ffffff; -} - -#report-dialog { - background-color: var(--cookie-dialog-monster-color-white); - border: none; - border-radius: 4px; - box-sizing: border-box; - color: var(--cookie-dialog-monster-color-secondary); - font-size: 100%; - letter-spacing: normal; - margin: auto; - padding: 0px; - text-align: left; - width: 320px; -} - -#report-dialog::backdrop { - background-color: rgba(0, 0, 0, 0.5); -} - -#report-dialog * { - box-sizing: border-box; -} - -#report-dialog div { - all: unset; - display: block; - box-sizing: border-box; -} - -#report-dialog *::-moz-selection { - color: var(--cookie-dialog-monster-color-white); - background: var(--cookie-dialog-monster-color-tertiary); -} - -#report-dialog *::selection { - color: var(--cookie-dialog-monster-color-white); - background: var(--cookie-dialog-monster-color-tertiary); -} - -#report-dialog .report-dialog-body { - display: block; - font-size: 14px; - line-height: 1.2; - padding: 16px; -} - -#report-dialog .report-dialog-body-text { - display: block; - font-family: Inter, Arial, Helvetica, sans-serif; - font-size: 14px; - line-height: 1.2; - margin: 0px; - padding: 0px; -} - -#report-dialog .report-dialog-close-button { - align-items: center; - background-color: transparent; - border: none; - border-radius: 4px; - cursor: pointer; - display: inline-flex; - justify-content: center; - margin: 0px; - outline: none; - padding: 0px; -} - -#report-dialog .report-dialog-close-button { - stroke: var(--cookie-dialog-monster-color-white); -} - -#report-dialog .report-dialog-close-button:focus, -#report-dialog .report-dialog-close-button:hover > svg { - stroke: var(--cookie-dialog-monster-color-secondary); -} - -#report-dialog .report-dialog-close-button:focus-visible { - box-shadow: initial; - transition: initial; -} - -#report-dialog .report-dialog-close-button:focus, -#report-dialog .report-dialog-close-button:hover { - background-color: var(--cookie-dialog-monster-color-white); -} - -#report-dialog .report-dialog-form { - display: grid; - gap: 10px; -} - -#report-dialog .report-dialog-form-view { - display: flex; - flex-direction: column; - gap: 24px; -} - -#report-dialog .report-dialog-form-view[hidden] { - display: none; -} - -#report-dialog .report-dialog-header { - align-items: center; - background-color: var(--cookie-dialog-monster-color-secondary); - display: flex; - font-size: 16px; - height: 54px; - justify-content: space-between; - line-height: 1.2; - padding: 16px; -} - -#report-dialog .report-dialog-header-title { - color: var(--cookie-dialog-monster-color-white); - font-family: Inter, Arial, Helvetica, sans-serif; - font-weight: 500; -} - -#report-dialog .report-dialog-input { - all: unset; - border: 1px solid var(--cookie-dialog-monster-color-tertiary); - border-radius: 4px; - color: var(--cookie-dialog-monster-color-secondary); - cursor: text; - font-family: Inter, Arial, Helvetica, sans-serif; - font-size: 14px; - line-height: 1; - outline: none; - padding: 12px 8px; -} - -#report-dialog .report-dialog-input:hover { - border-color: var(--cookie-dialog-monster-color-secondary); -} - -#report-dialog .report-dialog-input:focus { - border-color: var(--cookie-dialog-monster-color-primary); -} - -#report-dialog .report-dialog-input:focus-visible { - box-shadow: initial; - transition: initial; -} - -#report-dialog .report-dialog-input::-webkit-scrollbar { - display: none; -} - -#report-dialog .report-dialog-input[aria-invalid='true'] { - border-color: var(--cookie-dialog-monster-color-error); -} - -#report-dialog .report-dialog-input[aria-invalid='true'] + .report-dialog-input-error { - visibility: visible; -} - -#report-dialog .report-dialog-input[aria-multiline='false'] { - -ms-overflow-style: none; - display: flex; - height: 40px; - overflow-x: auto; - scrollbar-width: none; - text-wrap: nowrap; -} - -#report-dialog .report-dialog-input[aria-multiline='true'] { - -ms-overflow-style: none; - height: 120px; - overflow-y: auto; - scrollbar-width: none; -} - -#report-dialog .report-dialog-input-error { - color: var(--cookie-dialog-monster-color-error); - font-family: Inter, Arial, Helvetica, sans-serif; - font-size: 10px; - line-height: 1.2; - visibility: hidden; -} - -#report-dialog .report-dialog-input-group { - display: grid; - gap: 4px; -} - -#report-dialog .report-dialog-input-label { - color: var(--cookie-dialog-monster-color-secondary); - font-family: Inter, Arial, Helvetica, sans-serif; - font-size: 12px; - line-height: 1.2; -} - -#report-dialog .report-dialog-input-label-required { - color: var(--cookie-dialog-monster-color-error); -} - -#report-dialog .report-dialog-issue-button, -#report-dialog .report-dialog-submit-button { - align-items: center; - background-color: var(--cookie-dialog-monster-color-secondary); - border: 1px solid var(--cookie-dialog-monster-color-secondary); - border-radius: 4px; - color: var(--cookie-dialog-monster-color-white); - cursor: pointer; - display: flex; - font-family: Inter, Arial, Helvetica, sans-serif; - font-size: 14px; - height: 42px; - justify-content: center; - line-height: 1.2; - outline: none; - padding: 8px 16px; - text-align: center; - width: 100%; -} - -#report-dialog .report-dialog-issue-button:focus, -#report-dialog .report-dialog-issue-button:hover, -#report-dialog .report-dialog-submit-button:focus, -#report-dialog .report-dialog-submit-button:hover { - background-color: var(--cookie-dialog-monster-color-white); - color: var(--cookie-dialog-monster-color-secondary); -} - -#report-dialog .report-dialog-issue-button:focus-visible, -#report-dialog .report-dialog-submit-button:focus-visible { - box-shadow: initial; - transition: initial; -} - -#report-dialog .report-dialog-issue-button[aria-disabled='true'], -#report-dialog .report-dialog-submit-button[aria-disabled='true'] { - background-color: var(--cookie-dialog-monster-color-tertiary); - border: 1px solid var(--cookie-dialog-monster-color-tertiary); - color: var(--cookie-dialog-monster-color-white); - cursor: not-allowed; -} - -#report-dialog .report-dialog-submit-extra-text { - font-family: inherit; - font-size: 14px; - line-height: 1.2; - margin: 0px; - text-align: justify; -} - -#report-dialog .report-dialog-submit-text { - font-family: inherit; - font-size: 18px; - line-height: 1.2; - margin: 0px; - text-align: center; -} - -#report-dialog .report-dialog-submit-view { - align-items: center; - display: flex; - flex-direction: column; - font-family: Inter, Arial, Helvetica, sans-serif; - gap: 24px; - justify-content: center; - margin-top: 16px; -} - -#report-dialog .report-dialog-submit-view[hidden] { - display: none; -} -- 2.45.2 From ccc313618d57032aa4fdfcb681233f65c0f97c53 Mon Sep 17 00:00:00 2001 From: wanhose Date: Thu, 10 Oct 2024 11:10:13 +0200 Subject: [PATCH 10/30] fix(browser-extension): popup auto height issue --- packages/browser-extension/src/options.html | 1 + packages/browser-extension/src/popup.html | 124 +++++++++++++++++--- 2 files changed, 107 insertions(+), 18 deletions(-) diff --git a/packages/browser-extension/src/options.html b/packages/browser-extension/src/options.html index 3706212..f8bb145 100644 --- a/packages/browser-extension/src/options.html +++ b/packages/browser-extension/src/options.html @@ -1,3 +1,4 @@ + diff --git a/packages/browser-extension/src/popup.html b/packages/browser-extension/src/popup.html index 124dd52..a142cf6 100644 --- a/packages/browser-extension/src/popup.html +++ b/packages/browser-extension/src/popup.html @@ -1,3 +1,4 @@ + @@ -9,24 +10,41 @@

Cookie Dialog Monster

- +
+ + +
-- 2.45.2 From 03efab9acce0f8a71eeb619ad40a70e562aafa4c Mon Sep 17 00:00:00 2001 From: wanhose Date: Thu, 10 Oct 2024 11:15:33 +0200 Subject: [PATCH 11/30] refactor(browser-extension): move report dialog to popup --- .../src/_locales/de/messages.json | 19 +- .../src/_locales/en/messages.json | 19 +- .../src/_locales/es/messages.json | 19 +- .../src/_locales/fr/messages.json | 19 +- .../src/_locales/it/messages.json | 19 +- .../src/_locales/pl/messages.json | 19 +- .../src/_locales/pt_BR/messages.json | 19 +- .../src/_locales/pt_PT/messages.json | 19 +- .../src/_locales/ro/messages.json | 19 +- .../src/_locales/ru/messages.json | 19 +- .../src/scripts/background.js | 36 +-- .../browser-extension/src/scripts/popup.js | 175 ++++++++++++- .../browser-extension/src/styles/popup.css | 230 +++++++++++++++++- 13 files changed, 507 insertions(+), 124 deletions(-) diff --git a/packages/browser-extension/src/_locales/de/messages.json b/packages/browser-extension/src/_locales/de/messages.json index 65421a2..2da390c 100644 --- a/packages/browser-extension/src/_locales/de/messages.json +++ b/packages/browser-extension/src/_locales/de/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Bewerten Sie diese Erweiterung" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Bitte geben Sie in diesem Bericht keine persönlichen Informationen weiter. Wenn Sie weitere Details hinzufügen möchten, öffnen Sie das GitHub-Problem im nächsten Schritt und fügen Sie einen Kommentar hinzu." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Abbrechen" + }, + "report_reasonInputError": { "message": "Bitte geben Sie einen Grund mit mindestens 10 und höchstens 1000 Zeichen ein" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Grund" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Popup ist erschienen" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "Während wir daran arbeiten, können Sie diese Website zur Ausschlussliste in den Erweiterungseinstellungen hinzufügen oder einfach die Erweiterung für diese Website deaktivieren, indem Sie auf das Erweiterungssymbol in Ihrer Browser-Symbolleiste klicken." }, - "reportDialog_submitText": { + "report_submitText": { "message": "Bericht gesendet!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Bitte geben Sie eine gültige URL mit höchstens 1000 Zeichen ein" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/en/messages.json b/packages/browser-extension/src/_locales/en/messages.json index 203e950..c4b91e7 100644 --- a/packages/browser-extension/src/_locales/en/messages.json +++ b/packages/browser-extension/src/_locales/en/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Rate this extension" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Please, do not share any personal information in this report. If you want to add more details, open the GitHub issue in the next step and add a comment." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Cancel" + }, + "report_reasonInputError": { "message": "Please enter a reason with at least 10 characters and no more than 1000 characters" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Reason" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Popup showed up" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "While we are working on this, you can add this website to the exclusion list in the extension settings or just disable the extension for this website clicking on the extension icon in your browser toolbar" }, - "reportDialog_submitText": { + "report_submitText": { "message": "Report sent!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Please enter a valid URL with no more than 1000 characters" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/es/messages.json b/packages/browser-extension/src/_locales/es/messages.json index 724b5f4..504d7ad 100644 --- a/packages/browser-extension/src/_locales/es/messages.json +++ b/packages/browser-extension/src/_locales/es/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Califica esta extensión" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Por favor, no compartas ninguna información personal en este informe. Si deseas agregar más detalles, abre el problema de GitHub en el siguiente paso y agrega un comentario." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Cancelar" + }, + "report_reasonInputError": { "message": "Por favor, ingrese una razón con al menos 10 caracteres y no más de 1000 caracteres" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Razón" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Apareció un popup" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "Mientras trabajamos en esto, puedes agregar este sitio web a la lista de exclusión en la configuración de la extensión o simplemente deshabilitar la extensión para este sitio web haciendo clic en el ícono de la extensión en la barra de herramientas de tu navegador." }, - "reportDialog_submitText": { + "report_submitText": { "message": "¡Informe enviado!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Por favor, ingrese una URL válida con no más de 1000 caracteres" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/fr/messages.json b/packages/browser-extension/src/_locales/fr/messages.json index bb45ea5..2d17841 100644 --- a/packages/browser-extension/src/_locales/fr/messages.json +++ b/packages/browser-extension/src/_locales/fr/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Évaluer cette extension" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Veuillez ne pas partager d'informations personnelles dans ce rapport. Si vous souhaitez ajouter plus de détails, ouvrez le problème GitHub à l'étape suivante et ajoutez un commentaire." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Annuler" + }, + "report_reasonInputError": { "message": "Veuillez entrer une raison d'au moins 10 caractères et de pas plus de 1000 caractères" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Raison" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Le popup est apparu" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "Pendant que nous travaillons sur ce point, vous pouvez ajouter ce site web à la liste d'exclusion dans les paramètres de l'extension ou simplement désactiver l'extension pour ce site web en cliquant sur l'icône de l'extension dans la barre d'outils de votre navigateur." }, - "reportDialog_submitText": { + "report_submitText": { "message": "Rapport envoyé!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Veuillez entrer une URL valide de pas plus de 1000 caractères" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/it/messages.json b/packages/browser-extension/src/_locales/it/messages.json index ae1d199..5e83409 100644 --- a/packages/browser-extension/src/_locales/it/messages.json +++ b/packages/browser-extension/src/_locales/it/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Valuta questa estensione" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Per favore, non condividere informazioni personali in questo rapporto. Se vuoi aggiungere più dettagli, apri il problema su GitHub nel passaggio successivo e aggiungi un commento." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Annulla" + }, + "report_reasonInputError": { "message": "Inserisci una motivazione con almeno 10 caratteri e non più di 1000 caratteri" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Motivo" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Popup apparso" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "Mentre lavoriamo su questo, puoi aggiungere questo sito web alla lista di esclusione nelle impostazioni dell'estensione o semplicemente disattivare l'estensione per questo sito web cliccando sull'icona dell'estensione nella barra degli strumenti del browser." }, - "reportDialog_submitText": { + "report_submitText": { "message": "Rapporto inviato!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Inserisci un URL valido con non più di 1000 caratteri" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/pl/messages.json b/packages/browser-extension/src/_locales/pl/messages.json index f43fcf0..75612f4 100644 --- a/packages/browser-extension/src/_locales/pl/messages.json +++ b/packages/browser-extension/src/_locales/pl/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Oceń to rozszerzenie" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Prosimy, nie udostępniaj żadnych danych osobowych w tym raporcie. Jeśli chcesz dodać więcej szczegółów, otwórz zgłoszenie na GitHub w następnym kroku i dodaj komentarz." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Anuluj" + }, + "report_reasonInputError": { "message": "Proszę podać powód zawierający co najmniej 10 znaków i nie więcej niż 1000 znaków" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Powód" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Pojawił się popup" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "Podczas gdy nad tym pracujemy, możesz dodać tę stronę do listy wykluczeń w ustawieniach rozszerzenia lub po prostu wyłączyć rozszerzenie dla tej strony, klikając ikonę rozszerzenia na pasku narzędzi przeglądarki." }, - "reportDialog_submitText": { + "report_submitText": { "message": "Zgłoszenie wysłane!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Proszę wprowadzić prawidłowy URL zawierający nie więcej niż 1000 znaków" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/pt_BR/messages.json b/packages/browser-extension/src/_locales/pt_BR/messages.json index 640d7a6..405044f 100644 --- a/packages/browser-extension/src/_locales/pt_BR/messages.json +++ b/packages/browser-extension/src/_locales/pt_BR/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Avalie esta extensão" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Por favor, não compartilhe nenhuma informação pessoal neste relatório. Se você quiser adicionar mais detalhes, abra o problema no GitHub na próxima etapa e adicione um comentário." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Cancelar" + }, + "report_reasonInputError": { "message": "Por favor, insira um motivo com pelo menos 10 caracteres e no máximo 1000 caracteres" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Motivo" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Popup apareceu" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "Enquanto estamos trabalhando nisso, você pode adicionar este site à lista de exclusão nas configurações da extensão ou simplesmente desativar a extensão para este site clicando no ícone da extensão na barra de ferramentas do navegador." }, - "reportDialog_submitText": { + "report_submitText": { "message": "Relatório enviado!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Por favor, insira uma URL válida com no máximo 1000 caracteres" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/pt_PT/messages.json b/packages/browser-extension/src/_locales/pt_PT/messages.json index cafabbc..b0afaa4 100644 --- a/packages/browser-extension/src/_locales/pt_PT/messages.json +++ b/packages/browser-extension/src/_locales/pt_PT/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Avalie esta extensão" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Por favor, não partilhe nenhuma informação pessoal neste relatório. Se quiser adicionar mais detalhes, abra o problema no GitHub na próxima etapa e adicione um comentário." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Cancelar" + }, + "report_reasonInputError": { "message": "Por favor, insira um motivo com pelo menos 10 caracteres e no máximo 1000 caracteres" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Motivo" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Popup apareceu" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "Enquanto trabalhamos nisso, pode adicionar este site à lista de exclusão nas definições da extensão ou simplesmente desativar a extensão para este site clicando no ícone da extensão na barra de ferramentas do navegador." }, - "reportDialog_submitText": { + "report_submitText": { "message": "Relatório enviado!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Por favor, insira uma URL válida com no máximo 1000 caracteres" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/ro/messages.json b/packages/browser-extension/src/_locales/ro/messages.json index 3b5f5c3..ac2b767 100644 --- a/packages/browser-extension/src/_locales/ro/messages.json +++ b/packages/browser-extension/src/_locales/ro/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Evaluează această extensie" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Te rugăm să nu împărtășești informații personale în acest raport. Dacă dorești să adaugi mai multe detalii, deschide problema GitHub în pasul următor și adaugă un comentariu." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Anulează" + }, + "report_reasonInputError": { "message": "Vă rugăm să introduceți un motiv cu cel puțin 10 caractere și maximum 1000 de caractere" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Motiv" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "A apărut un popup" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "În timp ce lucrăm la acest aspect, poți adăuga acest site web la lista de excludere din setările extensiei sau poți dezactiva extensia pentru acest site web făcând clic pe pictograma extensiei din bara de instrumente a browserului." }, - "reportDialog_submitText": { + "report_submitText": { "message": "Raport trimis!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Vă rugăm să introduceți o adresă URL validă cu maximum 1000 de caractere" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/_locales/ru/messages.json b/packages/browser-extension/src/_locales/ru/messages.json index bedb5dd..528de50 100644 --- a/packages/browser-extension/src/_locales/ru/messages.json +++ b/packages/browser-extension/src/_locales/ru/messages.json @@ -53,28 +53,31 @@ "popup_rateOption": { "message": "Оцените это расширение" }, - "reportDialog_bodyText": { + "report_bodyText": { "message": "Пожалуйста, не делитесь личной информацией в этом отчете. Если вы хотите добавить больше деталей, откройте вопрос на GitHub на следующем шаге и добавьте комментарий." }, - "reportDialog_reasonInputError": { + "report_cancelButtonText": { + "message": "Отмена" + }, + "report_reasonInputError": { "message": "Пожалуйста, введите причину длиной не менее 10 и не более 1000 символов" }, - "reportDialog_reasonInputLabel": { + "report_reasonInputLabel": { "message": "Причина" }, - "reportDialog_reasonInputPlaceholder": { + "report_reasonInputPlaceholder": { "message": "Появилось всплывающее окно" }, - "reportDialog_submitExtraText": { + "report_submitExtraText": { "message": "Пока мы работаем над этим, вы можете добавить этот сайт в список исключений в настройках расширения или просто отключить расширение для этого сайта, нажав на значок расширения на панели инструментов вашего браузера." }, - "reportDialog_submitText": { + "report_submitText": { "message": "Отчет отправлен!" }, - "reportDialog_urlInputError": { + "report_urlInputError": { "message": "Пожалуйста, введите корректный URL длиной не более 1000 символов" }, - "reportDialog_urlInputLabel": { + "report_urlInputLabel": { "message": "URL" } } diff --git a/packages/browser-extension/src/scripts/background.js b/packages/browser-extension/src/scripts/background.js index 6b55bb7..80e9590 100644 --- a/packages/browser-extension/src/scripts/background.js +++ b/packages/browser-extension/src/scripts/background.js @@ -186,7 +186,7 @@ async function refreshData() { try { const { data } = await requestManager.fetchData(`${apiUrl}/data/`); - await triggerStoreUpdate('data', data); + await updateStore('data', data); return data; } catch { @@ -205,14 +205,14 @@ async function refreshIssue(hostname) { const { data } = await requestManager.fetchData(`${apiUrl}/issues/${hostname}`); if (Object.keys(data).length === 0) { - await triggerStoreUpdate(hostname, { issue: { expiresIn: Date.now() + 8 * 60 * 60 * 1000 } }); + await updateStore(hostname, { issue: { expiresIn: Date.now() + 8 * 60 * 60 * 1000 } }); return undefined; } const issue = { expiresIn: Date.now() + 4 * 60 * 60 * 1000, flags: data.flags, url: data.url }; - await triggerStoreUpdate(hostname, { issue }); + await updateStore(hostname, { issue }); return data; } catch { @@ -251,7 +251,7 @@ async function report(message) { * @param {Object} value * @returns {Promise} */ -async function triggerStoreUpdate(key, value) { +async function updateStore(key, value) { if (key) { const { [key]: prev } = await storage.get(key); @@ -262,14 +262,10 @@ async function triggerStoreUpdate(key, value) { /** * @description Listen to context menus clicked */ -browser.contextMenus.onClicked.addListener((info, tab) => { - const tabId = tab?.id; - +browser.contextMenus.onClicked.addListener((info) => { switch (info.menuItemId) { case reportMenuItemId: - if (tabId !== undefined) { - browser.tabs.sendMessage(tabId, { type: 'SHOW_REPORT_DIALOG' }, suppressLastError); - } + browser.action.openPopup(); break; case settingsMenuItemId: browser.runtime.openOptionsPage(); @@ -309,9 +305,9 @@ browser.runtime.onMessage.addListener((message, sender, callback) => { return true; case 'GET_EXCLUSION_LIST': storage.get(null, (exclusions) => { - const exclusionList = Object.entries(exclusions || {}).flatMap((exclusion) => - exclusion[0] !== 'data' && !exclusion[1]?.on ? [exclusion[0]] : [] - ); + const exclusionList = Object.entries(exclusions || {}).flatMap((exclusion) => { + return exclusion[0] !== 'data' && exclusion[1].on === false ? [exclusion[0]] : []; + }); callback(exclusionList); }); return true; @@ -326,20 +322,12 @@ browser.runtime.onMessage.addListener((message, sender, callback) => { callback(tabs[0]); }); return true; - case 'INSERT_DIALOG_CSS': - if (isPage && tabId !== undefined) { - script.insertCSS({ files: ['styles/dialog.css'], target: { tabId } }); - } - break; case 'REFRESH_DATA': refreshData().then(callback); return true; case 'REPORT': - if (tabId !== undefined) { - report(message).then(callback); - return true; - } - break; + report(message).then(callback); + return true; case 'UPDATE_BADGE': if (isPage && tabId !== undefined) { browser.action.setBadgeBackgroundColor({ color: '#6b7280' }); @@ -347,7 +335,7 @@ browser.runtime.onMessage.addListener((message, sender, callback) => { } break; case 'UPDATE_STORE': - triggerStoreUpdate(hostname, message.state).then(callback); + updateStore(hostname, message.state).then(callback); return true; default: break; diff --git a/packages/browser-extension/src/scripts/popup.js b/packages/browser-extension/src/scripts/popup.js index 4988025..a9d969e 100644 --- a/packages/browser-extension/src/scripts/popup.js +++ b/packages/browser-extension/src/scripts/popup.js @@ -20,6 +20,11 @@ if (typeof browser === 'undefined') { */ const chromeUrl = 'https://chrome.google.com/webstore/detail/djcbfpkdhdkaflcigibkbpboflaplabg'; +/** + * @description Shortcut to send messages to background script + */ +const dispatch = browser.runtime.sendMessage; + /** * @description Edge Add-ons link * @type {string} @@ -63,19 +68,32 @@ const isFirefox = navigator.userAgent.indexOf('Firefox') !== -1; */ let state = { on: true }; +/** + * @description Close report form + * @returns {void} + */ +function handleCancelClick() { + const content = document.getElementsByClassName('content')[0]; + const report = document.getElementsByClassName('report')[0]; + + if (content instanceof HTMLElement && report instanceof HTMLElement) { + content.style.removeProperty('display'); + report.style.display = 'none'; + } +} + /** * @async * @description Setup stars handlers and result message links * @returns {Promise} */ async function handleContentLoaded() { - const tab = await browser.runtime.sendMessage({ type: 'GET_TAB' }); + const tab = await dispatch({ type: 'GET_TAB' }); + const tabUrl = tab?.url ? new URL(tab.url) : undefined; - hostname = tab?.url - ? new URL(tab.url).hostname.split('.').slice(-3).join('.').replace('www.', '') - : undefined; + hostname = tabUrl?.hostname.split('.').slice(-3).join('.').replace('www.', ''); - const next = await browser.runtime.sendMessage({ hostname, type: 'GET_STATE' }); + const next = await dispatch({ hostname, type: 'GET_STATE' }); state = { ...(next ?? state), tabId: tab?.id }; if (state.issue?.url) { @@ -89,6 +107,25 @@ async function handleContentLoaded() { const issueBannerUrl = document.getElementById('issue-banner-url'); issueBannerUrl.setAttribute('href', state.issue.url); + } else { + const cancelButtonElement = document.getElementsByClassName('report-cancel-button')[0]; + cancelButtonElement?.addEventListener('click', handleCancelClick); + + const reasonInputElement = document.getElementById('report-input-reason'); + reasonInputElement?.addEventListener('input', handleInputChange); + reasonInputElement?.addEventListener('keydown', handleInputKeyDown); + + const reportButtonElement = document.getElementById('report-button'); + reportButtonElement?.addEventListener('click', handleReportClick); + reportButtonElement?.removeAttribute('disabled'); + + const urlInputElement = document.getElementById('report-input-url'); + urlInputElement?.addEventListener('input', handleInputChange); + urlInputElement?.addEventListener('keydown', handleInputKeyDown); + if (tabUrl) urlInputElement?.setAttribute('value', `${tabUrl.origin}${tabUrl.pathname}`); + + const submitButtonElement = document.getElementsByClassName('report-submit-button')[0]; + submitButtonElement?.addEventListener('click', handleSubmitButtonClick); } const hostTextElement = document.getElementById('host'); @@ -118,10 +155,10 @@ async function handleContentLoaded() { else if (isFirefox) rateButtonElement?.setAttribute('data-href', firefoxUrl); const settingsButtonElement = document.getElementById('settings-button'); - settingsButtonElement.addEventListener('click', handleSettingsClick); + settingsButtonElement?.addEventListener('click', handleSettingsClick); translate(); - updateDatabaseVersion(); + await updateDatabaseVersion(); } /** @@ -141,12 +178,12 @@ async function handleDatabaseRefresh(event) { target.setAttribute('data-refreshing', 'true'); target.setAttribute('aria-disabled', 'true'); - await browser.runtime.sendMessage({ type: 'REFRESH_DATA' }); + await dispatch({ type: 'REFRESH_DATA' }); checkIcon.style.setProperty('display', 'block'); spinnerIcon.style.setProperty('display', 'none'); target.removeAttribute('data-animation'); target.removeAttribute('data-refreshing'); - updateDatabaseVersion(); + await updateDatabaseVersion(); window.setTimeout(() => { checkIcon.style.setProperty('display', 'none'); @@ -156,6 +193,25 @@ async function handleDatabaseRefresh(event) { }, 5000); } +/** + * @description Input change handler + * @param {InputEvent} event + */ +function handleInputChange(event) { + event.currentTarget.removeAttribute('aria-invalid'); +} + +/** + * @description Input key down handler + * @param {KeyboardEvent} event + */ +function handleInputKeyDown(event) { + if (event.key === 'Enter') { + event.preventDefault(); + event.currentTarget.blur(); + } +} + /** * @async * @description Open a new tab @@ -171,17 +227,32 @@ async function handleLinkRedirect(event) { } /** + * @async * @description Disable or enable extension on current page * @returns {void} */ -function handlePowerToggle() { +async function handlePowerToggle() { const next = { on: !state.on }; - browser.runtime.sendMessage({ hostname, state: next, type: 'UPDATE_STORE' }); - browser.tabs.reload(state.tabId, { bypassCache: true }); + await dispatch({ hostname, state: next, type: 'UPDATE_STORE' }); + await browser.tabs.reload(state.tabId, { bypassCache: true }); window.close(); } +/** + * @description Show report form + * @returns {void} + */ +function handleReportClick() { + const content = document.getElementsByClassName('content')[0]; + const report = document.getElementsByClassName('report')[0]; + + if (content instanceof HTMLElement && report instanceof HTMLElement) { + content.style.display = 'none'; + report.style.removeProperty('display'); + } +} + /** * @async * @description Open options page @@ -191,6 +262,56 @@ async function handleSettingsClick() { await browser.runtime.openOptionsPage(); } +/** + * @async + * @description Report submit button click handler + * @param {MouseEvent} event + */ +async function handleSubmitButtonClick(event) { + event.preventDefault(); + + if (event.currentTarget.getAttribute('aria-disabled') === 'true') { + return; + } + + event.currentTarget.setAttribute('aria-disabled', 'true'); + + const reasonInput = document.getElementById('report-input-reason'); + const reasonText = reasonInput?.value.trim(); + const urlInput = document.getElementById('report-input-url'); + const urlText = urlInput?.value.trim(); + + const errors = validateForm({ reason: reasonText, url: urlText }); + + if (errors) { + if (errors.reason) { + reasonInput?.setAttribute('aria-invalid', 'true'); + reasonInput?.setAttribute('aria-errormessage', 'report-input-reason-error'); + } + + if (errors.url) { + urlInput?.setAttribute('aria-invalid', 'true'); + urlInput?.setAttribute('aria-errormessage', 'report-input-url-error'); + } + + event.currentTarget.setAttribute('aria-disabled', 'false'); + return; + } + + const formView = document.getElementsByClassName('report-form-view')[0]; + const issueButton = document.getElementsByClassName('report-issue-button')[0]; + const submitView = document.getElementsByClassName('report-submit-view')[0]; + const userAgent = window.navigator.userAgent; + const issueUrl = await dispatch({ userAgent, reason: reasonText, url: urlText, type: 'REPORT' }); + const issue = { expiresIn: Date.now() + 8 * 60 * 60 * 1000, flags: ['bug'], url: issueUrl }; + + await dispatch({ hostname, state: { issue }, type: 'UPDATE_STORE' }); + await dispatch({ hostname, type: 'ENABLE_ICON' }); + formView?.setAttribute('hidden', 'true'); + issueButton?.addEventListener('click', () => window.open(issueUrl, '_blank')); + submitView?.removeAttribute('hidden'); +} + /** * @description Apply translations to tags with i18n data attribute * @returns {void} @@ -218,13 +339,41 @@ function translate() { * @returns {Promise} */ async function updateDatabaseVersion() { - const data = await browser.runtime.sendMessage({ hostname, type: 'GET_DATA' }); + const data = await dispatch({ hostname, type: 'GET_DATA' }); const databaseVersionElement = document.getElementById('database-version'); if (data.version) databaseVersionElement.innerText = data.version; else databaseVersionElement.style.setProperty('display', 'none'); } +/** + * @description Validate form + * @param {{ reason: string | undefined | undefined, url: string | undefined }} params + * @returns {{ reason: string | undefined, url: string | undefined } | undefined} + */ +function validateForm(params) { + const { reason, url } = params; + let errors = undefined; + + if (!reason || reason.length < 10 || reason.length > 1000) { + errors = { + ...(errors ?? {}), + reason: browser.i18n.getMessage('report_reasonInputError'), + }; + } + + try { + new URL(url); + } catch { + errors = { + ...(errors ?? {}), + url: browser.i18n.getMessage('report_urlInputError'), + }; + } + + return errors; +} + /** * @description Listen to document ready * @listens document#DOMContentLoaded diff --git a/packages/browser-extension/src/styles/popup.css b/packages/browser-extension/src/styles/popup.css index fe3342b..78d0c7c 100644 --- a/packages/browser-extension/src/styles/popup.css +++ b/packages/browser-extension/src/styles/popup.css @@ -11,8 +11,6 @@ body { box-sizing: border-box; color: var(--color-tertiary); - display: flex; - flex-direction: column; font-family: Inter, Arial, Helvetica, sans-serif; width: 320px; } @@ -32,16 +30,22 @@ button { outline: none; padding: 2px; transition: 0.4s; -} -button:focus, -button:hover { - background-color: var(--color-white); - color: var(--color-secondary); + &:focus:not(:disabled), + &:hover:not(:disabled) { + background-color: var(--color-white); + color: var(--color-secondary); + } + + &:disabled { + cursor: not-allowed; + opacity: 0.5; + } } footer { background-color: var(--color-secondary); + flex-shrink: 0; font-size: 12px; height: 4px; margin-top: auto; @@ -53,10 +57,21 @@ header { background-color: var(--color-secondary); color: var(--color-white); display: flex; + flex-shrink: 0; font-size: 16px !important; height: 48px; justify-content: space-between; padding: 0 16px; + + & .header-actions { + display: flex; + gap: 8px; + + & #report-button:focus:not(:disabled) > svg, + & #report-button:hover:not(:disabled) > svg { + color: var(--color-error); + } + } } main > .banner { @@ -159,6 +174,207 @@ popup-data-container { text-align: center; } +.report { + font-family: inherit; + font-size: 14px; + line-height: 1.2; + padding: 16px; + + & .report-buttons { + margin-top: auto; + } + + & .report-form { + display: grid; + gap: 10px; + } + + & .report-form-view { + display: flex; + flex-direction: column; + gap: 16px; + } + + & .report-form-view[hidden] { + display: none; + } + + & .report-input { + all: unset; + border: 1px solid var(--color-tertiary); + border-radius: 4px; + color: var(--color-secondary); + cursor: text; + font-family: Inter, Arial, Helvetica, sans-serif; + font-size: 14px; + line-height: 1; + outline: none; + padding: 12px 8px; + } + + & .report-input:hover { + border-color: var(--color-secondary); + } + + & .report-input:focus { + border-color: var(--color-primary); + } + + & .report-input:focus-visible { + box-shadow: initial; + transition: initial; + } + + & .report-input::-webkit-scrollbar { + display: none; + } + + & .report-input[aria-invalid='true'] { + border-color: var(--color-error); + } + + & .report-input[aria-invalid='true'] + .report-input-error { + display: block; + } + + & .report-input[aria-multiline='false'] { + -ms-overflow-style: none; + display: flex; + height: 40px; + overflow-x: auto; + scrollbar-width: none; + text-wrap: nowrap; + } + + & .report-input[aria-multiline='true'] { + -ms-overflow-style: none; + height: 120px; + overflow-y: auto; + scrollbar-width: none; + } + + & .report-input-error { + color: var(--color-error); + display: none; + font-family: Inter, Arial, Helvetica, sans-serif; + font-size: 10px; + line-height: 1.2; + } + + & .report-input-group { + display: grid; + gap: 4px; + } + + & .report-input-label { + color: var(--color-secondary); + font-family: Inter, Arial, Helvetica, sans-serif; + font-size: 12px; + line-height: 1.2; + } + + & .report-input-label-required { + color: var(--color-error); + } + + & .report-cancel-button { + align-items: center; + background-color: var(--color-white); + border: 1px solid var(--color-white); + border-radius: 4px; + color: var(--color-secondary); + cursor: pointer; + display: flex; + font-family: Inter, Arial, Helvetica, sans-serif; + font-size: 14px; + height: 34px; + justify-content: center; + line-height: 1.2; + outline: none; + padding: 8px 16px 0px 16px; + text-align: center; + width: 100%; + } + + & .report-cancel-button:focus, + & .report-cancel-button:hover { + color: var(--color-error); + } + + & .report-issue-button, + & .report-submit-button { + align-items: center; + background-color: var(--color-secondary); + border: 1px solid var(--color-secondary); + border-radius: 4px; + color: var(--color-white); + cursor: pointer; + display: flex; + font-family: Inter, Arial, Helvetica, sans-serif; + font-size: 14px; + height: 42px; + justify-content: center; + line-height: 1.2; + margin-top: 8px; + outline: none; + padding: 8px 16px; + text-align: center; + width: 100%; + } + + & .report-issue-button:focus, + & .report-issue-button:hover, + & .report-submit-button:focus, + & .report-submit-button:hover { + background-color: var(--color-white); + color: var(--color-secondary); + } + + & .report-issue-button:focus-visible, + & .report-submit-button:focus-visible { + box-shadow: initial; + transition: initial; + } + + & .report-issue-button[aria-disabled='true'], + & .report-submit-button[aria-disabled='true'] { + background-color: var(--color-tertiary); + border: 1px solid var(--color-tertiary); + color: var(--color-white); + cursor: not-allowed; + } + + & .report-submit-extra-text { + font-family: inherit; + font-size: 14px; + line-height: 1.2; + margin: 0px; + text-align: justify; + } + + & .report-submit-text { + font-family: inherit; + font-size: 18px; + line-height: 1.2; + margin: 0px; + text-align: center; + } + + & .report-submit-view { + align-items: center; + display: flex; + flex-direction: column; + font-family: Inter, Arial, Helvetica, sans-serif; + gap: 24px; + justify-content: center; + margin-top: 16px; + } + + & .report-submit-view[hidden] { + display: none; + } +} + strong { font-weight: bold; } -- 2.45.2 From b216746697f407ee16d04effd0093c95e3776bef Mon Sep 17 00:00:00 2001 From: wanhose Date: Thu, 10 Oct 2024 11:47:12 +0200 Subject: [PATCH 12/30] feat(browser-extension): bump api version to use --- packages/browser-extension/src/scripts/background.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/browser-extension/src/scripts/background.js b/packages/browser-extension/src/scripts/background.js index 80e9590..c05c445 100644 --- a/packages/browser-extension/src/scripts/background.js +++ b/packages/browser-extension/src/scripts/background.js @@ -48,7 +48,7 @@ class RequestManager { * @description API URL * @type {string} */ -const apiUrl = 'https://api.cookie-dialog-monster.com/rest/v4'; +const apiUrl = 'https://api.cookie-dialog-monster.com/rest/v5'; /** * @description Context menu identifier -- 2.45.2 From 74dec0877affa733c5e8c795b1672c6faef9fb09 Mon Sep 17 00:00:00 2001 From: wanhose Date: Thu, 10 Oct 2024 13:41:50 +0200 Subject: [PATCH 13/30] feat(browser-extension): handle new error cases when reporting --- packages/api/src/routes/v5/version.ts | 27 ------------- .../src/_locales/de/messages.json | 10 ++++- .../src/_locales/en/messages.json | 10 ++++- .../src/_locales/es/messages.json | 14 +++++-- .../src/_locales/fr/messages.json | 10 ++++- .../src/_locales/it/messages.json | 10 ++++- .../src/_locales/pl/messages.json | 10 ++++- .../src/_locales/pt_BR/messages.json | 10 ++++- .../src/_locales/pt_PT/messages.json | 10 ++++- .../src/_locales/ro/messages.json | 10 ++++- .../src/_locales/ru/messages.json | 10 ++++- packages/browser-extension/src/popup.html | 30 ++++++++++++-- .../src/scripts/background.js | 17 ++++++-- .../browser-extension/src/scripts/popup.js | 40 ++++++++++++++----- .../browser-extension/src/styles/popup.css | 6 ++- 15 files changed, 157 insertions(+), 67 deletions(-) delete mode 100644 packages/api/src/routes/v5/version.ts diff --git a/packages/api/src/routes/v5/version.ts b/packages/api/src/routes/v5/version.ts deleted file mode 100644 index f6b7b51..0000000 --- a/packages/api/src/routes/v5/version.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { FastifyInstance, RouteShorthandOptions } from 'fastify'; -import fetch from 'node-fetch'; -import environment from 'services/environment'; - -export default (server: FastifyInstance, _options: RouteShorthandOptions, done: () => void) => { - server.get('/version/', async (_request, reply) => { - try { - const options = { headers: { 'Cache-Control': 'no-cache' } }; - const url = `${environment.github.files}/packages/browser-extension/src/manifest.json`; - const { version } = await (await fetch(url, options)).json(); - - reply.send({ - data: { - version, - }, - success: true, - }); - } catch (error) { - reply.send({ - errors: [error.message], - success: false, - }); - } - }); - - done(); -}; diff --git a/packages/browser-extension/src/_locales/de/messages.json b/packages/browser-extension/src/_locales/de/messages.json index 2da390c..b1a8393 100644 --- a/packages/browser-extension/src/_locales/de/messages.json +++ b/packages/browser-extension/src/_locales/de/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "Popup ist erschienen" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "Es scheint, dass bereits ein Problem geöffnet ist oder als 'wontfix' markiert wurde. Bitte öffnen Sie das Problem und fügen Sie gegebenenfalls weitere Informationen hinzu, indem Sie den folgenden Button verwenden." + }, + "report_submitErrorText": { + "message": "Bericht nicht gesendet?" + }, + "report_submitSuccessExtraText": { "message": "Während wir daran arbeiten, können Sie diese Website zur Ausschlussliste in den Erweiterungseinstellungen hinzufügen oder einfach die Erweiterung für diese Website deaktivieren, indem Sie auf das Erweiterungssymbol in Ihrer Browser-Symbolleiste klicken." }, - "report_submitText": { + "report_submitSuccessText": { "message": "Bericht gesendet!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/_locales/en/messages.json b/packages/browser-extension/src/_locales/en/messages.json index c4b91e7..7f01ac0 100644 --- a/packages/browser-extension/src/_locales/en/messages.json +++ b/packages/browser-extension/src/_locales/en/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "Popup showed up" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "It seems that there's an issue open already, or it is marked as wontfix. Please enter the issue if you want to add more information using the following button." + }, + "report_submitErrorText": { + "message": "Report not sent?" + }, + "report_submitSuccessExtraText": { "message": "While we are working on this, you can add this website to the exclusion list in the extension settings or just disable the extension for this website clicking on the extension icon in your browser toolbar" }, - "report_submitText": { + "report_submitSuccessText": { "message": "Report sent!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/_locales/es/messages.json b/packages/browser-extension/src/_locales/es/messages.json index 504d7ad..edc48c5 100644 --- a/packages/browser-extension/src/_locales/es/messages.json +++ b/packages/browser-extension/src/_locales/es/messages.json @@ -68,11 +68,17 @@ "report_reasonInputPlaceholder": { "message": "Apareció un popup" }, - "report_submitExtraText": { - "message": "Mientras trabajamos en esto, puedes agregar este sitio web a la lista de exclusión en la configuración de la extensión o simplemente deshabilitar la extensión para este sitio web haciendo clic en el ícono de la extensión en la barra de herramientas de tu navegador." + "report_submitErrorExtraText": { + "message": "Reporte no enviado?" }, - "report_submitText": { - "message": "¡Informe enviado!" + "report_submitErrorText": { + "message": "Parece que ya hay un problema abierto o está marcado como 'no se solucionará'. Por favor, ingrese al problema para agregar más información usando el siguiente botón." + }, + "report_submitSuccessExtraText": { + "message": "Mientras trabajamos en esto, puedes agregar este sitio web a la lista de exclusiones en la configuración de la extensión o simplemente deshabilitar la extensión para este sitio web haciendo clic en el icono de la extensión en la barra de herramientas de tu navegador." + }, + "report_submitSuccessText": { + "message": "Reporte enviado!" }, "report_urlInputError": { "message": "Por favor, ingrese una URL válida con no más de 1000 caracteres" diff --git a/packages/browser-extension/src/_locales/fr/messages.json b/packages/browser-extension/src/_locales/fr/messages.json index 2d17841..4d5f706 100644 --- a/packages/browser-extension/src/_locales/fr/messages.json +++ b/packages/browser-extension/src/_locales/fr/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "Le popup est apparu" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "Il semble qu'un problème soit déjà ouvert ou marqué comme 'ne sera pas corrigé'. Veuillez entrer dans le problème pour ajouter plus d'informations en utilisant le bouton suivant." + }, + "report_submitErrorText": { + "message": "Rapport non envoyé?" + }, + "report_submitSuccessExtraText": { "message": "Pendant que nous travaillons sur ce point, vous pouvez ajouter ce site web à la liste d'exclusion dans les paramètres de l'extension ou simplement désactiver l'extension pour ce site web en cliquant sur l'icône de l'extension dans la barre d'outils de votre navigateur." }, - "report_submitText": { + "report_submitSuccessText": { "message": "Rapport envoyé!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/_locales/it/messages.json b/packages/browser-extension/src/_locales/it/messages.json index 5e83409..9b2e968 100644 --- a/packages/browser-extension/src/_locales/it/messages.json +++ b/packages/browser-extension/src/_locales/it/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "Popup apparso" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "Sembra che ci sia già un problema aperto o contrassegnato come 'non risolvibile'. Per favore, entra nel problema per aggiungere ulteriori informazioni usando il pulsante seguente." + }, + "report_submitErrorText": { + "message": "Segnalazione non inviata?" + }, + "report_submitSuccessExtraText": { "message": "Mentre lavoriamo su questo, puoi aggiungere questo sito web alla lista di esclusione nelle impostazioni dell'estensione o semplicemente disattivare l'estensione per questo sito web cliccando sull'icona dell'estensione nella barra degli strumenti del browser." }, - "report_submitText": { + "report_submitSuccessText": { "message": "Rapporto inviato!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/_locales/pl/messages.json b/packages/browser-extension/src/_locales/pl/messages.json index 75612f4..50926a3 100644 --- a/packages/browser-extension/src/_locales/pl/messages.json +++ b/packages/browser-extension/src/_locales/pl/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "Pojawił się popup" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "Wygląda na to, że istnieje już otwarte zgłoszenie lub zostało oznaczone jako 'nie do rozwiązania'. Wprowadź zgłoszenie, aby dodać więcej informacji, używając poniższego przycisku." + }, + "report_submitErrorText": { + "message": "Raport nie został wysłany?" + }, + "report_submitSuccessExtraText": { "message": "Podczas gdy nad tym pracujemy, możesz dodać tę stronę do listy wykluczeń w ustawieniach rozszerzenia lub po prostu wyłączyć rozszerzenie dla tej strony, klikając ikonę rozszerzenia na pasku narzędzi przeglądarki." }, - "report_submitText": { + "report_submitSuccessText": { "message": "Zgłoszenie wysłane!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/_locales/pt_BR/messages.json b/packages/browser-extension/src/_locales/pt_BR/messages.json index 405044f..ed36806 100644 --- a/packages/browser-extension/src/_locales/pt_BR/messages.json +++ b/packages/browser-extension/src/_locales/pt_BR/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "Popup apareceu" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "Parece que já existe um problema aberto ou marcado como 'não corrigido'. Por favor, acesse o problema para adicionar mais informações usando o botão a seguir." + }, + "report_submitErrorText": { + "message": "Relatório não enviado?" + }, + "report_submitSuccessExtraText": { "message": "Enquanto estamos trabalhando nisso, você pode adicionar este site à lista de exclusão nas configurações da extensão ou simplesmente desativar a extensão para este site clicando no ícone da extensão na barra de ferramentas do navegador." }, - "report_submitText": { + "report_submitSuccessText": { "message": "Relatório enviado!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/_locales/pt_PT/messages.json b/packages/browser-extension/src/_locales/pt_PT/messages.json index b0afaa4..117e1c2 100644 --- a/packages/browser-extension/src/_locales/pt_PT/messages.json +++ b/packages/browser-extension/src/_locales/pt_PT/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "Popup apareceu" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "Parece que já existe um problema aberto ou marcado como 'não corrigido'. Por favor, aceda ao problema para adicionar mais informações usando o botão seguinte." + }, + "report_submitErrorText": { + "message": "Relatório não enviado?" + }, + "report_submitSuccessExtraText": { "message": "Enquanto trabalhamos nisso, pode adicionar este site à lista de exclusão nas definições da extensão ou simplesmente desativar a extensão para este site clicando no ícone da extensão na barra de ferramentas do navegador." }, - "report_submitText": { + "report_submitSuccessText": { "message": "Relatório enviado!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/_locales/ro/messages.json b/packages/browser-extension/src/_locales/ro/messages.json index ac2b767..fd91fa8 100644 --- a/packages/browser-extension/src/_locales/ro/messages.json +++ b/packages/browser-extension/src/_locales/ro/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "A apărut un popup" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "Se pare că există deja o problemă deschisă sau marcată ca 'nu va fi rezolvată'. Vă rugăm să intrați în problemă pentru a adăuga mai multe informații folosind butonul de mai jos." + }, + "report_submitErrorText": { + "message": "Raportul nu a fost trimis?" + }, + "report_submitSuccessExtraText": { "message": "În timp ce lucrăm la acest aspect, poți adăuga acest site web la lista de excludere din setările extensiei sau poți dezactiva extensia pentru acest site web făcând clic pe pictograma extensiei din bara de instrumente a browserului." }, - "report_submitText": { + "report_submitSuccessText": { "message": "Raport trimis!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/_locales/ru/messages.json b/packages/browser-extension/src/_locales/ru/messages.json index 528de50..a4bddf7 100644 --- a/packages/browser-extension/src/_locales/ru/messages.json +++ b/packages/browser-extension/src/_locales/ru/messages.json @@ -68,10 +68,16 @@ "report_reasonInputPlaceholder": { "message": "Появилось всплывающее окно" }, - "report_submitExtraText": { + "report_submitErrorExtraText": { + "message": "Похоже, что уже существует открытая проблема или она помечена как 'не будет исправлено'. Пожалуйста, войдите в проблему, чтобы добавить больше информации, используя следующую кнопку." + }, + "report_submitErrorText": { + "message": "Отчет не отправлен?" + }, + "report_submitSuccessExtraText": { "message": "Пока мы работаем над этим, вы можете добавить этот сайт в список исключений в настройках расширения или просто отключить расширение для этого сайта, нажав на значок расширения на панели инструментов вашего браузера." }, - "report_submitText": { + "report_submitSuccessText": { "message": "Отчет отправлен!" }, "report_urlInputError": { diff --git a/packages/browser-extension/src/popup.html b/packages/browser-extension/src/popup.html index a142cf6..53bb601 100644 --- a/packages/browser-extension/src/popup.html +++ b/packages/browser-extension/src/popup.html @@ -244,7 +244,31 @@ -