Skip to content

Commit 245909c

Browse files
thanhlmmthanhlmm
committed
Add background script
1 parent 707adfa commit 245909c

File tree

9 files changed

+196
-18
lines changed

9 files changed

+196
-18
lines changed

‎auto-imports.d.ts

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
// Generated by 'unplugin-auto-import'
2+
export {}
3+
declare global {
4+
const browser: typeof import('webextension-polyfill')['default']
5+
}

‎package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@
2424
"svelte-preprocess": "^4.9.8",
2525
"tslib": "^2.3.1",
2626
"typescript": "^4.4.4",
27+
"unplugin-auto-import": "^0.11.1",
2728
"vite": "~2.9.0",
2829
"web-ext": "^6.6.0"
2930
},
@@ -38,8 +39,8 @@
3839
"numeral": "^2.0.6",
3940
"svelte-windicss-preprocess": "^4.2.8",
4041
"tippy.js": "^6.3.7",
41-
"vite-imagetools": "^4.0.4",
4242
"url-pattern": "^1.0.3",
43+
"vite-imagetools": "^4.0.4",
4344
"webext-bridge": "^5.0.5",
4445
"webextension-polyfill": "^0.9.0",
4546
"windicss": "^3.5.6"

‎src/entries/background/main.ts

+39-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,43 @@
1-
import browser from "webextension-polyfill";
1+
import * as browser from "webextension-polyfill";
2+
import { onMessage } from "webext-bridge";
23

34
browser.runtime.onInstalled.addListener(() => {
45
console.log("Extension installed");
56
});
7+
8+
console.log(browser);
9+
10+
const fetchBasicData = async () => {
11+
const list = await fetch("https://api.coingecko.com/api/v3/search").then(
12+
(response) => response.json()
13+
);
14+
console.log(browser.storage);
15+
browser.storage.local
16+
.set({ coinList: JSON.stringify(list.coins) })
17+
.then(() => {
18+
console.log("Loaded crypto list");
19+
});
20+
};
21+
22+
browser.runtime.onStartup.addListener(async () => {
23+
console.log("onStartup....");
24+
await fetchBasicData();
25+
});
26+
27+
interface ICoinListInput {
28+
limit: number;
29+
}
30+
31+
onMessage<ICoinListInput, any>("coinList", async ({ data: { limit } }) => {
32+
try {
33+
const data = JSON.parse(
34+
(await browser.storage.local.get("coinList")).coinList
35+
);
36+
return data.slice(0, limit);
37+
} catch (error) {
38+
return [];
39+
}
40+
});
41+
42+
// Run on init
43+
fetchBasicData();

‎src/entries/contentScript/main.ts

+13-9
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/* eslint-disable no-console */
22
// import { onMessage, sendMessage } from "webext-bridge";
3-
// import browser from "webextension-polyfill";
3+
import * as browser from "webextension-polyfill";
44
import Mark from "mark.js";
55
import "@webcomponents/webcomponentsjs/webcomponents-bundle.js";
66
import { coinGeko } from "./views/network";
@@ -11,6 +11,7 @@ import "./views/AddressHighlight.svelte";
1111
import "./views/TrxHighlight.svelte";
1212
import "./views/NativeTokenHighlight.svelte";
1313
import { escapeRegex } from "./views/utils";
14+
import { sendMessage } from "webext-bridge";
1415

