feat: show release notes when the extension has been updated #236

_locales/en/messages.json

@@ -89,8 +89,5 @@
     },
     "settingsPleaseReload": {
         "message": "Please reload Twitter once you have changed the settings"
-    },
-    "ShadowbanScannerUpdatedTov2": {
-        "message": "Shadowban Scanner has been updated to v2! Click <a href=\"https://robot-inventor.github.io/article/2023/09/30/shadowban-scanner-v2-release/en/\" target=\"_blank\">here</a> for details."
     }
 }

_locales/ja/messages.json

@@ -89,8 +89,5 @@
     },
     "settingsPleaseReload": {
         "message": "設定を変更したらTwitterを再読み込みしてください。"
-    },
-    "ShadowbanScannerUpdatedTov2": {
-        "message": "Shadowban Scannerがv2にアップデートされました！詳細は<a href=\"https://robot-inventor.github.io/article/2023/09/30/shadowban-scanner-v2-release/\" target=\"_blank\">こちら</a>"
     }
 }

_locales/ko/messages.json

@@ -89,8 +89,5 @@
     },
     "settingsPleaseReload": {
         "message": "설정을 변경한 후 Twitter를 다시 로드해주세요"
-    },
-    "ShadowbanScannerUpdatedTov2": {
-        "message": "Shadowban Scanner has been updated to v2! Click <a href=\"https://robot-inventor.github.io/article/2023/09/30/shadowban-scanner-v2-release/en/\" target=\"_blank\">here</a> for details."
     }
 }

_locales/zh_TW/messages.json

@@ -89,8 +89,5 @@
     },
     "settingsPleaseReload": {
         "message": "若更改設定，請重新載入 Twitter"
-    },
-    "ShadowbanScannerUpdatedTov2": {
-        "message": "Shadowban Scanner has been updated to v2! Click <a href=\"https://robot-inventor.github.io/article/2023/09/30/shadowban-scanner-v2-release/en/\" target=\"_blank\">here</a> for details."
     }
 }

manifest/v2.json

@@ -28,6 +28,13 @@
             ]
         }
     ],
+    "background": {
+        "scripts": [
+            "dist/polyfill/browserPolyfill.min.js",
+            "dist/js/background.js"
+        ],
+        "persistent": false
+    },
     "web_accessible_resources": [
         "dist/js/pageScript.js",
         "dist/image/*"

manifest/v3.json

@@ -33,6 +33,10 @@
             ]
         }
     ],
