Skip to content

Commit

Permalink
feat: migrate web storage to chrome storage
Browse files Browse the repository at this point in the history
Aqours committed Nov 30, 2023
1 parent 7694ffc commit 6cf2dd9
Showing 5 changed files with 113 additions and 61 deletions.
23 changes: 9 additions & 14 deletions src/scripts/background/start-changelog.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { K_AUTO_DISPLAY_CHANGELOG, PConfig } from "../sharre/constant.js";
import { K_AUTO_DISPLAY_CHANGELOG } from "../sharre/constant.js";
import { chromeStorageSync } from "../sharre/chrome-storage.js";

/**
* Changelog
@@ -20,18 +21,12 @@ chrome.runtime.onInstalled.addListener((details) => {
return;
}
}
chrome.storage.sync.get(
{
[K_AUTO_DISPLAY_CHANGELOG]: PConfig.defaultOptions.autoDisplayChangelog,
},
(items) => {
if (chrome.runtime.lastError) return;
if (items[K_AUTO_DISPLAY_CHANGELOG]) {
chrome.tabs.create({
url: chrome.i18n.getMessage("project_changelog"),
});
}
},
);
chromeStorageSync.promise.then((items) => {
if (items[K_AUTO_DISPLAY_CHANGELOG]) {
chrome.tabs.create({
url: chrome.i18n.getMessage("project_changelog"),
});
}
});
}
});
21 changes: 7 additions & 14 deletions src/scripts/options.ts
Original file line number Diff line number Diff line change
@@ -6,6 +6,7 @@ import {
K_KEEP_LAST_SEARCH_STATUS,
ChromeExtensionType,
} from "./sharre/constant.js";
import { chromeStorageSync } from "./sharre/chrome-storage.js";

/**
* @desc i18n
@@ -26,23 +27,15 @@ function setOptionsItem(node: HTMLInputElement, items: Record<string, any>, key:
});
}

chrome.storage.sync.get(
{
[K_AUTO_DISPLAY_CHANGELOG]: PConfig.defaultOptions.autoDisplayChangelog,
[K_KEEP_LAST_SEARCH_STATUS]: PConfig.defaultOptions.keepLastSearchStatus,
},
(items) => {
if (chrome.runtime.lastError) return;
setOptionsItem(document.querySelector(`input[value="update_details"]`), items, K_AUTO_DISPLAY_CHANGELOG);
setOptionsItem(document.querySelector(`input[value="search_status"]`), items, K_KEEP_LAST_SEARCH_STATUS);
},
);
chromeStorageSync.promise.then((items) => {
setOptionsItem(document.querySelector(`input[value="update_details"]`), items, K_AUTO_DISPLAY_CHANGELOG);
setOptionsItem(document.querySelector(`input[value="search_status"]`), items, K_KEEP_LAST_SEARCH_STATUS);
});

/**
* @desc 配置数据同步
*/
chrome.storage.sync.get(K_EXTENSION_TYPE_CHECKED, (items) => {
if (chrome.runtime.lastError) return;
chromeStorageSync.promise.then((items) => {
const eTypeChecked = Object.assign(PConfig.eTypeChecked, items[K_EXTENSION_TYPE_CHECKED]);
for (const [type, checked] of Object.entries<boolean>(eTypeChecked)) {
const node = document.querySelector<HTMLInputElement>(`input[value="${type}"]`);
@@ -52,7 +45,7 @@ chrome.storage.sync.get(K_EXTENSION_TYPE_CHECKED, (items) => {
node.disabled = disabled;
node.addEventListener("click", (e) => {
if (!disabled) {
eTypeChecked[type] = node.checked;
eTypeChecked[type as ChromeExtensionType] = node.checked;
chrome.storage.sync.set({
[K_EXTENSION_TYPE_CHECKED]: eTypeChecked,
});
37 changes: 23 additions & 14 deletions src/scripts/popup.ts
Original file line number Diff line number Diff line change
@@ -5,6 +5,7 @@ import {
K_LAST_SEARCH_USER_INPUT,
PConfig,
} from "./sharre/constant.js";
import { chromeStorageLocal, chromeStorageSync } from "./sharre/chrome-storage.js";

class ExtensionManager {
excludeTypeSet: Set<string>;
@@ -37,35 +38,43 @@ class ExtensionManager {
}

async init() {
this.getLastSearchUserInput();
this.getDisabledExtensionIds();
await this.getLastSearchUserInput();
await this.getDisabledExtensionIds();
await this.renderFrameContent();
this.registerAutoFocusEvent();
this.registerUserInputEvent();
this.registerOtherEvents();
}

getLastSearchUserInput() {
async getLastSearchUserInput() {
if (this.enableLastSearchStatus) {
const data = localStorage.getItem(K_LAST_SEARCH_USER_INPUT);
if (typeof data === "string") {
this.lastSearchUserInput = data;
}
chromeStorageLocal.promise.then((items) => {
const data = items[K_LAST_SEARCH_USER_INPUT];
if (typeof data === "string") {
this.lastSearchUserInput = data;
}
});
}
}

setLastSearchUserInput() {
localStorage.setItem(K_LAST_SEARCH_USER_INPUT, this.lastSearchUserInput);
chromeStorageLocal.set({
[K_LAST_SEARCH_USER_INPUT]: this.lastSearchUserInput,
});
}

getDisabledExtensionIds() {
const data = localStorage.getItem(K_DISABLED_EXTENSION_ID);
const list = data ? data.split(",") : [];
list.forEach((id) => this.disabledExtensionIdSet.add(id));
async getDisabledExtensionIds() {
return chromeStorageLocal.promise.then((items) => {
const data = items[K_DISABLED_EXTENSION_ID];
const list = data ? data.split(",") : [];
list.forEach((id) => this.disabledExtensionIdSet.add(id));
});
}

setDisabledExtensionIds() {
localStorage.setItem(K_DISABLED_EXTENSION_ID, Array.from(this.disabledExtensionIdSet).join(","));
chromeStorageLocal.set({
[K_DISABLED_EXTENSION_ID]: Array.from(this.disabledExtensionIdSet).join(","),
});
}

resetContainerContents() {
@@ -328,7 +337,7 @@ class ExtensionManager {
}
}

chrome.storage.sync.get([K_EXTENSION_TYPE_CHECKED, K_KEEP_LAST_SEARCH_STATUS], (items) => {
chromeStorageSync.promise.then((items) => {
const excludeTypeSet: Set<string> = new Set();
const eTypeChecked = Object.assign(PConfig.eTypeChecked, items[K_EXTENSION_TYPE_CHECKED]);
const enableLastSearchStatus = Boolean(
72 changes: 72 additions & 0 deletions src/scripts/sharre/chrome-storage.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
import {
ChromeExtensionType,
K_AUTO_DISPLAY_CHANGELOG,
K_DISABLED_EXTENSION_ID,
K_EXTENSION_TYPE_CHECKED,
K_KEEP_LAST_SEARCH_STATUS,
K_LAST_SEARCH_USER_INPUT,
PConfig,
} from "./constant.js";

interface IChromeStorageLocalInfo {
[K_DISABLED_EXTENSION_ID]: string;
[K_LAST_SEARCH_USER_INPUT]: string;
}

interface IChromeStorageSyncInfo {
[K_EXTENSION_TYPE_CHECKED]: Record<ChromeExtensionType, boolean>;
[K_AUTO_DISPLAY_CHANGELOG]: boolean;
[K_KEEP_LAST_SEARCH_STATUS]: boolean;
}

const SADCache = new Map<chrome.storage.AreaName, unknown>();

async function initializeStorageArea<T extends object>(areaName: chrome.storage.AreaName, keys?: unknown): Promise<T> {
const promise = chrome.storage[areaName].get(keys) as Promise<T>;
promise.then((data) => SADCache.set(areaName, data));
return promise;
}

chrome.storage.onChanged.addListener((changes, areaName) => {
const data: Record<string, unknown> = SADCache.get(areaName) || Object.create(null);

for (let [key, { oldValue, newValue }] of Object.entries(changes)) {
data[key] = newValue;
}

SADCache.set(areaName, data);
});

class ChromeStorageArea<T extends object> {
readonly __initPromise: Promise<T>;

get promise(): Promise<T> {
if (SADCache.has(this.areaName)) {
return Promise.resolve(SADCache.get(this.areaName)) as Promise<T>;
} else {
return this.__initPromise;
}
}

constructor(
readonly areaName: chrome.storage.AreaName,
keys?: Partial<T>,
) {
this.__initPromise = initializeStorageArea<T>(this.areaName, keys);
}

get(): T {
return (SADCache.get(this.areaName) || Object.create(null)) as T;
}

set(items: Partial<T>): Promise<void> {
return chrome.storage[this.areaName].set(items);
}
}

export const chromeStorageLocal = new ChromeStorageArea<IChromeStorageLocalInfo>("local");

export const chromeStorageSync = new ChromeStorageArea<IChromeStorageSyncInfo>("sync", {
[K_AUTO_DISPLAY_CHANGELOG]: PConfig.defaultOptions.autoDisplayChangelog,
[K_KEEP_LAST_SEARCH_STATUS]: PConfig.defaultOptions.keepLastSearchStatus,
});
21 changes: 2 additions & 19 deletions src/scripts/sharre/constant.ts
Original file line number Diff line number Diff line change
@@ -1,34 +1,17 @@
/**
* @desc chrome.StorageArea
* @desc chrome.StorageArea.sync
*/
export const K_EXTENSION_TYPE_CHECKED = "extension_type_checked"; // 用于存储扩展类型的状态
export const K_AUTO_DISPLAY_CHANGELOG = "auto_display_changelog";
export const K_KEEP_LAST_SEARCH_STATUS = "keep_last_search_status";

/**
* chrome.StorageArea schema
*/
interface ChromeStorageArea {
[K_EXTENSION_TYPE_CHECKED]: Record<ChromeExtensionType, boolean>;
[K_AUTO_DISPLAY_CHANGELOG]: boolean;
[K_KEEP_LAST_SEARCH_STATUS]: boolean;
}

/**
* @desc for `popup` page
* @desc localStorage/sessionStorage
* @desc chrome.StorageArea.local
*/
export const K_DISABLED_EXTENSION_ID = "disabled_extension_id"; // 用于存储被批量方式禁用的扩展ID
export const K_LAST_SEARCH_USER_INPUT = "last_search_user_input";

/**
* localStorage schema
*/
interface WebLocalStorage {
[K_DISABLED_EXTENSION_ID]: string;
[K_LAST_SEARCH_USER_INPUT]: string;
}

/**
* @enum
* @see https://developer.chrome.com/extensions/management#type-ExtensionType

0 comments on commit 6cf2dd9

Please sign in to comment.