Data Reformat & Management

babel.config.json

@@ -1,4 +1,5 @@
 {
   "plugins": [
+		"@babel/plugin-proposal-class-properties"
   ]
 }

package.json

@@ -5,7 +5,7 @@
   "main": "index.js",
   "scripts": {
     "dev": "run-p dev:webpack dev:ext",
-    "dev:ext": "web-ext run --firefox-profile=dev-edition-default --start-url about:debugging#/runtime/this-firefox --start-url about:addons --verbose",
+    "dev:ext": "web-ext run --firefox-profile=dev-edition-default --start-url about:debugging#/runtime/this-firefox --start-url about:addons",
     "dev:webpack": "webpack --config webpack.config.dev.js --watch --node-env=development",
     "build": "run-s build:webpack build:ext",
     "build:ext": "web-ext build --overwrite-dest",
@@ -28,6 +28,7 @@
     "@babel/plugin-transform-react-jsx": "^7.12.17",
     "@babel/plugin-transform-runtime": "^7.13.10",
     "@babel/runtime": "^7.13.10",
+    "@types/joi": "^17.2.3",
     "autoprefixer": "^10.2.5",
     "babel-loader": "^8.2.2",
     "clean-webpack-plugin": "^3.0.0",
@@ -62,6 +63,7 @@
   "dependencies": {
     "htm": "^3.0.4",
     "humanize-duration": "^3.25.1",
+    "joi": "^17.4.0",
     "preact": "^10.5.13",
     "tailwindcss": "^2.0.4",
     "vue": "^2.6.12"

src/background/background.js

@@ -1,22 +1,12 @@
-// on start up
-// load settings
-// get all open tabs
-// add active tab to pool
-// start tabs listener
-
-import { Store } from "./store.js";
+import { SchemaManager } from "./schema-manager.js";
+import { HistoryStore, IndexStore } from "./store.js";
 import { Tracker } from "./tracker.js";
 
-// tabs listener
-// tabs.onCreated - add to pool
-// tabs.onActivated - change focus to another tab
-// tabs.onUpdated (url change) calculate time spent and remove from pool
-// tabs.onRemoved - calculate time spent and remove from pool
+const schemaManager = new SchemaManager();
 
-// inspiration
-// https://chrome.google.com/webstore/detail/webtime-tracker/ppaojnbmmaigjmlpjaldnkgnklhicppk
+schemaManager.onReady.addListener(() => {
+  const historyStore = new HistoryStore();
+  const indexStore = new IndexStore();
 
-(async function () {
-  const store = new Store();
-  new Tracker(store);
-})();
+  new Tracker({ historyStore, indexStore });
+});

src/background/schema-manager.js

@@ -0,0 +1,100 @@
+import { Datastore, Version } from "../types.d";
+import { Logger } from "../utils";
+import { transformers } from "./transformers";
+
+export class SchemaManager {
+  listeners = {
+    ready: [],
+  };
+
+  constructor() {
+    browser.runtime.onInstalled.addListener(this.updateListener);
+    browser.runtime.onInstalled.addListener(this.installListener);
+  }
+
+  onReady = {
+    addListener: (listener) => this.listeners.ready.push(listener),
+    invoke: () => {
+      Logger.info("SCHEMA_0004");
+
+      this.listeners.ready.forEach((listener) => listener.call(this));
+    },
+  };
+
+  /**
+   *
+   * @param {browser.runtime._OnInstalledDetails} details
+   */
+  updateListener = async (details) => {
+    try {
+      if (details.reason !== "update") return;
+
+      Logger.info("RUNTIME_0001");
+
+      const store = await browser.storage.local.get();
+      const prev = new Version(store.version || "0.0.0");
+
+      const { error } = Datastore.schema.validate(store);
+
+      if (!error) {
+        this.onReady.invoke();
+        return;
+      }
+
+      Logger.info("SCHEMA_0000", Datastore.schema.validate(store).error);
+      Logger.info("SCHEMA_0001");
+
+      const transformed = transformers
+        .filter(({ version }) => this.compare(version, prev) === 1)
+        .reduce((data, transformer) => {
+          // apply each valid transformer in series
+          return transformer.transform(data);
+        }, store);
+
+      browser.storage.local.set(new Datastore(transformed));
+
+      this.onReady.invoke();
+    } catch (error) {
+      Logger.error("ERR_0000", error);
+    }
+  };
+
+  /**
+   *
+   * @param {browser.runtime._OnInstalledDetails} details
+   */
+  installListener = async (details) => {
+    try {
+      if (details.reason !== "install") return;
+
+      Logger.info("RUNTIME_0000");
+      Logger.info("SCHEMA_0002");
+
+      await browser.storage.local.set(new Datastore());
+      this.onReady.invoke();
+    } catch (error) {
+      this.logError(error);
+    }
+  };
+
+  /**
+   * Compares versions and returns a boolean indicating which is bigger
+   * @returns 0 if equal, +1 if versionA, -1 otherwise
+   * @param {import("../types.d").Version} versionA
+   * @param {import("../types.d").Version} versionB
+   */
+  compare = (versionA, versionB) => {
+    const a = versionA.toString().split(".");
+    const b = versionB.toString().split(".");
+
+    for (let i = 0; i < 3; i++) {
+      const na = Number(a[i]);
+      const nb = Number(b[i]);
+
+      if (na > nb) return 1;
+      if (nb > na) return -1;
+    }
+
+    return 0;
+  };
+}

src/background/store.js

@@ -1,71 +1,113 @@
-/**
- * @typedef {object} Entry
- * @property {Date} lastVisit last visit date
- * @property {object} schedule key is date, value is total time
- */
-
-/**
- * @typedef {object} History
- * @property {Entry}
- */
-
-/**
- * /origin
- * /last visit: date
- * /schedule
- *  /2021-05-06: ms total
- *  /2021-05-07: ms total
- *  /2021-05-08: ms total
- */
+// eslint-disable-next-line no-unused-vars
+import { Entry } from "../types.d";
+import { Logger } from "../utils";
 
 export class Store {
   constructor() {
-    /** @type {History} */
-    this.data = {};
-
-    this.get = this.get.bind(this);
-    this.set = this.set.bind(this);
+    if (this.constructor === Store)
+      throw new Error("Can't instantiate abstract class!");
   }
 
+  set = () => {
+    throw new Error("Can't use abstract method!");
+  };
+
+  get = () => {
+    throw new Error("Can't use abstract method!");
+  };
+
+  getAll = () => {
+    throw new Error("Can't use abstract method!");
+  };
+
   /**
-   * TODO: This will cause data inconsistency if users open more than 1 window
-   * at the same time since each will have a different local copy that isn't
-   * synced with the other windows. Replace it.
-   *
-   * You could change the tracking logic so that you track only the focused
-   * window as well. This would prevent race conditions.
+   * @param {Error} error
    */
+  static logError = async ({ message }) => {
+    Logger.error("ERR_0000", message);
+
+    const { errors } = await browser.storage.local.get("errors");
+
+    await browser.storage.local.set({
+      errors: [...errors, message],
+    });
+  };
+}
 
+export class HistoryStore extends Store {
   /**
    * @param {string} origin
+   * @returns {Promise<(Entry|undefined)>}
    */
-  async get(origin) {
-    const data = (await browser.storage.local.get("data")).data;
-    return data ? data[origin] : undefined;
-  }
+  get = async (origin) => {
+    const { history } = await browser.storage.local.get("history");
+    return history[origin];
+  };
+
+  /**
+   * @returns {Promise<Object.<string,Entry>>}
+   */
+  getAll = async () => {
+    const { history } = await browser.storage.local.get("history");
+    return history;
+  };
 
   /**
-   *
    * @param {string} origin
    * @param {Entry} value
    */
-  async set(origin, value) {
-    const data = (await browser.storage.local.get("data")).data || {}; // handle first run
+  set = async (origin, value) => {
+    const { history } = await browser.storage.local.get("history");
 
     const modified = {
-      ...data,
+      ...history,
       [origin]: value,
     };
 
-    console.log("modified", modified);
-    return browser.storage.local.set({ data: modified });
-  }
+    Logger.info("STORE_0000", origin);
+    return browser.storage.local.set({ history: modified });
+  };
+}
 
+export class IndexStore extends Store {
   /**
-   * @param {Error} error
+   * @param {string} indexKey
+   * @returns {Promise<(string[]|undefined)>}
    */
-  async logError(error) {
-    const errors = (await browser.storage.local.get("errors")).errors || [];
-    await browser.storage.local.set({ errors: [...errors, error] });
-  }
+  get = async (indexKey) => {
+    const { index } = await browser.storage.local.get("index");
+    return index[indexKey];
+  };
+
+  /**
+   * @returns {Promise<Object.<string,string[]>>}
+   */
+  getAll = async () => {
+    const { index } = await browser.storage.local.get("index");
+    return index;
+  };
+
+  /**
+   * @param {string} indexKey
+   * @param {string} origin
+   * @returns {Promise<boolean>}
+   */
+  isOriginIndexed = async (indexKey, origin) => {
+    const { index } = await browser.storage.local.get("index");
+    return index[indexKey] && index[indexKey].includes(origin);
+  };
+
+  /**
+   * @param {string} indexKey
+   * @param {string} origin
+   */
+  set = async (indexKey, origin) => {
+    const { index } = await browser.storage.local.get("index");
+
+    if (!index[indexKey]) index[indexKey] = [origin];
+    else if (!index[indexKey].includes(origin)) index[indexKey].push(origin);
+
+    Logger.info("STORE_0001", indexKey, origin);
+    return browser.storage.local.set({ index });
+  };
 }