Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UX Improvements #25

Merged
merged 1 commit into from
Aug 2, 2023
Merged

UX Improvements #25

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions chrome/manifest.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"manifest_version": 3,
"name": "Kagi Search for Chrome",
"version": "0.3.5",
"version": "0.3.6",
"description": "A simple extension for setting Kagi as a default search engine, and automatically logging in to Kagi in incognito browsing windows",
"background": {
"service_worker": "src/background.js",
Expand All @@ -19,12 +19,12 @@
"default_popup": "src/popup.html"
},
"permissions": [
"activeTab",
"cookies",
"declarativeNetRequestWithHostAccess",
"webRequest",
"storage"
],
"optional_permissions": ["activeTab"],
"host_permissions": ["https://kagi.com/*"],
"chrome_settings_overrides": {
"search_provider": {
Expand Down
7 changes: 4 additions & 3 deletions firefox/manifest.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"manifest_version": 3,
"name": "Kagi Search for Firefox",
"version": "0.3.5",
"version": "0.3.6",
"description": "A simple helper extension for setting Kagi as a default search engine, and automatically logging in to Kagi in incognito browsing windows.",
"background": {
"page": "src/background_page.html"
Expand All @@ -18,12 +18,12 @@
"default_popup": "src/popup.html"
},
"permissions": [
"activeTab",
"cookies",
"declarativeNetRequestWithHostAccess",
"webRequest",
"storage"
],
"optional_permissions": ["activeTab"],
"host_permissions": ["https://kagi.com/*"],
"chrome_settings_overrides": {
"search_provider": {
Expand All @@ -47,7 +47,8 @@
},
"browser_specific_settings": {
"gecko": {
"id": "[email protected]"
"id": "[email protected]",
"strict_min_version": "102.0"
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

}
}
}
25 changes: 6 additions & 19 deletions shared/src/background.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { summarizeContent } from './lib/utils.js';
import { summarizeContent, fetchSettings } from './lib/utils.js';

if (!globalThis.browser) {
globalThis.browser = chrome;
Expand Down Expand Up @@ -167,25 +167,12 @@ browser.commands.onCommand.addListener(async (command) => {
});

async function loadStorageData() {
const sessionObject = await browser.storage.local.get('session_token');
if (sessionObject?.session_token) {
sessionToken = sessionObject.session_token;
}

const syncObject = await browser.storage.local.get('sync_existing');
if (typeof syncObject?.sync_existing !== 'undefined') {
syncSessionFromExisting = syncObject.sync_existing;
}
const { token, sync_existing, api_token, api_engine } = await fetchSettings();

const apiObject = await browser.storage.local.get('api_token');
if (typeof apiObject?.api_token !== 'undefined') {
sessionApiToken = apiObject.api_token;
}

const apiEngineObject = await browser.storage.local.get('api_engine');
if (typeof apiEngineObject?.api_engine !== 'undefined') {
sessionApiEngine = apiEngineObject.api_engine;
}
sessionToken = token;
syncSessionFromExisting = sync_existing;
sessionApiToken = api_token;
sessionApiEngine = api_engine;
}

loadStorageData();
30 changes: 27 additions & 3 deletions shared/src/lib/utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,9 @@ export async function summarizeContent({
}) {
let summary = 'Unknown error';
let success = false;
const useApi = Boolean(api_token);
const useApi = Boolean(
api_token && ((api_engine && api_engine !== 'cecil') || text),
);
Comment on lines +16 to +18
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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


try {
const requestParams = {
Expand Down Expand Up @@ -95,19 +97,41 @@ export async function summarizeContent({
};
}

export async function updateSettings(handleGetData) {
export async function fetchSettings() {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

const sessionObject = await browser.storage.local.get('session_token');
const syncObject = await browser.storage.local.get('sync_existing');
const apiObject = await browser.storage.local.get('api_token');
const apiEngineObject = await browser.storage.local.get('api_engine');

await handleGetData({
return {
token: sessionObject?.session_token,
sync_existing:
typeof syncObject?.sync_existing !== 'undefined'
? syncObject.sync_existing
: true,
api_token: apiObject?.api_token,
api_engine: apiEngineObject?.api_engine,
};
}

export async function getActiveTab() {
const tabs = await browser.tabs.query({
active: true,
lastFocusedWindow: true,
});

// Chrome/Firefox might give us more than one active tab when something like "chrome://*" or "about:*" is also open
const tab =
tabs.find(
(tab) =>
tab?.url?.startsWith('http://') || tab?.url?.startsWith('https://'),
) || tabs[0];

if (!tab || !tab.url) {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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).

console.error('No tab/url found.');
console.error(tabs);
return null;
}

return tab;
}
17 changes: 12 additions & 5 deletions shared/src/popup.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,7 @@ h3 {
#incognito {
max-width: 100%;
padding: 0 15px;
font-size: 0.9rem;
}

.setting_row {
Expand Down Expand Up @@ -285,19 +286,19 @@ p {
right: 2px;
}

#summarize {
#summarize, #request_permissions {
margin-top: 10px;
width: 100%;
padding: 0 15px;
}

#summarize .setting_row {
#summarize .setting_row, #request_permissions .setting_row {
margin-top: 10px;
padding: 0;
justify-content: space-between;
}

#summarize .setting_row > div {
#summarize .setting_row > div, #request_permissions .setting_row > div {
margin-right: 10px;
}

Expand All @@ -306,7 +307,7 @@ p {
margin-bottom: 5px;
}

#summarize_page {
#summarize_page, #request_permissions_button {
background-color: #ffb319;
border: 1px solid #ffb319;
color: #191919;
Expand All @@ -320,7 +321,13 @@ p {
margin-right: 10px;
}

#summarize_page:hover {
#request_permissions_button {
max-width: 400px;
margin-left: auto;
margin-right: auto;
}

#summarize_page:hover, #request_permissions_button:hover {
background-color: #f7a808;
border: 1px solid #d9950d;
}
20 changes: 17 additions & 3 deletions shared/src/popup.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@
<div>
<label class="title" for="engine">API Summarizer Engine</label>
<select id="engine">
<option value="cecil" selected="selected">Cecil</option>
<option value="cecil" selected="selected">Cecil (free)</option>
<option value="agnes">Agnes</option>
<option value="daphne">Daphne</option>
<option value="muriel">Muriel</option>
Expand All @@ -173,15 +173,15 @@
</div>

<div class="setting_row">
<div>
<div class="summarize_option">
<label for="summary_type">Summary Type</label>
<select id="summary_type">
<option value="summary" selected="selected">Summary</option>
<option value="takeaway">Key Moments</option>
</select>
</div>

<div>
<div class="summarize_option">
<label for="target_language">Output Language</label>
<select id="target_language">
<option value="" selected="selected">Default</option>
Expand Down Expand Up @@ -220,6 +220,20 @@
<button id="summarize_page">Summarize</button>
</div>
</div>

<div id="request_permissions" style="display: none">

<div class="title">
Summarize the current page
</div>

<div class="desc">Allow accessing the currently active tab, so it can be summarized.</div>

<div class="setting_row">
<button id="request_permissions_button">Request access</button>
</div>
</div>

</div>
<script type="module" src="popup.js"></script>
</body>
Expand Down
Loading