From a231732041ac5a793fc5a6f808a7588a1f7dd7c7 Mon Sep 17 00:00:00 2001 From: msramalho <19508417+msramalho@users.noreply.github.com> Date: Wed, 26 Apr 2023 23:39:24 +0100 Subject: [PATCH] new version --- package.json | 2 +- source/css/popup.css | 20 ++++++- source/js/background.js | 57 ++++++++++++------- source/vue/Popup.vue | 121 +++++++++++++++++++++++++--------------- source/vue/TaskItem.vue | 7 ++- 5 files changed, 136 insertions(+), 71 deletions(-) diff --git a/package.json b/package.json index 377c295..70cee5e 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "private": true, "scripts": { - "build": "rm -rf distribution && rm -f distribution.zip && API_ENDPOINT=http://134.122.58.133:8004/tasks parcel build source/manifest.json --no-content-hash --no-source-maps --dist-dir distribution --no-cache --detailed-report 0 && zip -r distribution.zip distribution", + "build": "rm -rf distribution && rm -f distribution.zip && API_ENDPOINT=http://134.122.58.133:8004 parcel build source/manifest.json --no-content-hash --no-source-maps --dist-dir distribution --no-cache --detailed-report 0 && zip -r distribution.zip distribution", "lint": "run-p lint:*", "lint-fix": "run-p 'lint:* -- --fix'", "lint:css": "stylelint source/**/*.css", diff --git a/source/css/popup.css b/source/css/popup.css index 488c95d..8ac7f24 100644 --- a/source/css/popup.css +++ b/source/css/popup.css @@ -5,7 +5,9 @@ body { #app { min-width: 45em; /* min-height: 175px; */ - margin: 15px; + margin: 10px; + margin-left: 15px; + margin-right: 15px; } #icon { @@ -19,6 +21,17 @@ table.archive-results .row { max-width: 100px; } +textarea { + min-width: 50em; + max-width: 55em; + min-height: 30px; + max-height: 300px; +} + +.section-title { + color: teal; +} + /* .archive-results td { width: auto; } @@ -51,12 +64,15 @@ table td { width: auto; display: inline; margin-left: 10px; + padding:0px; + height: initial; + } .form-guide { font-size: 1rem; color: #9e9e9e; - margin-right: 10px; + margin-right: 10px; } .switch label { diff --git a/source/js/background.js b/source/js/background.js index cb87685..8ba6a54 100644 --- a/source/js/background.js +++ b/source/js/background.js @@ -2,9 +2,10 @@ import optionsStorage from './options-storage.js'; import { getReasonPhrase } from 'http-status-codes'; -const API_ENDPOINT = process.env.API_ENDPOINT || 'http://localhost:8004/tasks'; +const API_ENDPOINT = process.env.API_ENDPOINT || 'http://localhost:8004'; +const API_ENDPOINT_TASKS = `${API_ENDPOINT}/tasks`; -console.log(`using API_ENDPOINT=${API_ENDPOINT}`) +console.log(`API_ENDPOINT=${API_ENDPOINT}`) const LOGIN_FAILED = `Please login before using this feature.`; @@ -30,8 +31,12 @@ function processMessages(request, sender) { console.info(`action {${request.action}} from ${sender.tab ? 'content-script (' + sender.tab.url + ')' : 'the extension'}`); switch (request.action) { + case 'home': { + callHome(resolve, reject); + break; + } case 'archive': { - archiveUrl(resolve, reject, request.optionalUrl); + archiveUrl(resolve, reject, request.optionalUrl, request.archiveCreate); break; } case 'search': { @@ -121,7 +126,24 @@ function logout(resolve, reject) { resolve(true); } -function archiveUrl(resolve, reject, optionalUrl) { +function callHome(resolve, reject) { + chrome.identity.getAuthToken({ interactive: false }, async accessToken => { + return new Promise(() => { + fetch(API_ENDPOINT, { + method: 'GET', + headers: { + 'Content-Type': 'application/json', + 'Authorization': `Bearer ${accessToken}` + } + }) + .then(getJsonOrError) + .then(response => resolve(response)) + .catch(e => reject(e)); + }); + }); +} + +function archiveUrl(resolve, reject, optionalUrl, archiveCreate) { chrome.identity.getAuthToken({ interactive: false }, async accessToken => { if (accessToken == undefined) { reject(new Error(LOGIN_FAILED)); @@ -131,11 +153,10 @@ function archiveUrl(resolve, reject, optionalUrl) { active: true, lastFocusedWindow: true, }, async tabs => { - console.warn(optionalUrl) - const url = optionalUrl || tabs[0].url; - console.log(`url=${url}`); - submitUrlArchive(url, accessToken).then(async response => { - const newArchive = { url, id: response.id, status: 'PENDING', result: {} }; + archiveCreate.url = optionalUrl || tabs[0].url; + console.log(`archiveCreate=${JSON.stringify(archiveCreate)}`); + submitUrlArchive(archiveCreate, accessToken).then(async response => { + const newArchive = { url: archiveCreate.url, id: response.id, status: 'PENDING', result: {} }; await upsertTask(newArchive); resolve(newArchive); }).catch(e => reject(e)); @@ -143,20 +164,16 @@ function archiveUrl(resolve, reject, optionalUrl) { }); } -function submitUrlArchive(url, accessToken) { +function submitUrlArchive(archiveCreate, accessToken) { console.log('API: SUBMIT'); return new Promise((resolve, reject) => { - fetch(API_ENDPOINT, { + fetch(API_ENDPOINT_TASKS, { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${accessToken}` }, - body: JSON.stringify({ - url, - group_id: null, - tags: [] - }), + body: JSON.stringify(archiveCreate), }) .then(getJsonOrError) .then(response => resolve(response)) @@ -172,7 +189,7 @@ function checkTaskStatus(resolve, reject, task) { reject(new Error(LOGIN_FAILED)); return; } - fetch(`${API_ENDPOINT}/${task.id}`, { + fetch(`${API_ENDPOINT_TASKS}/${task.id}`, { method: 'GET', headers: { 'Content-Type': 'application/json', @@ -205,7 +222,7 @@ function search(resolve, reject, url) { reject(new Error(LOGIN_FAILED)); return; } - fetch(`${API_ENDPOINT}/search-url?` + new URLSearchParams({ url }), { + fetch(`${API_ENDPOINT_TASKS}/search-url?` + new URLSearchParams({ url }), { method: 'GET', headers: { 'Content-Type': 'application/json', @@ -225,7 +242,7 @@ async function syncLocalTasks(resolve, reject) { reject(new Error(LOGIN_FAILED)); return; } - fetch(`${API_ENDPOINT}/sync`, { + fetch(`${API_ENDPOINT_TASKS}/sync`, { method: 'GET', headers: { 'Content-Type': 'application/json', @@ -257,7 +274,7 @@ async function deleteTask(resolve, reject, taskId) { reject(new Error(LOGIN_FAILED)); return; } - fetch(`${API_ENDPOINT}/${taskId}`, { + fetch(`${API_ENDPOINT_TASKS}/${taskId}`, { method: 'DELETE', headers: { 'Content-Type': 'application/json', diff --git a/source/vue/Popup.vue b/source/vue/Popup.vue index 0db2b76..c9b22fb 100644 --- a/source/vue/Popup.vue +++ b/source/vue/Popup.vue @@ -10,57 +10,55 @@ href="javascript:void(0);">Brave.

Error: {{ errorMessage }}
-
- icon - auto-archiver extension +
+ Archive - +
+ +
+
+ + + + + + + +
+ Tags: + +
+ + +
+
+
+ +
Search archives - - - - -
-
search @@ -84,6 +82,7 @@ No results... do you want to archive?
+

logout + icon + auto-archiver extension v {{ version }} | Issue tracker - version {{ version }}

@@ -113,16 +113,38 @@ export default { isSearchingOnline: false, search: '', errorMessage: '', - public: true, + _public: true, tagsChips: null, + groupVisibility: "-1", + groups: null, version: chrome.runtime.getManifest().version, }; }, methods: { + /** + * Calls base endpoint '/' to check for errorMessage and groups + * @param {*} _ + */ + callHome: function (_) { + (async () => { + const response = await this.callBackground({ action: "home" }); + if (!response) return; + console.log(`HOME STATUS = ${response}`) + if (response?.breakingChanges?.minVersion > this.version) { + M.toast({ html: `${response.breakingChanges.message} (minimum version is ${response.breakingChanges.minVersion})`, classes: "light-blue darken-2" }); + } + if (response.groups) { this.groups = response.groups } + })(); + }, archive: function (_, searchTerm) { (async () => { - console.log(this.tags) - const response = await this.callBackground({ action: "archive", optionalUrl: searchTerm }); + const response = await this.callBackground({ + action: "archive", optionalUrl: searchTerm, archiveCreate: { + public: this._public, + group_id: this.groupVisibility != "-1" ? this.groupVisibility : undefined, + tags: this.tags + } + }); if (!response) return; this.url = response.url; this.id = response.id; @@ -168,6 +190,7 @@ export default { M.toast({ html: `login failed: ${loginResult.message}`, classes: "red darken-1" }); } } + this.callHome(); })(); }, logout: function () { @@ -261,7 +284,11 @@ export default { return Object.keys(this.onlineTasks).length > 0; }, tags() { - return this?.tagsChips?.chipsData; + return this?.tagsChips?.chipsData?.map(chip => chip.tag); + }, + + archiveReady() { + return this._public || (!this._public && this.groupVisibility != undefined && this.groupVisibility != "-1") } }, mounted() { @@ -269,7 +296,9 @@ export default { this.displayAllTasks(); this.oauthLogin(false); this.displayErrorMessage(); - this.tagsChips = M.Chips.getInstance((document.querySelector('#tagChips'))); + // M.Chips.init([document.querySelector('#tagChips')], {placeholder: "You can add one more more tag"}) + this.tagsChips = M.Chips.getInstance(document.querySelector('#tagChips')); + console.log(this.tagsChips) }, created() { }, components: { diff --git a/source/vue/TaskItem.vue b/source/vue/TaskItem.vue index d8b4742..d3d19e9 100644 --- a/source/vue/TaskItem.vue +++ b/source/vue/TaskItem.vue @@ -25,8 +25,11 @@ {{ task.url }} - {{ task?.result?.status || "open" - }}{{ task?.result?.status || 'no result' }} + + + {{ task?.result?.status || "open" }} + {{ task?.result?.error || 'no result' }} + {{ readbleDate }} delete