Es6 cmp migration (#113)

* migrate Alert component

* convert Mainlist component

* add webpack watch task

* update build script for different manifests

* add types for api responses

* convert changeExtensionIcon

* convert inArray, getDomainParts, contains to ts

* convert changeExtensionTooltip

* convert changeExtensionState to ts

src/utils/changeExtensionIcon.ts

@@ -0,0 +1,28 @@
+import { browser } from 'webextension-polyfill-ts';
+import config from '../config';
+
+type ColorIconTypes = 'gray' | 'red' | 'white' | '';
+
+/**
+ * It changes the extension icon color.
+ */
+export default async function changeExtensionIcon(color?: ColorIconTypes): Promise<void> {
+  if (color) {
+    const path = `./graphics/wakatime-logo-38-${color}.png`;
+
+    await browser.browserAction.setIcon({
+      path: path,
+    });
+  } else {
+    const { theme } = await browser.storage.sync.get({
+      theme: config.theme,
+    });
+    const path =
+      theme === config.theme
+        ? './graphics/wakatime-logo-38.png'
+        : './graphics/wakatime-logo-38-white.png';
+    await browser.browserAction.setIcon({
+      path: path,
+    });
+  }
+}

src/utils/changeExtensionState.ts

@@ -0,0 +1,34 @@
+import config, { ApiStates } from '../config';
+
+import changeExtensionIcon from './changeExtensionIcon';
+import changeExtensionTooltip from './changeExtensionTooltip';
+
+/**
+ * Sets the current state of the extension.
+ */
+export default async function changeExtensionState(state: ApiStates): Promise<void> {
+  switch (state) {
+    case 'allGood':
+      await changeExtensionIcon(config.colors.allGood);
+      await changeExtensionTooltip(config.tooltips.allGood);
+      break;
+    case 'notLogging':
+      await changeExtensionIcon(config.colors.notLogging);
+      await changeExtensionTooltip(config.tooltips.notLogging);
+      break;
+    case 'notSignedIn':
+      await changeExtensionIcon(config.colors.notSignedIn);
+      await changeExtensionTooltip(config.tooltips.notSignedIn);
+      break;
+    case 'blacklisted':
+      await changeExtensionIcon(config.colors.notLogging);
+      await changeExtensionTooltip(config.tooltips.blacklisted);
+      break;
+    case 'whitelisted':
+      await changeExtensionIcon(config.colors.notLogging);
+      await changeExtensionTooltip(config.tooltips.whitelisted);
+      break;
+    default:
+      break;
+  }
+}

src/utils/changeExtensionTooltip.ts

@@ -0,0 +1,16 @@
+import { browser } from 'webextension-polyfill-ts';
+import config from '../config';
+
+/**
+ * It changes the extension title
+ *
+ */
+export default async function changeExtensionTooltip(text: string): Promise<void> {
+  if (text === '') {
+    text = config.name;
+  } else {
+    text = `${config.name} - ${text}`;
+  }
+
+  await browser.browserAction.setTitle({ title: text });
+}

src/utils/contains.ts

@@ -0,0 +1,24 @@
+/**
+ * Creates an array from list using \n as delimiter
+ * and checks if any element in list is contained in the url.
+ */
+export default function contains(url: string, list: string): boolean {
+  const lines = list.split('\n');
+
+  for (let i = 0; i < lines.length; i++) {
+    // Trim all lines from the list one by one
+    const cleanLine = lines[i].trim();
+
+    // If by any chance one line in the list is empty, ignore it
+    if (cleanLine === '') continue;
+
+    const lineRe = new RegExp(cleanLine.replace('.', '.').replace('*', '.*'));
+
+    // If url matches the current line return true
+    if (lineRe.test(url)) {
+      return true;
+    }
+  }
+
+  return false;
+}

src/utils/getDomainFromUrl.ts

@@ -0,0 +1,8 @@
+/**
+ * Returns domain from given URL.
+ */
+export function getDomainFromUrl(url: string): string {
+  const parts = url.split('/');
+
+  return parts[0] + '//' + parts[2];
+}

src/utils/inArray.ts

@@ -0,0 +1,12 @@
+/**
+ * Returns boolean if needle is found in haystack or not.
+ */
+export function in_array<T>(needle: T, haystack: T[]): boolean {
+  for (let i = 0; i < haystack.length; i++) {
+    if (needle == haystack[i]) {
+      return true;
+    }
+  }
+
+  return false;
+}