1516
const regexETHTrx = /0x[a-fA-F0-9]{64}/g; // TODO: Ignore longer address
1617
const regexETHAddress = /0x[a-fA-F0-9]{40}/g; // TODO: Solana, Near regex
@@ -90,19 +91,24 @@ const getCoinList = async () => {
9091

9192
// Firefox `browser.tabs.executeScript()` requires scripts return a primitive value
9293
(async () => {
93-
// const coinList: { [key: string]: string | number }[] =
94-
// (await sendMessage("coinList", { limit: 500 })) || [];
94+
const coinList: { [key: string]: string | number }[] =
95+
(await sendMessage("coinList", { limit: 500 })) || [];
9596

96-
const coinList = (await getCoinList()) || [];
97+
console.log(coinList);
98+
99+
// const coinList = (await getCoinList()) || [];
97100

98101
const nameAndSymbolList: string[] = [
99102
...coinList.map((item: any) => item.symbol.toUpperCase()),
100103
];
101104

102105
const regexNativeToken = new RegExp(
103-
`\\b(${nameAndSymbolList.slice(0, 500).map(function (w) {
104-
return escapeRegex(w);
105-
}).join("|")})\\b`,
106+
`\\b(${nameAndSymbolList
107+
.slice(0, 500)
108+
.map(function (w) {
109+
return escapeRegex(w);
110+
})
111+
.join("|")})\\b`,
106112
"g"
107113
);
108114

@@ -205,8 +211,6 @@ const getCoinList = async () => {
205211
data.symbol === item.innerText || data.name === item.innerText
206212
);
207213

208-
console.log("selectedItem: ", selectedItem)
209-
210214
// Inject address as props
211215
item.setAttribute("id", selectedItem?.id);
212216
item.setAttribute("name", item.innerText);

‎src/entries/options/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88

99
<body>
1010
<div id="app"></div>
11-
<script type="module" src="./main.ts"></script>
11+
<!-- <script type="module" src="./main.ts"></script> -->
1212
<nimbus-options />
1313
</body>
1414

‎src/entries/popup/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88

99
<body style="min-width: 100px">
1010
<div id="app"></div>
11-
<script type="module" src="./main.ts"></script>
11+
<!-- <script type="module" src="./main.ts"></script> -->
1212
<nimbus-popup />
1313
</body>
1414

‎src/manifest.ts

+2-1
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ const sharedManifest = {
2323
page: "src/entries/options/index.html",
2424
open_in_tab: true,
2525
},
26-
permissions: [],
26+
permissions: ["tabs", "storage", "activeTab", "http://*/", "https://*/"],
2727
};
2828

2929
const browserAction = {
@@ -55,6 +55,7 @@ const ManifestV3 = {
5555
action: browserAction,
5656
background: {
5757
service_worker: "src/entries/background/serviceWorker.ts",
58+
type: "module",
5859
},
5960
host_permissions: ["*://*/*"],
6061
};

‎vite.config.ts

+17-1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@ import path from "path";
55
import { getManifest } from "./src/manifest";
66
import { windi } from "svelte-windicss-preprocess";
77
import sveltePreprocess from "svelte-preprocess";
8+
import AutoImport from "unplugin-auto-import/vite";
9+
10+
console.log({ env: process.env.NODE_ENV });
811

912
// https://vitejs.dev/config/
1013
export default defineConfig(({ mode }) => {
@@ -14,19 +17,32 @@ export default defineConfig(({ mode }) => {
1417
plugins: [
1518
svelte({
1619
preprocess: [sveltePreprocess(), windi({})],
17-
exclude: ["*.normal.svelte"],
20+
// exclude: ["*.normal.svelte"],
1821
compilerOptions: {
1922
customElement: true,
2023
},
2124
}),
2225
webExtension({
2326
manifest: getManifest(Number(env.MANIFEST_VERSION)),
2427
}),
28+
AutoImport({
29+
imports: [
30+
{
31+
"webextension-polyfill": [["default", "browser"]],
32+
},
33+
],
34+
}),
2535
],
2636
resolve: {
2737
alias: {
2838
"~": path.resolve(__dirname, "./src"),
2939
},
3040
},
41+
build: {
42+
sourcemap: true, // TODO: Change me for prod build
43+
},
44+
optimizeDeps: {
45+
include: ["webextension-polyfill"],
46+
},
3147
};
3248
});

0 commit comments

Comments
 (0)