UX Improvements #25

BrunoBernardino · 2023-08-02T14:58:57Z

This includes a lot of UX improvements and cleanup, done while the research for other features/improvements was underway:

The extension can now be used without granting the activeTab permission, where it'll just behave as it did before 0.3, simply allowing Kagi to be used in private sessions (Firefox: toolbar icon now always has a notification dot under it #19)
The extension should now be fully usable in Firefox for Android ([Request] Compatibility with Firefox for Android #3)
The extension will now look for the active tab of the last focused window (alternative fix to Edge issue reported in Use chrome.tabs.query instead of browser.tabs.query and limit to curr… #24 with multiple windows)
I confirmed the extension works as expected in Edge (and Brave, besides Chrome) without any new (invasive) permissions (Replacing tabs permission to allow Microsoft Edge to work correctly #23)
Using Cecil will now not call the API, even if an API Key is set (https://kagifeedback.org/d/1751-enable-kagi-api-users-to-use-universal-summarizer-cecil-without-incurring-api-charges)
Confirmed there's no other current way of storing the session that survives clearing of session data (https://kagifeedback.org/d/1754-restarting-the-firefox-browser-signs-me-out-of-kagi)

Additionally, I looked into sending the tab's HTML/Text content instead of the URL with a setting/dropdown (https://discord.com/channels/849884108750061568/1050508822864732170/1125156451015475364), but decided against it, because we would need access to the tab's DOM content, and the only ways I found to do that were too invasive in terms of permissions (scripting, which could be optional, and wildcard host, which could not be optional). Source

Fixes #19
Fixes #3
Closes #24

kagi_chrome_0.3.6.zip

kagi_firefox_0.3.6.zip

This includes a lot of UX improvements and cleanup, done while the research for other features/improvements was underway: - The extension can now be used without granting the `activeTab` permission, where it'll just behave as it did before `0.3`, simply allowing Kagi to be used in private sessions (#19) - The extension should now be fully usable in Firefox for Android (#3) - The extension will now look for the active tab of the last focused window (alternative fix to Edge issue reported in #24 with multiple windows) - I confirmed the extension works as expected in Edge (and Brave, besides Chrome) without any new (invasive) permissions (#23) - Using Cecil will now not call the API, even if an API Key is set (https://kagifeedback.org/d/1751-enable-kagi-api-users-to-use-universal-summarizer-cecil-without-incurring-api-charges) - Confirmed there's no other current way of storing the session that survives clearing of session data (https://kagifeedback.org/d/1754-restarting-the-firefox-browser-signs-me-out-of-kagi) Additionally, I looked into sending the tab's HTML/Text content instead of the URL with a setting/dropdown (https://discord.com/channels/849884108750061568/1050508822864732170/1125156451015475364), but decided against it, because we would need access to the tab's DOM content, and the only ways I found to do that were too invasive in terms of permissions (`scripting`, which could be optional, and wildcard host, which could not be optional). [Source](https://stackoverflow.com/questions/19758028/chrome-extension-get-dom-content) Fixes #19 Fixes #3 Closes #24

BrunoBernardino · 2023-08-02T14:59:55Z

firefox/manifest.json

@@ -47,7 +47,8 @@
  },
  "browser_specific_settings": {
    "gecko": {
-      "id": "[email protected]"
+      "id": "[email protected]",
+      "strict_min_version": "102.0"


This was the main thing preventing the extension from being compatible with Firefox. This version (102) is 1 year old, so I don't expect people to have problems not being able to install the extension.

BrunoBernardino · 2023-08-02T15:01:05Z

shared/src/lib/utils.js

+  const useApi = Boolean(
+    api_token && ((api_engine && api_engine !== 'cecil') || text),
+  );


Now we'll only use the API if there's a an API Key and the engine isn't Cecil.

BrunoBernardino · 2023-08-02T15:02:30Z

shared/src/lib/utils.js

@@ -95,19 +97,41 @@ export async function summarizeContent({
  };
 }

-export async function updateSettings(handleGetData) {
+export async function fetchSettings() {


Made this function more "standard" (not taking a callback, returning the object).

BrunoBernardino · 2023-08-02T15:03:48Z

shared/src/lib/utils.js

+        tab?.url?.startsWith('http://') || tab?.url?.startsWith('https://'),
+    ) || tabs[0];
+
+  if (!tab || !tab.url) {


Found this new case, after permissions were granted, before they were requested, where we'd get a tab without a url. That would cause an "Invalid URL" error. The "fix" was simply to close the extension after requesting the permissions for the first time (so we can load it up with permissions).

BrunoBernardino · 2023-08-02T15:04:36Z

shared/src/popup.js

@@ -77,113 +78,135 @@ function setStatus(type) {
 }

 async function setup() {
-  const eTokenDiv = document.querySelector('#token');


I also renamed a lot of variables and functions as I was going through some other cleanup of logic and adding a new option (which was then removed, for the URL/text select).

BrunoBernardino · 2023-08-02T15:06:24Z

shared/src/popup.js

+        const hasPermissions = await browser.permissions.contains({
+          permissions: ['activeTab'],
+        });


One interesting, hard to debug fact is that Firefox will complain if you try to check for permissions and request them on the same event loop. That's why I ended up having to create a separate button/section (initially I just had the selects hide and the summarize button change its text). Chrome didn't care, though.

BrunoBernardino · 2023-08-02T15:08:15Z

shared/src/summarize_result.js

+        summaryTextContents = new DOMParser().parseFromString(
+          data.summary.replaceAll(/<br>/g, '\n'),
+          'text/html',
+        ).documentElement.textContent;


This was necessary because of some escaped HTML entities we receive from the summarizer, and because we're not setting it as text, not HTML.

BrunoBernardino · 2023-08-02T15:09:02Z

shared/src/summarize_result.js

@@ -63,50 +66,50 @@ async function setup() {
      }

      summaryResultElement.style.display = '';
-      summaryResultElement.innerHTML = data.summary.replaceAll(/\n/g, '<br />');
+      summaryResultElement.innerText = summaryTextContents;


This was the other piece required to be changed for the Firefox for Android extension to not show a warning.

BrunoBernardino · 2023-08-02T15:10:11Z

shared/src/summarize_result.js

+    const hasTabAccess = await browser.permissions.contains({
+      permissions: ['activeTab'],
+    });
+
+    if (!hasTabAccess) {
+      summaryResultElement.style.display = '';
+      summaryResultElement.classList.add('error');
+      summaryResultElement.innerText =
+        "You can't summarize without allowing access to the currently active tab.";
+      return;


This is just a "safety check" in case the shortcut is set and called before permissions are given (can't request them from here easily since it needs a button click, as an example -- it seemed unnecessary to rebuild that UI here, for this case, as it already exists in the main popup).

BrunoBernardino requested a review from vprelovac August 2, 2023 14:58

BrunoBernardino self-assigned this Aug 2, 2023

BrunoBernardino commented Aug 2, 2023

View reviewed changes

vprelovac merged commit 5d42c3b into main Aug 2, 2023

BrunoBernardino deleted the feature/ux-improvements branch August 2, 2023 15:14

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

UX Improvements #25

UX Improvements #25

BrunoBernardino commented Aug 2, 2023 •

edited

Loading

BrunoBernardino Aug 2, 2023

BrunoBernardino Aug 2, 2023

BrunoBernardino Aug 2, 2023

BrunoBernardino Aug 2, 2023

BrunoBernardino Aug 2, 2023 •

edited

Loading

BrunoBernardino Aug 2, 2023

BrunoBernardino Aug 2, 2023 •

edited

Loading

BrunoBernardino Aug 2, 2023

BrunoBernardino Aug 2, 2023

UX Improvements #25

UX Improvements #25

Conversation

BrunoBernardino commented Aug 2, 2023 • edited Loading

BrunoBernardino Aug 2, 2023

Choose a reason for hiding this comment

BrunoBernardino Aug 2, 2023

Choose a reason for hiding this comment

BrunoBernardino Aug 2, 2023

Choose a reason for hiding this comment

BrunoBernardino Aug 2, 2023

Choose a reason for hiding this comment

BrunoBernardino Aug 2, 2023 • edited Loading

Choose a reason for hiding this comment

BrunoBernardino Aug 2, 2023

Choose a reason for hiding this comment

BrunoBernardino Aug 2, 2023 • edited Loading

Choose a reason for hiding this comment

BrunoBernardino Aug 2, 2023

Choose a reason for hiding this comment

BrunoBernardino Aug 2, 2023

Choose a reason for hiding this comment

BrunoBernardino commented Aug 2, 2023 •

edited

Loading

BrunoBernardino Aug 2, 2023 •

edited

Loading

BrunoBernardino Aug 2, 2023 •

edited

Loading