+    "background": {
+        "service_worker": "dist/js/background.js",
+        "persistent": false
+    },
     "web_accessible_resources": [
         {
             "resources": [

package.json

@@ -31,6 +31,7 @@
   "homepage": "https://github.com/Robot-Inventor/shadowban-scanner#readme",
   "dependencies": {
     "@material/web": "^1.0.0",
+    "@types/chrome": "^0.0.246",
     "@typescript-eslint/eslint-plugin": "^6.2.0",
     "@typescript-eslint/parser": "^6.2.0",
     "colors": "^1.4.0",

src/ts/@types/common/settings.d.ts

@@ -5,5 +5,4 @@ export interface Settings {
     showMessagesInUnproblematicTweets: boolean;
     showNotesInMessages: boolean;
     showTweetButton: boolean;
-    hasDisplayedV2UpdateBanner: boolean;
 }

src/ts/@types/common/settings.guard.ts

@@ -14,7 +14,6 @@ export function isSettings(obj: unknown): obj is Settings {
         typeof typedObj["enableOnlyForCurrentUsersTweets"] === "boolean" &&
         typeof typedObj["showMessagesInUnproblematicTweets"] === "boolean" &&
         typeof typedObj["showNotesInMessages"] === "boolean" &&
-        typeof typedObj["showTweetButton"] === "boolean" &&
-        typeof typedObj["hasDisplayedV2UpdateBanner"] === "boolean"
+        typeof typedObj["showTweetButton"] === "boolean"
     )
 }

src/ts/background.ts

@@ -0,0 +1,19 @@
+chrome.runtime.onInstalled.addListener((details) => {
+    const isJapanese = chrome.i18n.getUILanguage() === "ja";
+
+    if (details.reason === chrome.runtime.OnInstalledReason.UPDATE) {
+        const releaseNoteURL = isJapanese
+            ? "https://robot-inventor.github.io/article/2023/09/30/shadowban-scanner-v2-release/"
+            : "https://robot-inventor.github.io/article/2023/09/30/shadowban-scanner-v2-release/en/";
+        void chrome.tabs.create({ url: releaseNoteURL });
+
+        return;
+    }
+
+    if (details.reason === chrome.runtime.OnInstalledReason.INSTALL) {
+        const welcomeURL = isJapanese
+            ? "https://github.com/Robot-Inventor/shadowban-scanner/blob/main/README_ja.md"
+            : "https://github.com/Robot-Inventor/shadowban-scanner/blob/main/README.md";
+        void chrome.tabs.create({ url: welcomeURL });
+    }
+});

src/ts/common/defaultSettings.ts

@@ -6,7 +6,6 @@ import { Settings } from "../@types/common/settings";
 const DEFAULT_SETTINGS = {
     alwaysDetailedView: false,
     enableOnlyForCurrentUsersTweets: false,
-    hasDisplayedV2UpdateBanner: false,
     showMessagesInUnproblematicTweets: false,
     showNotesInMessages: true,
     showTweetButton: true

src/ts/common/migrator.ts

@@ -3,10 +3,15 @@
  * @returns {Promise<void>}
  */
 const migrateFromV1ToV2 = async () => {
-    const v1Settings = await browser.storage.local.get(null);
-    if (!("showMessageInAllTweets" in v1Settings)) return;
+    const currentSettings = await browser.storage.local.get(null);
 
-    await browser.storage.local.set({ showMessagesInUnproblematicTweets: v1Settings.showMessageInAllTweets });
+    if ("hasDisplayedV2UpdateBanner" in currentSettings) {
+        await browser.storage.local.remove("hasDisplayedV2UpdateBanner");
+    }
+
+    if (!("showMessageInAllTweets" in currentSettings)) return;
+
+    await browser.storage.local.set({ showMessagesInUnproblematicTweets: currentSettings.showMessageInAllTweets });
     await browser.storage.local.remove("showMessageInAllTweets");
 };
 

src/ts/contentScript.ts

@@ -3,64 +3,12 @@ import { DEFAULT_SETTINGS } from "./common/defaultSettings";
 import { Translator } from "./common/translator";
 import { migrateFromV1ToV2 } from "./common/migrator";
 
-// eslint-disable-next-line max-statements
-const showV2Banner = () => {
-    const banner = document.createElement("div");
-    banner.id = "shadowban-scanner-banner";
-    banner.innerHTML = browser.i18n.getMessage("ShadowbanScannerUpdatedTov2");
-
-    const style = document.createElement("style");
-    style.textContent = `
-#shadowban-scanner-banner {
-    position: fixed;
-    top: 0;
-    text-align: center;
-    width: 100vw;
-    padding: 0.5rem 0;
-    background-color: rgb(29, 155, 240);
-    color: white;
-    font-family: sans-serif;
-}
-
-#shadowban-scanner-banner a {
-    color: white;
-    text-decoration: underline;
-}
-
-#shadowban-scanner-banner button {
-    font-size: 1.5rem;
-    position: absolute;
-    top: 0;
-    right: 1rem;
-    background-color: transparent;
-    border: none;
-    color: white;
-    cursor: pointer;
-}
-    `;
-
-    const closeButton = document.createElement("button");
-    closeButton.textContent = "×";
-    closeButton.addEventListener("click", () => {
-        banner.remove();
-    });
-
-    banner.appendChild(closeButton);
-    document.body.appendChild(style);
-    document.body.appendChild(banner);
-};
-
 // eslint-disable-next-line max-statements
 const main = async () => {
     await migrateFromV1ToV2();
 
     const settings = await browser.storage.local.get(DEFAULT_SETTINGS);
 
-    if (!settings.hasDisplayedV2UpdateBanner) {
-        showV2Banner();
-        await browser.storage.local.set({ hasDisplayedV2UpdateBanner: true });
-    }
-
     const translator = new Translator(browser.i18n.getMessage, browser.runtime.getURL("dist/image/"));
 
     const eventGenerator = document.createElement("div");

webpack.config.js

@@ -15,6 +15,7 @@ module.exports = {
         "./js/browserAction.js": "./src/ts/browserAction.ts",
         "./js/contentScript.js": "./src/ts/contentScript.ts",
         "./js/pageScript.js": "./src/ts/pageScript.ts",
+        "./js/background.js": "./src/ts/background.ts",
         ...userScriptEntries
     },
     output: {