From 01c62e5336532390b2c9d5ecd13445f374a36337 Mon Sep 17 00:00:00 2001
From: "Collin M. Barrett" <collinbarrett@users.noreply.github.com>
Date: Sun, 22 Sep 2019 17:24:09 -0500
Subject: [PATCH] lint via tslint/prettier

---
 src/FilterLists.Web/config-overrides.js       |  14 +-
 src/FilterLists.Web/src/App.test.tsx          |  12 +-
 src/FilterLists.Web/src/App.tsx               | 124 ++++--
 .../src/components/Description.tsx            |  14 +-
 .../src/components/LicenseTag.tsx             |  30 +-
 .../src/components/LinkButton.tsx             |  19 +-
 .../src/components/ListInfoButton.tsx         |  23 +-
 .../src/components/PublishedDate.tsx          |  10 +-
 .../src/components/SubscribeButtons.tsx       |  66 ++--
 .../src/components/SyntaxTag.tsx              |  30 +-
 src/FilterLists.Web/src/components/index.ts   |   4 +-
 .../languageCloud/LanguageCloud.tsx           |  27 +-
 .../src/components/languageCloud/index.ts     |   4 +-
 .../listInfoDrawer/ListInfoDrawer.tsx         | 118 +++---
 .../src/components/listInfoDrawer/index.ts    |   4 +-
 .../src/components/listsTable/ListDrawer.tsx  |  79 ++--
 .../src/components/listsTable/ListsTable.tsx  | 353 ++++++++++++------
 .../components/listsTable/ListsTableHoc.tsx   |  26 +-
 .../src/components/listsTable/arraySorter.ts  |  26 +-
 .../src/components/listsTable/index.ts        |   4 +-
 .../src/components/listsTable/listsTable.css  |   2 +-
 .../maintainerCloud/MaintainerCloud.tsx       |  31 +-
 .../src/components/maintainerCloud/index.ts   |   4 +-
 .../components/maintainers/Maintainers.tsx    |  45 ++-
 .../src/components/maintainers/index.ts       |   4 +-
 .../softwareCloud/SoftwareCloud.tsx           |  28 +-
 .../components/softwareCloud/SoftwareIcon.tsx |  21 +-
 .../components/softwareCloud/imgs/imgs.d.ts   |   2 +-
 .../components/softwareCloud/imgs/index.ts    |  74 ++--
 .../src/components/softwareCloud/index.ts     |   6 +-
 .../src/components/tagCloud/TagCloud.tsx      |  23 +-
 .../src/components/tagCloud/index.ts          |   4 +-
 src/FilterLists.Web/src/constants.ts          |   2 +-
 src/FilterLists.Web/src/hooks/index.ts        |  20 +-
 src/FilterLists.Web/src/hooks/useApiData.tsx  |   7 +-
 .../src/hooks/useLanguages.tsx                |  10 +-
 src/FilterLists.Web/src/hooks/useLicenses.tsx |  10 +-
 src/FilterLists.Web/src/hooks/useLists.tsx    |  15 +-
 .../src/hooks/useMaintainers.tsx              |  10 +-
 .../src/hooks/useSearchColumnFilter.tsx       |  57 ++-
 src/FilterLists.Web/src/hooks/useSoftware.tsx |  10 +-
 src/FilterLists.Web/src/hooks/useSyntaxes.tsx |  10 +-
 .../src/hooks/useTablePageSizer.tsx           |  10 +-
 src/FilterLists.Web/src/hooks/useTags.tsx     |  10 +-
 src/FilterLists.Web/src/index.tsx             |  10 +-
 .../src/interfaces/Language.ts                |   2 +-
 src/FilterLists.Web/src/interfaces/License.ts |   2 +-
 src/FilterLists.Web/src/interfaces/List.ts    |   2 +-
 .../src/interfaces/Maintainer.ts              |   2 +-
 .../src/interfaces/Software.ts                |   2 +-
 src/FilterLists.Web/src/interfaces/Syntax.ts  |   2 +-
 src/FilterLists.Web/src/interfaces/Tag.ts     |   2 +-
 src/FilterLists.Web/src/react-app-env.d.ts    |   2 +-
 src/FilterLists.Web/src/utils/index.ts        |   4 +-
 src/FilterLists.Web/src/utils/nameof.ts       |   2 +-
 55 files changed, 865 insertions(+), 569 deletions(-)

diff --git a/src/FilterLists.Web/config-overrides.js b/src/FilterLists.Web/config-overrides.js
index 4ae59e980..d43116387 100644
--- a/src/FilterLists.Web/config-overrides.js
+++ b/src/FilterLists.Web/config-overrides.js
@@ -1,9 +1,9 @@
-const { override, fixBabelImports } = require('customize-cra');
+const { override, fixBabelImports } = require("customize-cra");
 
 module.exports = override(
-  fixBabelImports('import', {
-    libraryName: 'antd',
-    libraryDirectory: 'es',
-    style: 'css',
-  }),
-);
\ No newline at end of file
+  fixBabelImports("import", {
+    libraryName: "antd",
+    libraryDirectory: "es",
+    style: "css"
+  })
+);
diff --git a/src/FilterLists.Web/src/App.test.tsx b/src/FilterLists.Web/src/App.test.tsx
index 7911e5b41..5e49ca508 100644
--- a/src/FilterLists.Web/src/App.test.tsx
+++ b/src/FilterLists.Web/src/App.test.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
+import React from "react";
+import ReactDOM from "react-dom";
 
-import { App } from './App';
+import { App } from "./App";
 
-it('renders without crashing', () => {
-  const div = document.createElement('div');
+it("renders without crashing", () => {
+  const div = document.createElement("div");
   ReactDOM.render(<App />, div);
   ReactDOM.unmountComponentAtNode(div);
-});
\ No newline at end of file
+});
diff --git a/src/FilterLists.Web/src/App.tsx b/src/FilterLists.Web/src/App.tsx
index 8eebe13fc..586e45475 100644
--- a/src/FilterLists.Web/src/App.tsx
+++ b/src/FilterLists.Web/src/App.tsx
@@ -1,27 +1,48 @@
-import { Icon, Layout, Menu, Tag } from 'antd';
-import React from 'react';
-import { BrowserRouter as Router, Link, Route, RouteComponentProps, Switch } from 'react-router-dom';
+import { Icon, Layout, Menu, Tag } from "antd";
+import React from "react";
+import {
+  BrowserRouter as Router,
+  Link,
+  Route,
+  RouteComponentProps,
+  Switch
+} from "react-router-dom";
 
-import { ListsTable } from './components';
+import { ListsTable } from "./components";
 
 const { Header, Content, Footer } = Layout;
 
-export const App: React.FC = () =>
+export const App: React.FC = () => (
   <Router>
     <Layout>
-      <Header style={{ background: '#fff' }}>
+      <Header style={{ background: "#fff" }}>
         <Logo />
-        <Menu mode="horizontal" style={{ lineHeight: '64px' }} />
+        <Menu mode="horizontal" style={{ lineHeight: "64px" }} />
       </Header>
       <Content>
-        <div style={{ background: '#fff', paddingLeft: 12, paddingTop: 12, paddingRight: 12, minHeight: 280 }}>
+        <div
+          style={{
+            background: "#fff",
+            paddingLeft: 12,
+            paddingTop: 12,
+            paddingRight: 12,
+            minHeight: 280
+          }}
+        >
           <Switch>
             <Route path="/" component={ListsTable} />
             <Route component={NotFound} />
           </Switch>
         </div>
       </Content>
-      <Footer style={{ textAlign: 'center', padding: '6px 50px', background: '#fff', lineHeight: '28px' }}>
+      <Footer
+        style={{
+          textAlign: "center",
+          padding: "6px 50px",
+          background: "#fff",
+          lineHeight: "28px"
+        }}
+      >
         <CopyrightAuthor />
         <Twitter />
         <Community />
@@ -30,78 +51,101 @@ export const App: React.FC = () =>
         <Donate />
       </Footer>
     </Layout>
-  </Router>;
+  </Router>
+);
 
-const Logo = () =>
+const Logo = () => (
   <Link to="/">
-    <img src={`${process.env.PUBLIC_URL}/logo_filterlists.png`}
+    <img
+      src={`${process.env.PUBLIC_URL}/logo_filterlists.png`}
       alt="FilterLists logo"
       height="44px"
-      style={{ background: '#fff' }} />
-  </Link>;
+      style={{ background: "#fff" }}
+    />
+  </Link>
+);
 
-const NotFound = (props: RouteComponentProps) =>
+const NotFound = (props: RouteComponentProps) => (
   <h2>
     404 Not Found: <code>{props.location.pathname}</code>
-  </h2>;
+  </h2>
+);
 
-const CopyrightAuthor = () =>
+const CopyrightAuthor = () => (
   <Tag>
     ©{new Date().getFullYear()}&nbsp;
-    <a href="https://collinmbarrett.com"
+    <a
+      href="https://collinmbarrett.com"
       title="Collin M. Barrett's Homepage"
       target="_blank"
-      rel="noopener noreferrer">
+      rel="noopener noreferrer"
+    >
       Collin M. Barrett
     </a>
-  </Tag>;
+  </Tag>
+);
 
-const Twitter = () =>
+const Twitter = () => (
   <Tag>
-    <a href="https://twitter.com/FilterLists"
+    <a
+      href="https://twitter.com/FilterLists"
       title="FilterLists on Twitter"
       target="_blank"
-      rel="noopener noreferrer">
+      rel="noopener noreferrer"
+    >
       <Icon type="twitter" /> Twitter
     </a>
-  </Tag>;
+  </Tag>
+);
 
-const Community = () =>
+const Community = () => (
   <Tag>
-    <a href="https://hub.filterlists.com"
+    <a
+      href="https://hub.filterlists.com"
       title="FilterLists Discourse community forum"
       target="_blank"
-      rel="noopener noreferrer">
+      rel="noopener noreferrer"
+    >
       <Icon type="team" /> Community
     </a>
-  </Tag>;
+  </Tag>
+);
 
-const GitHub = () =>
+const GitHub = () => (
   <Tag>
-    <a href="https://github.com/collinbarrett/FilterLists"
+    <a
+      href="https://github.com/collinbarrett/FilterLists"
       title="FilterLists git repository on GitHub"
       target="_blank"
-      rel="noopener noreferrer">
+      rel="noopener noreferrer"
+    >
       <Icon type="github" /> GitHub
     </a>
-  </Tag>;
+  </Tag>
+);
 
-const Api = () =>
+const Api = () => (
   <Tag>
-    <a href="/api/v1/lists"
+    <a
+      href="/api/v1/lists"
       title="FilterLists API lists endpoint"
       target="_blank"
-      rel="noopener noreferrer">
+      rel="noopener noreferrer"
+    >
       <Icon type="api" /> API
     </a>
-  </Tag>;
+  </Tag>
+);
 
-const Donate = () =>
+const Donate = () => (
   <Tag>
-    <a href="https://beerpay.io/collinbarrett/FilterLists"
+    <a
+      href="https://beerpay.io/collinbarrett/FilterLists"
       title="Donate to FilterLists with Beerpay"
       target="_blank"
-      rel="noopener noreferrer">
+      rel="noopener noreferrer"
+    >
       <Icon type="dollar" /> Donate
     </a>
-  </Tag>;
\ No newline at end of file
+  </Tag>
+);
diff --git a/src/FilterLists.Web/src/components/Description.tsx b/src/FilterLists.Web/src/components/Description.tsx
index b734029d8..1a0471cf6 100644
--- a/src/FilterLists.Web/src/components/Description.tsx
+++ b/src/FilterLists.Web/src/components/Description.tsx
@@ -1,11 +1,15 @@
-import React from 'react';
+import React from "react";
 
 interface Props {
   description: string;
   descriptionSourceUrl: string;
-};
+}
 
 export const Description = (props: Props) =>
-  props.descriptionSourceUrl
-    ? <blockquote cite={props.descriptionSourceUrl}>{props.description}</blockquote>
-    : <p>{props.description}</p>;
\ No newline at end of file
+  props.descriptionSourceUrl ? (
+    <blockquote cite={props.descriptionSourceUrl}>
+      {props.description}
+    </blockquote>
+  ) : (
+    <p>{props.description}</p>
+  );
diff --git a/src/FilterLists.Web/src/components/LicenseTag.tsx b/src/FilterLists.Web/src/components/LicenseTag.tsx
index be03f6708..8beb0e554 100644
--- a/src/FilterLists.Web/src/components/LicenseTag.tsx
+++ b/src/FilterLists.Web/src/components/LicenseTag.tsx
@@ -1,32 +1,32 @@
-import { Tag } from 'antd';
-import * as React from 'react';
+import { Tag } from "antd";
+import * as React from "react";
 
 interface Props {
   name: string;
   descriptionUrl?: string;
   showLabel?: boolean;
-};
+}
 
 export const LicenseTag = (props: Props) =>
-  props.name
-    ? <span>
+  props.name ? (
+    <span>
       {props.showLabel && <h3>License:</h3>}
       <Tag>
-        <TagContents
-          name={props.name}
-          descriptionUrl={props.descriptionUrl} />
+        <TagContents name={props.name} descriptionUrl={props.descriptionUrl} />
       </Tag>
     </span>
-    : null;
+  ) : null;
 
 const TagContents = (props: Props) =>
-  props.descriptionUrl
-    ? <a href={props.descriptionUrl}
+  props.descriptionUrl ? (
+    <a
+      href={props.descriptionUrl}
       title={`View ${props.name}'s homepage.`}
       target="_blank"
-      rel="noopener noreferrer">
+      rel="noopener noreferrer"
+    >
       {props.name}
     </a>
-    : <>
-      {props.name}
-    </>;
\ No newline at end of file
+  ) : (
+    <>{props.name}</>
+  );
diff --git a/src/FilterLists.Web/src/components/LinkButton.tsx b/src/FilterLists.Web/src/components/LinkButton.tsx
index 27e8f6841..1ad53baea 100644
--- a/src/FilterLists.Web/src/components/LinkButton.tsx
+++ b/src/FilterLists.Web/src/components/LinkButton.tsx
@@ -1,6 +1,6 @@
-import { Button } from 'antd';
-import { ButtonType } from 'antd/lib/button';
-import React from 'react';
+import { Button } from "antd";
+import { ButtonType } from "antd/lib/button";
+import React from "react";
 
 interface Props {
   url: string;
@@ -8,11 +8,11 @@ interface Props {
   title?: string;
   type?: ButtonType;
   icon?: string;
-};
+}
 
 export const LinkButton = (props: Props) =>
-  props.url && props.text
-    ? <Button
+  props.url && props.text ? (
+    <Button
       href={props.url}
       title={props.title}
       type={props.type || "default"}
@@ -20,7 +20,8 @@ export const LinkButton = (props: Props) =>
       style={{ borderLeftColor: "rgb(217, 217, 217)" }} //HACK: override buggy style in antd
       icon={props.icon}
       target="_blank"
-      rel="noopener noreferrer" >
+      rel="noopener noreferrer"
+    >
       {props.text}
-    </Button >
-    : null;
\ No newline at end of file
+    </Button>
+  ) : null;
diff --git a/src/FilterLists.Web/src/components/ListInfoButton.tsx b/src/FilterLists.Web/src/components/ListInfoButton.tsx
index 5214a2df5..02cee68dd 100644
--- a/src/FilterLists.Web/src/components/ListInfoButton.tsx
+++ b/src/FilterLists.Web/src/components/ListInfoButton.tsx
@@ -1,13 +1,13 @@
-import { Button, Icon } from 'antd';
-import React from 'react';
-import { RouteComponentProps } from 'react-router-dom';
-import slugify from 'slugify';
+import { Button, Icon } from "antd";
+import React from "react";
+import { RouteComponentProps } from "react-router-dom";
+import slugify from "slugify";
 
-import { SlugifyOptions } from '../constants';
+import { SlugifyOptions } from "../constants";
 
 interface Props {
   listName: string;
-};
+}
 
 export const ListInfoButton = (props: RouteComponentProps & Props) => {
   const listPath = `/lists/${slugify(props.listName, SlugifyOptions)}`;
@@ -15,10 +15,13 @@ export const ListInfoButton = (props: RouteComponentProps & Props) => {
     <Button
       type="primary"
       title={`View more information about ${props.listName}.`}
-      onClick={() => props.location.pathname === listPath
-        ? props.history.push("/")
-        : props.history.push(listPath)} >
+      onClick={() =>
+        props.location.pathname === listPath
+          ? props.history.push("/")
+          : props.history.push(listPath)
+      }
+    >
       <Icon type="info-circle" />
     </Button>
   );
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/components/PublishedDate.tsx b/src/FilterLists.Web/src/components/PublishedDate.tsx
index f7fb53aa7..c8b9d6c3c 100644
--- a/src/FilterLists.Web/src/components/PublishedDate.tsx
+++ b/src/FilterLists.Web/src/components/PublishedDate.tsx
@@ -1,13 +1,13 @@
-import React from 'react';
+import React from "react";
 
 interface Props {
   publishedDate: string;
-};
+}
 
 export const PublishedDate = (props: Props) =>
-  props.publishedDate
-    ? <>
+  props.publishedDate ? (
+    <>
       <h3>First Published Date:</h3>
       {new Date(props.publishedDate).toDateString()}
     </>
-    : null;
\ No newline at end of file
+  ) : null;
diff --git a/src/FilterLists.Web/src/components/SubscribeButtons.tsx b/src/FilterLists.Web/src/components/SubscribeButtons.tsx
index f1893b281..4db0a71a9 100644
--- a/src/FilterLists.Web/src/components/SubscribeButtons.tsx
+++ b/src/FilterLists.Web/src/components/SubscribeButtons.tsx
@@ -1,48 +1,50 @@
-import { Button } from 'antd';
-import { ButtonType } from 'antd/lib/button';
-import React from 'react';
+import { Button } from "antd";
+import { ButtonType } from "antd/lib/button";
+import React from "react";
 
 interface Props {
   name: string;
   viewUrl: string;
   viewUrlMirrors: string[];
-};
+}
 
 export const SubscribeButtons = (props: Props) =>
-  props.viewUrl
-    ? <>
+  props.viewUrl ? (
+    <>
       <SubscribeButton
         name={props.name}
         viewUrl={props.viewUrl}
-        text="Subscribe" />
-      <MirrorButtons
-        name={props.name}
-        viewUrlMirrors={props.viewUrlMirrors} />
+        text="Subscribe"
+      />
+      <MirrorButtons name={props.name} viewUrlMirrors={props.viewUrlMirrors} />
     </>
-    : null;
+  ) : null;
 
 interface MirrorButtonsProps {
   name: string;
   viewUrlMirrors: string[];
-};
+}
 
-const MirrorButtons = (props: MirrorButtonsProps) =>
+const MirrorButtons = (props: MirrorButtonsProps) => (
   <>
     {props.viewUrlMirrors && props.viewUrlMirrors.length
-      ? props.viewUrlMirrors.map((viewUrlMirror: string, i: number) =>
-        <SubscribeButton
-          key={i}
-          name={props.name}
-          viewUrl={viewUrlMirror}
-          text={`Subscribe (Mirror ${i + 1})`} />)
+      ? props.viewUrlMirrors.map((viewUrlMirror: string, i: number) => (
+          <SubscribeButton
+            key={i}
+            name={props.name}
+            viewUrl={viewUrlMirror}
+            text={`Subscribe (Mirror ${i + 1})`}
+          />
+        ))
       : null}
-  </>;
+  </>
+);
 
 interface SubscribeButtonProps {
   name: string;
   viewUrl: string;
   text: string;
-};
+}
 
 const SubscribeButton = (props: SubscribeButtonProps) => {
   const buttonProps = buildButtonProps(props.name, props.viewUrl);
@@ -53,7 +55,8 @@ const SubscribeButton = (props: SubscribeButtonProps) => {
       icon="import"
       type={buttonProps.type}
       href={buttonProps.href}
-      title={buttonProps.title}>
+      title={buttonProps.title}
+    >
       {props.text}
     </Button>
   );
@@ -74,22 +77,27 @@ const buildButtonProps = (name: string, viewUrl: string) => {
   if (viewUrl.includes(".onion/")) {
     type = "dashed";
     prefixes.push("TOR");
-  };
+  }
   if (viewUrl.includes("http://")) {
     type = "danger";
     prefixes.push("INSECURE");
-  };
+  }
 
   // Software protocols
   if (viewUrl.includes(".tpl")) {
     disabled = true; // IE not supported by FilterLists
-  };
-  if (viewUrl.includes(".lsrules") || viewUrl.includes("?hostformat=littlesnitch")) {
+  }
+  if (
+    viewUrl.includes(".lsrules") ||
+    viewUrl.includes("?hostformat=littlesnitch")
+  ) {
     href = `x-littlesnitch:subscribe-rules?url=${hrefLocation}`;
     message = `Subscribe to ${name} with Little Snitch's rule group subscription feature.`;
-  };
+  }
 
-  const title = `${prefixes.length ? prefixes.join(" | ") + " | " : ""}${message}`;
+  const title = `${
+    prefixes.length ? prefixes.join(" | ") + " | " : ""
+  }${message}`;
 
   return { disabled, type, href, title };
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/components/SyntaxTag.tsx b/src/FilterLists.Web/src/components/SyntaxTag.tsx
index 7a6e7fc8b..4c04f91b6 100644
--- a/src/FilterLists.Web/src/components/SyntaxTag.tsx
+++ b/src/FilterLists.Web/src/components/SyntaxTag.tsx
@@ -1,32 +1,32 @@
-import { Tag } from 'antd';
-import * as React from 'react';
+import { Tag } from "antd";
+import * as React from "react";
 
 interface Props {
   name: string;
   definitionUrl?: string;
   showLabel?: boolean;
-};
+}
 
 export const SyntaxTag = (props: Props) =>
-  props.name
-    ? <span>
+  props.name ? (
+    <span>
       {props.showLabel && <h3>Syntax:</h3>}
       <Tag>
-        <TagContents
-          name={props.name}
-          definitionUrl={props.definitionUrl} />
+        <TagContents name={props.name} definitionUrl={props.definitionUrl} />
       </Tag>
     </span>
-    : null;
+  ) : null;
 
 const TagContents = (props: Props) =>
-  props.definitionUrl
-    ? <a href={props.definitionUrl}
+  props.definitionUrl ? (
+    <a
+      href={props.definitionUrl}
       title={`View ${props.name}'s homepage.`}
       target="_blank"
-      rel="noopener noreferrer">
+      rel="noopener noreferrer"
+    >
       {props.name}
     </a>
-    : <>
-      {props.name}
-    </>;
\ No newline at end of file
+  ) : (
+    <>{props.name}</>
+  );
diff --git a/src/FilterLists.Web/src/components/index.ts b/src/FilterLists.Web/src/components/index.ts
index 2392fcc0e..059e95e97 100644
--- a/src/FilterLists.Web/src/components/index.ts
+++ b/src/FilterLists.Web/src/components/index.ts
@@ -1,3 +1,3 @@
-import { ListsTable } from './listsTable';
+import { ListsTable } from "./listsTable";
 
-export { ListsTable };
\ No newline at end of file
+export { ListsTable };
diff --git a/src/FilterLists.Web/src/components/languageCloud/LanguageCloud.tsx b/src/FilterLists.Web/src/components/languageCloud/LanguageCloud.tsx
index 4c64ca1e2..d6e6c8cfe 100644
--- a/src/FilterLists.Web/src/components/languageCloud/LanguageCloud.tsx
+++ b/src/FilterLists.Web/src/components/languageCloud/LanguageCloud.tsx
@@ -1,19 +1,24 @@
-import { Tag } from 'antd';
-import React from 'react';
+import { Tag } from "antd";
+import React from "react";
 
-import { Language } from '../../interfaces/Language';
-import styles from './LanguageCloud.module.css';
+import { Language } from "../../interfaces/Language";
+import styles from "./LanguageCloud.module.css";
 
 interface Props {
   languages: Language[];
   showLabel?: boolean;
-};
+}
 
 export const LanguageCloud = (props: Props) =>
-  props.languages && props.languages.length
-    ? <div className={styles.grow}>
-      {props.showLabel && <h3>{`Language${props.languages.length > 1 ? "s" : ""}:`}</h3>}
-      {props.languages.map((l: Language, i: number) =>
-        <Tag key={i} title={l.name}>{l.iso6391}</Tag>)}
+  props.languages && props.languages.length ? (
+    <div className={styles.grow}>
+      {props.showLabel && (
+        <h3>{`Language${props.languages.length > 1 ? "s" : ""}:`}</h3>
+      )}
+      {props.languages.map((l: Language, i: number) => (
+        <Tag key={i} title={l.name}>
+          {l.iso6391}
+        </Tag>
+      ))}
     </div>
-    : null;
\ No newline at end of file
+  ) : null;
diff --git a/src/FilterLists.Web/src/components/languageCloud/index.ts b/src/FilterLists.Web/src/components/languageCloud/index.ts
index 3f61a4e3d..c0509230a 100644
--- a/src/FilterLists.Web/src/components/languageCloud/index.ts
+++ b/src/FilterLists.Web/src/components/languageCloud/index.ts
@@ -1,3 +1,3 @@
-import { LanguageCloud } from './LanguageCloud';
+import { LanguageCloud } from "./LanguageCloud";
 
-export { LanguageCloud };
\ No newline at end of file
+export { LanguageCloud };
diff --git a/src/FilterLists.Web/src/components/listInfoDrawer/ListInfoDrawer.tsx b/src/FilterLists.Web/src/components/listInfoDrawer/ListInfoDrawer.tsx
index cf4378048..7a83652d9 100644
--- a/src/FilterLists.Web/src/components/listInfoDrawer/ListInfoDrawer.tsx
+++ b/src/FilterLists.Web/src/components/listInfoDrawer/ListInfoDrawer.tsx
@@ -1,27 +1,27 @@
-import './listInfoDrawer.css';
+import "./listInfoDrawer.css";
 
-import { Divider, Drawer } from 'antd';
-import ButtonGroup from 'antd/lib/button/button-group';
-import React, { useEffect, useState } from 'react';
-import { RouteComponentProps } from 'react-router-dom';
+import { Divider, Drawer } from "antd";
+import ButtonGroup from "antd/lib/button/button-group";
+import React, { useEffect, useState } from "react";
+import { RouteComponentProps } from "react-router-dom";
 
-import { Language } from '../../interfaces/Language';
-import { License } from '../../interfaces/License';
-import { List } from '../../interfaces/List';
-import { Maintainer } from '../../interfaces/Maintainer';
-import { Software } from '../../interfaces/Software';
-import { Syntax } from '../../interfaces/Syntax';
-import { Tag } from '../../interfaces/Tag';
-import { Description } from '../Description';
-import { LanguageCloud } from '../languageCloud';
-import { LicenseTag } from '../LicenseTag';
-import { LinkButton } from '../LinkButton';
-import { Maintainers } from '../maintainers';
-import { PublishedDate } from '../PublishedDate';
-import { SoftwareCloud } from '../softwareCloud';
-import { SubscribeButtons } from '../SubscribeButtons';
-import { SyntaxTag } from '../SyntaxTag';
-import { TagCloud } from '../tagCloud';
+import { Language } from "../../interfaces/Language";
+import { License } from "../../interfaces/License";
+import { List } from "../../interfaces/List";
+import { Maintainer } from "../../interfaces/Maintainer";
+import { Software } from "../../interfaces/Software";
+import { Syntax } from "../../interfaces/Syntax";
+import { Tag } from "../../interfaces/Tag";
+import { Description } from "../Description";
+import { LanguageCloud } from "../languageCloud";
+import { LicenseTag } from "../LicenseTag";
+import { LinkButton } from "../LinkButton";
+import { Maintainers } from "../maintainers";
+import { PublishedDate } from "../PublishedDate";
+import { SoftwareCloud } from "../softwareCloud";
+import { SubscribeButtons } from "../SubscribeButtons";
+import { SyntaxTag } from "../SyntaxTag";
+import { TagCloud } from "../tagCloud";
 
 interface Props {
   list: List;
@@ -31,14 +31,17 @@ interface Props {
   software: Software[];
   syntax: Syntax | undefined;
   tags: Tag[];
-};
+}
 
 export const ListInfoDrawer = (props: RouteComponentProps & Props) => {
   const [originalTitle] = useState<string>(document.title);
   useEffect(() => {
-    const updateTitle = () => document.title = props.list.name + " | " + originalTitle;
+    const updateTitle = () =>
+      (document.title = props.list.name + " | " + originalTitle);
     updateTitle();
-    return () => { document.title = originalTitle; };
+    return () => {
+      document.title = originalTitle;
+    };
   }, [props.list, originalTitle]);
   return (
     <Drawer
@@ -48,29 +51,29 @@ export const ListInfoDrawer = (props: RouteComponentProps & Props) => {
       mask={false}
       title={props.list.name}
       destroyOnClose={true}
-      onClose={() => props.history.push("/")}>
+      onClose={() => props.history.push("/")}
+    >
       <Description
         description={props.list.description}
-        descriptionSourceUrl={props.list.descriptionSourceUrl} />
-      <LanguageCloud
-        languages={props.languages}
-        showLabel={true} />
-      <TagCloud
-        tags={props.tags}
-        showLabel={true} />
-      {props.license &&
+        descriptionSourceUrl={props.list.descriptionSourceUrl}
+      />
+      <LanguageCloud languages={props.languages} showLabel={true} />
+      <TagCloud tags={props.tags} showLabel={true} />
+      {props.license && (
         <LicenseTag
           name={props.license.name}
           descriptionUrl={props.license.descriptionUrl}
-          showLabel={true} />}
-      {props.syntax &&
+          showLabel={true}
+        />
+      )}
+      {props.syntax && (
         <SyntaxTag
           name={props.syntax.name}
           definitionUrl={props.syntax.definitionUrl}
-          showLabel={true} />}
-      <SoftwareCloud
-        software={props.software}
-        showLabel={true} />
+          showLabel={true}
+        />
+      )}
+      <SoftwareCloud software={props.software} showLabel={true} />
       <PublishedDate publishedDate={props.list.publishedDate} />
       <Maintainers maintainers={props.maintainers} />
       <Divider />
@@ -78,54 +81,65 @@ export const ListInfoDrawer = (props: RouteComponentProps & Props) => {
         <SubscribeButtons
           name={props.list.name}
           viewUrl={props.list.viewUrl}
-          viewUrlMirrors={props.list.viewUrlMirrors} />
+          viewUrlMirrors={props.list.viewUrlMirrors}
+        />
         <LinkButton
           url={props.list.viewUrl}
           text="View"
           title={`View ${props.list.name} in its raw format`}
-          icon="search" />
+          icon="search"
+        />
         <LinkButton
           url={props.list.homeUrl}
           text="Home"
           title={`View ${props.list.name}'s homepage.`}
-          icon="home" />
+          icon="home"
+        />
         <LinkButton
           url={props.list.policyUrl}
           text="Policy"
           title={`View the types of rules that ${props.list.name} includes.`}
-          icon="file-exclamation" />
-        {props.list.emailAddress &&
+          icon="file-exclamation"
+        />
+        {props.list.emailAddress && (
           <LinkButton
             url={`mailto:${props.list.emailAddress}`}
             text="Email"
             title={`Email ${props.list.name}.`}
-            icon="mail" />}
+            icon="mail"
+          />
+        )}
         <LinkButton
           url={props.list.issuesUrl}
           text="GitHub Issues"
           title={`View the GitHub Issues for ${props.list.name}.`}
-          icon="github" />
+          icon="github"
+        />
         <LinkButton
           url={props.list.submissionUrl}
           text="Submit a Rule"
           title={`Submit a new rule to be included in ${props.list.name}.`}
-          icon="form" />
+          icon="form"
+        />
         <LinkButton
           url={props.list.forumUrl}
           text="Forum"
           title={`View the forum for ${props.list.name}.`}
-          icon="team" />
+          icon="team"
+        />
         <LinkButton
           url={props.list.chatUrl}
           text="Chat"
           title={`Enter the chat room for ${props.list.name}.`}
-          icon="message" />
+          icon="message"
+        />
         <LinkButton
           url={props.list.donateUrl}
           text="Donate"
           title={`Donate to the maintainer of ${props.list.name}.`}
-          icon="dollar" />
+          icon="dollar"
+        />
       </ButtonGroup>
     </Drawer>
   );
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/components/listInfoDrawer/index.ts b/src/FilterLists.Web/src/components/listInfoDrawer/index.ts
index 7d0e163e7..03a1cedaf 100644
--- a/src/FilterLists.Web/src/components/listInfoDrawer/index.ts
+++ b/src/FilterLists.Web/src/components/listInfoDrawer/index.ts
@@ -1,3 +1,3 @@
-import { ListInfoDrawer } from './ListInfoDrawer';
+import { ListInfoDrawer } from "./ListInfoDrawer";
 
-export { ListInfoDrawer };
\ No newline at end of file
+export { ListInfoDrawer };
diff --git a/src/FilterLists.Web/src/components/listsTable/ListDrawer.tsx b/src/FilterLists.Web/src/components/listsTable/ListDrawer.tsx
index 54b69382d..2903030c7 100644
--- a/src/FilterLists.Web/src/components/listsTable/ListDrawer.tsx
+++ b/src/FilterLists.Web/src/components/listsTable/ListDrawer.tsx
@@ -1,14 +1,19 @@
-import React from 'react';
-import { Redirect, Route, RouteComponentProps, StaticContext } from 'react-router';
+import React from "react";
+import {
+  Redirect,
+  Route,
+  RouteComponentProps,
+  StaticContext
+} from "react-router";
 
-import { Language } from '../../interfaces/Language';
-import { License } from '../../interfaces/License';
-import { List } from '../../interfaces/List';
-import { Maintainer } from '../../interfaces/Maintainer';
-import { Software } from '../../interfaces/Software';
-import { Syntax } from '../../interfaces/Syntax';
-import { Tag } from '../../interfaces/Tag';
-import { ListInfoDrawer } from '../listInfoDrawer';
+import { Language } from "../../interfaces/Language";
+import { License } from "../../interfaces/License";
+import { List } from "../../interfaces/List";
+import { Maintainer } from "../../interfaces/Maintainer";
+import { Software } from "../../interfaces/Software";
+import { Syntax } from "../../interfaces/Syntax";
+import { Tag } from "../../interfaces/Tag";
+import { ListInfoDrawer } from "../listInfoDrawer";
 
 interface Props {
   lists: List[];
@@ -18,22 +23,52 @@ interface Props {
   software: Software[];
   syntaxes: Syntax[];
   tags: Tag[];
-};
+}
 
 export const ListDrawer = (props: Props) => {
   const renderDrawer = (rp: RouteComponentProps<any, StaticContext, any>) => {
     const list = props.lists.find(l => l.slug === rp.match.params.listSlug);
-    return list
-      ? <ListInfoDrawer
+    return list ? (
+      <ListInfoDrawer
         list={list as List}
-        languages={list.languageIds && props.languages.filter((l: Language) => list.languageIds.includes(l.id))}
-        license={list.licenseId ? props.licenses.find((l: License) => list.licenseId === l.id) : props.licenses.find((l: License) => l.id === 5)}
-        maintainers={list.maintainerIds && props.maintainers.filter((m: Maintainer) => list.maintainerIds.includes(m.id))}
-        software={list.syntaxId ? props.software.filter((s: Software) => s.syntaxIds.includes(list.syntaxId)) : []}
-        syntax={list.syntaxId ? props.syntaxes.find(s => s.id === list.syntaxId) : undefined}
-        tags={list.tagIds && props.tags.filter((t: Tag) => list.tagIds.includes(t.id))}
-        {...rp} />
-      : (props.lists && props.lists.length) ? <Redirect to={{ pathname: "/", }} /> : null;
+        languages={
+          list.languageIds &&
+          props.languages.filter((l: Language) =>
+            list.languageIds.includes(l.id)
+          )
+        }
+        license={
+          list.licenseId
+            ? props.licenses.find((l: License) => list.licenseId === l.id)
+            : props.licenses.find((l: License) => l.id === 5)
+        }
+        maintainers={
+          list.maintainerIds &&
+          props.maintainers.filter((m: Maintainer) =>
+            list.maintainerIds.includes(m.id)
+          )
+        }
+        software={
+          list.syntaxId
+            ? props.software.filter((s: Software) =>
+                s.syntaxIds.includes(list.syntaxId)
+              )
+            : []
+        }
+        syntax={
+          list.syntaxId
+            ? props.syntaxes.find(s => s.id === list.syntaxId)
+            : undefined
+        }
+        tags={
+          list.tagIds &&
+          props.tags.filter((t: Tag) => list.tagIds.includes(t.id))
+        }
+        {...rp}
+      />
+    ) : props.lists && props.lists.length ? (
+      <Redirect to={{ pathname: "/" }} />
+    ) : null;
   };
   return <Route path="/lists/:listSlug" render={renderDrawer} />;
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/components/listsTable/ListsTable.tsx b/src/FilterLists.Web/src/components/listsTable/ListsTable.tsx
index 5453d84d1..d86689093 100644
--- a/src/FilterLists.Web/src/components/listsTable/ListsTable.tsx
+++ b/src/FilterLists.Web/src/components/listsTable/ListsTable.tsx
@@ -1,29 +1,33 @@
-import './listsTable.css';
+import "./listsTable.css";
 
-import { Table, Tag } from 'antd';
-import { PaginationConfig, SorterResult, TableCurrentDataSource } from 'antd/lib/table';
-import React, { useEffect, useState } from 'react';
-import { RouteComponentProps } from 'react-router';
+import { Table, Tag } from "antd";
+import {
+  PaginationConfig,
+  SorterResult,
+  TableCurrentDataSource
+} from "antd/lib/table";
+import React, { useEffect, useState } from "react";
+import { RouteComponentProps } from "react-router";
 
-import { useSearchColumnFilter, useTablePageSizer } from '../../hooks';
-import { Language } from '../../interfaces/Language';
-import { License } from '../../interfaces/License';
-import { List } from '../../interfaces/List';
-import { Maintainer } from '../../interfaces/Maintainer';
-import { Software } from '../../interfaces/Software';
-import { Syntax } from '../../interfaces/Syntax';
-import { Tag as TagInterface } from '../../interfaces/Tag';
-import { nameof } from '../../utils';
-import { Description } from '../Description';
-import { LanguageCloud } from '../languageCloud';
-import { LicenseTag } from '../LicenseTag';
-import { ListInfoButton } from '../ListInfoButton';
-import { MaintainerCloud } from '../maintainerCloud';
-import { SoftwareCloud, SoftwareIcon } from '../softwareCloud';
-import { SyntaxTag } from '../SyntaxTag';
-import { TagCloud } from '../tagCloud';
-import { arraySorter } from './arraySorter';
-import styles from './ListsTable.module.css';
+import { useSearchColumnFilter, useTablePageSizer } from "../../hooks";
+import { Language } from "../../interfaces/Language";
+import { License } from "../../interfaces/License";
+import { List } from "../../interfaces/List";
+import { Maintainer } from "../../interfaces/Maintainer";
+import { Software } from "../../interfaces/Software";
+import { Syntax } from "../../interfaces/Syntax";
+import { Tag as TagInterface } from "../../interfaces/Tag";
+import { nameof } from "../../utils";
+import { Description } from "../Description";
+import { LanguageCloud } from "../languageCloud";
+import { LicenseTag } from "../LicenseTag";
+import { ListInfoButton } from "../ListInfoButton";
+import { MaintainerCloud } from "../maintainerCloud";
+import { SoftwareCloud, SoftwareIcon } from "../softwareCloud";
+import { SyntaxTag } from "../SyntaxTag";
+import { TagCloud } from "../tagCloud";
+import { arraySorter } from "./arraySorter";
+import styles from "./ListsTable.module.css";
 
 interface Props {
   lists: List[];
@@ -33,13 +37,24 @@ interface Props {
   software: Software[];
   syntaxes: Syntax[];
   tags: TagInterface[];
-};
+}
 
 export const ListsTable = (props: RouteComponentProps & Props) => {
-  const { lists, languages, licenses, maintainers, software, syntaxes, tags, ...routeComponentProps } = props;
+  const {
+    lists,
+    languages,
+    licenses,
+    maintainers,
+    software,
+    syntaxes,
+    tags,
+    ...routeComponentProps
+  } = props;
   const tablePageSize = useTablePageSizer();
   const searchNameColumn = useSearchColumnFilter<List>(nameof<List>("name"));
-  const searchDescriptionColumn = useSearchColumnFilter<List>(nameof<List>("description"));
+  const searchDescriptionColumn = useSearchColumnFilter<List>(
+    nameof<List>("description")
+  );
   const [visibleLists, setVisibleLists] = useState<List[]>(lists);
   useEffect(() => {
     setVisibleLists(lists);
@@ -56,8 +71,13 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
         pageSize: tablePageSize.pageSize
       }}
       scroll={{ x: tablePageSize.isNarrowWindow ? undefined : 1892 }}
-      onChange={(_pagination: PaginationConfig, _filters: Record<keyof List, string[]>, _sorter: SorterResult<List>, extra: TableCurrentDataSource<List>) =>
-        setVisibleLists(extra.currentDataSource)}>
+      onChange={(
+        _pagination: PaginationConfig,
+        _filters: Record<keyof List, string[]>,
+        _sorter: SorterResult<List>,
+        extra: TableCurrentDataSource<List>
+      ) => setVisibleLists(extra.currentDataSource)}
+    >
       <Table.Column<List>
         title="Info"
         key="Info"
@@ -65,8 +85,10 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
         width={tablePageSize.isNarrowWindow ? 43 : undefined}
         className={styles.nogrow}
         fixed={tablePageSize.isNarrowWindow ? undefined : "left"}
-        render={(_id: number, list: List) =>
-          <ListInfoButton listName={list.name} {...routeComponentProps} />} />
+        render={(_id: number, list: List) => (
+          <ListInfoButton listName={list.name} {...routeComponentProps} />
+        )}
+      />
       <Table.Column<List>
         title="Name"
         key="Name"
@@ -79,11 +101,10 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
         filterDropdown={searchNameColumn.filterDropdown}
         filterIcon={searchNameColumn.filterIcon}
         onFilter={searchNameColumn.onFilter}
-        render={(name: string) =>
-          <div>{name}</div>} />
-      {tablePageSize.isNarrowWindow
-        ? null
-        : <Table.Column<List>
+        render={(name: string) => <div>{name}</div>}
+      />
+      {tablePageSize.isNarrowWindow ? null : (
+        <Table.Column<List>
           title="Description"
           key="Description"
           dataIndex={nameof<List>("description")}
@@ -91,38 +112,63 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
           filterDropdown={searchDescriptionColumn.filterDropdown}
           filterIcon={searchDescriptionColumn.filterIcon}
           onFilter={searchDescriptionColumn.onFilter}
-          render={(description: string, list: List) =>
+          render={(description: string, list: List) => (
             <Description
               description={description}
-              descriptionSourceUrl={list.descriptionSourceUrl} />} />}
-      {tablePageSize.isNarrowWindow
-        ? null
-        : <Table.Column<List>
+              descriptionSourceUrl={list.descriptionSourceUrl}
+            />
+          )}
+        />
+      )}
+      {tablePageSize.isNarrowWindow ? null : (
+        <Table.Column<List>
           title="Software"
           key="Software"
           dataIndex={nameof<List>("syntaxId")}
           sorter={(a, b) => {
-            const getSoftwareIds = (l: List) => software.filter((s: Software) => s.syntaxIds.includes(l.syntaxId)).map(s => s.id);
+            const getSoftwareIds = (l: List) =>
+              software
+                .filter((s: Software) => s.syntaxIds.includes(l.syntaxId))
+                .map(s => s.id);
             return arraySorter(getSoftwareIds(a), getSoftwareIds(b), software);
           }}
           width={143}
           className={styles.nogrow}
           filters={software.map(s => ({
-            text: <>
-              <SoftwareIcon id={s.id} />&nbsp;
-              {s.name}&nbsp;
-              ({visibleLists.filter(l => s.syntaxIds && s.syntaxIds.includes(l.syntaxId)).length})
-              </>,
+            text: (
+              <>
+                <SoftwareIcon id={s.id} />
+                &nbsp;
+                {s.name}&nbsp; (
+                {
+                  visibleLists.filter(
+                    l => s.syntaxIds && s.syntaxIds.includes(l.syntaxId)
+                  ).length
+                }
+                )
+              </>
+            ),
             value: s.name
           }))}
-          onFilter={(value, record) => software.filter((s: Software) => s.name === value).flatMap(s => s.syntaxIds).includes(record.syntaxId)}
+          onFilter={(value, record) =>
+            software
+              .filter((s: Software) => s.name === value)
+              .flatMap(s => s.syntaxIds)
+              .includes(record.syntaxId)
+          }
           render={(syntaxId: number) =>
-            syntaxId
-              ? <SoftwareCloud software={software.filter((s: Software) => s.syntaxIds.includes(syntaxId))} />
-              : null} />}
-      {tablePageSize.isNarrowWindow
-        ? null
-        : <Table.Column<List>
+            syntaxId ? (
+              <SoftwareCloud
+                software={software.filter((s: Software) =>
+                  s.syntaxIds.includes(syntaxId)
+                )}
+              />
+            ) : null
+          }
+        />
+      )}
+      {tablePageSize.isNarrowWindow ? null : (
+        <Table.Column<List>
           title="Syntax"
           key="Syntax"
           dataIndex={nameof<List>("syntaxId")}
@@ -138,48 +184,73 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
           width={254}
           className={styles.nogrow}
           filters={syntaxes.map(s => ({
-            text: <>
-              <SyntaxTag name={s.name} showLabel={false} />
-              ({visibleLists.filter(l => l.syntaxId && l.syntaxId === s.id).length})
-              </>,
+            text: (
+              <>
+                <SyntaxTag name={s.name} showLabel={false} />(
+                {
+                  visibleLists.filter(l => l.syntaxId && l.syntaxId === s.id)
+                    .length
+                }
+                )
+              </>
+            ),
             value: s.id.toString()
           }))}
-          onFilter={(value, record) => record.syntaxId
-            ? record.syntaxId.toString() === value
-            : false}
+          onFilter={(value, record) =>
+            record.syntaxId ? record.syntaxId.toString() === value : false
+          }
           render={(syntaxId: number) => {
             const syntax = syntaxes.find(s => s.id === syntaxId);
-            return syntax
-              ? <SyntaxTag name={syntax.name} definitionUrl={syntax.definitionUrl} />
-              : null
-          }} />}
-      {tablePageSize.isNarrowWindow
-        ? null
-        : <Table.Column<List>
+            return syntax ? (
+              <SyntaxTag
+                name={syntax.name}
+                definitionUrl={syntax.definitionUrl}
+              />
+            ) : null;
+          }}
+        />
+      )}
+      {tablePageSize.isNarrowWindow ? null : (
+        <Table.Column<List>
           title="Languages"
           key="Languages"
           dataIndex={nameof<List>("languageIds")}
-          sorter={(a, b) => arraySorter(a.languageIds, b.languageIds, languages)}
+          sorter={(a, b) =>
+            arraySorter(a.languageIds, b.languageIds, languages)
+          }
           width={129}
           className={styles.nogrow}
           filters={languages.map(l => ({
-            text: <>
-              <Tag title={l.name}>{l.iso6391}</Tag>&nbsp;
-              {l.name}&nbsp;
-              ({visibleLists.filter(li => li.languageIds && li.languageIds.includes(l.id)).length})
-            </>,
+            text: (
+              <>
+                <Tag title={l.name}>{l.iso6391}</Tag>&nbsp;
+                {l.name}&nbsp; (
+                {
+                  visibleLists.filter(
+                    li => li.languageIds && li.languageIds.includes(l.id)
+                  ).length
+                }
+                )
+              </>
+            ),
             value: l.id.toString()
           }))}
-          onFilter={(value, record) => record.languageIds
-            ? record.languageIds.includes(+value)
-            : false}
+          onFilter={(value, record) =>
+            record.languageIds ? record.languageIds.includes(+value) : false
+          }
           render={(languageIds: number[]) =>
-            languageIds
-              ? <LanguageCloud languages={languages.filter((l: Language) => languageIds.includes(l.id))} />
-              : null} />}
-      {tablePageSize.isNarrowWindow
-        ? null
-        : <Table.Column<List>
+            languageIds ? (
+              <LanguageCloud
+                languages={languages.filter((l: Language) =>
+                  languageIds.includes(l.id)
+                )}
+              />
+            ) : null
+          }
+        />
+      )}
+      {tablePageSize.isNarrowWindow ? null : (
+        <Table.Column<List>
           title="Tags"
           key="Tags"
           dataIndex={nameof<List>("tagIds")}
@@ -187,45 +258,70 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
           width={275}
           className={styles.nogrow}
           filters={tags.map(t => ({
-            text: <>
-              <Tag title={t.description}>{t.name}</Tag>
-              ({visibleLists.filter(l => l.tagIds && l.tagIds.includes(t.id)).length})
-            </>,
+            text: (
+              <>
+                <Tag title={t.description}>{t.name}</Tag>(
+                {
+                  visibleLists.filter(l => l.tagIds && l.tagIds.includes(t.id))
+                    .length
+                }
+                )
+              </>
+            ),
             value: t.id.toString()
           }))}
-          onFilter={(value, record) => record.tagIds
-            ? record.tagIds.includes(+value)
-            : false}
+          onFilter={(value, record) =>
+            record.tagIds ? record.tagIds.includes(+value) : false
+          }
           render={(tagIds: number[]) =>
-            tagIds
-              ? <TagCloud tags={tags.filter((t: TagInterface) => tagIds.includes(t.id))} />
-              : null} />}
-      {tablePageSize.isNarrowWindow
-        ? null
-        : <Table.Column<List>
+            tagIds ? (
+              <TagCloud
+                tags={tags.filter((t: TagInterface) => tagIds.includes(t.id))}
+              />
+            ) : null
+          }
+        />
+      )}
+      {tablePageSize.isNarrowWindow ? null : (
+        <Table.Column<List>
           title="Maintainers"
           key="Maintainers"
           dataIndex={nameof<List>("maintainerIds")}
-          sorter={(a, b) => arraySorter(a.maintainerIds, b.maintainerIds, maintainers)}
+          sorter={(a, b) =>
+            arraySorter(a.maintainerIds, b.maintainerIds, maintainers)
+          }
           width={191}
           className={styles.nogrow}
           filters={maintainers.map(t => ({
-            text: <>
-              <Tag title={t.name}>{t.name}</Tag>
-              ({visibleLists.filter(l => l.maintainerIds && l.maintainerIds.includes(t.id)).length})
-            </>,
+            text: (
+              <>
+                <Tag title={t.name}>{t.name}</Tag>(
+                {
+                  visibleLists.filter(
+                    l => l.maintainerIds && l.maintainerIds.includes(t.id)
+                  ).length
+                }
+                )
+              </>
+            ),
             value: t.id.toString()
           }))}
-          onFilter={(value, record) => record.maintainerIds
-            ? record.maintainerIds.includes(+value)
-            : false}
+          onFilter={(value, record) =>
+            record.maintainerIds ? record.maintainerIds.includes(+value) : false
+          }
           render={(maintainerIds: number[]) =>
-            maintainerIds
-              ? <MaintainerCloud maintainers={maintainers.filter((t: Maintainer) => maintainerIds.includes(t.id))} />
-              : null} />}
-      {tablePageSize.isNarrowWindow
-        ? null
-        : <Table.Column<List>
+            maintainerIds ? (
+              <MaintainerCloud
+                maintainers={maintainers.filter((t: Maintainer) =>
+                  maintainerIds.includes(t.id)
+                )}
+              />
+            ) : null
+          }
+        />
+      )}
+      {tablePageSize.isNarrowWindow ? null : (
+        <Table.Column<List>
           title="License"
           key="License"
           dataIndex={nameof<List>("licenseId")}
@@ -241,21 +337,34 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
           width={215}
           className={styles.nogrow}
           filters={licenses.map(l => ({
-            text: <>
-              <LicenseTag name={l.name} showLabel={false} />
-              ({visibleLists.filter(li => li.licenseId && li.licenseId === l.id).length})
-              </>,
+            text: (
+              <>
+                <LicenseTag name={l.name} showLabel={false} />(
+                {
+                  visibleLists.filter(
+                    li => li.licenseId && li.licenseId === l.id
+                  ).length
+                }
+                )
+              </>
+            ),
             value: l.id.toString()
           }))}
-          onFilter={(value, record) => record.licenseId
-            ? record.licenseId.toString() === value
-            : false}
+          onFilter={(value, record) =>
+            record.licenseId ? record.licenseId.toString() === value : false
+          }
           render={(licenseId: number) => {
             const license = licenses.find(l => l.id === licenseId);
-            return license
-              ? <LicenseTag name={license.name} descriptionUrl={license.descriptionUrl} showLabel={false} />
-              : null
-          }} />}
+            return license ? (
+              <LicenseTag
+                name={license.name}
+                descriptionUrl={license.descriptionUrl}
+                showLabel={false}
+              />
+            ) : null;
+          }}
+        />
+      )}
     </Table>
   );
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/components/listsTable/ListsTableHoc.tsx b/src/FilterLists.Web/src/components/listsTable/ListsTableHoc.tsx
index 6b082fd59..fca061583 100644
--- a/src/FilterLists.Web/src/components/listsTable/ListsTableHoc.tsx
+++ b/src/FilterLists.Web/src/components/listsTable/ListsTableHoc.tsx
@@ -1,9 +1,17 @@
-import React from 'react';
-import { RouteComponentProps } from 'react-router-dom';
+import React from "react";
+import { RouteComponentProps } from "react-router-dom";
 
-import { useLanguages, useLicenses, useLists, useMaintainers, useSoftware, useSyntaxes, useTags } from '../../hooks';
-import { ListDrawer } from './ListDrawer';
-import { ListsTable } from './ListsTable';
+import {
+  useLanguages,
+  useLicenses,
+  useLists,
+  useMaintainers,
+  useSoftware,
+  useSyntaxes,
+  useTags
+} from "../../hooks";
+import { ListDrawer } from "./ListDrawer";
+import { ListsTable } from "./ListsTable";
 
 export const ListsTableHoc = (props: RouteComponentProps) => {
   const lists = useLists();
@@ -23,7 +31,8 @@ export const ListsTableHoc = (props: RouteComponentProps) => {
         software={software}
         syntaxes={syntaxes}
         tags={tags}
-        {...props} />
+        {...props}
+      />
       <ListDrawer
         lists={lists}
         languages={languages}
@@ -31,7 +40,8 @@ export const ListsTableHoc = (props: RouteComponentProps) => {
         maintainers={maintainers}
         software={software}
         syntaxes={syntaxes}
-        tags={tags} />
+        tags={tags}
+      />
     </>
   );
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/components/listsTable/arraySorter.ts b/src/FilterLists.Web/src/components/listsTable/arraySorter.ts
index 75afb46e2..17a5a8a62 100644
--- a/src/FilterLists.Web/src/components/listsTable/arraySorter.ts
+++ b/src/FilterLists.Web/src/components/listsTable/arraySorter.ts
@@ -1,18 +1,30 @@
 interface ArraySortableEntity {
   id: number;
   name: string;
-};
+}
 
-export const arraySorter = (a: number[], b: number[], entities: ArraySortableEntity[]) =>
+export const arraySorter = (
+  a: number[],
+  b: number[],
+  entities: ArraySortableEntity[]
+) =>
   a && a.length
     ? b && b.length
       ? a.length === b.length
-        ? entities.filter((e: ArraySortableEntity) => a.includes(e.id)).map((e: ArraySortableEntity) => e.name).join().toLowerCase()
-          > entities.filter((e: ArraySortableEntity) => b.includes(e.id)).map((e: ArraySortableEntity) => e.name).join().toLowerCase()
+        ? entities
+            .filter((e: ArraySortableEntity) => a.includes(e.id))
+            .map((e: ArraySortableEntity) => e.name)
+            .join()
+            .toLowerCase() >
+          entities
+            .filter((e: ArraySortableEntity) => b.includes(e.id))
+            .map((e: ArraySortableEntity) => e.name)
+            .join()
+            .toLowerCase()
           ? 1
           : -1
         : a.length > b.length
-          ? -1
-          : 1
+        ? -1
+        : 1
       : -1
-    : 1;
\ No newline at end of file
+    : 1;
diff --git a/src/FilterLists.Web/src/components/listsTable/index.ts b/src/FilterLists.Web/src/components/listsTable/index.ts
index e69706c2e..541bf2eb9 100644
--- a/src/FilterLists.Web/src/components/listsTable/index.ts
+++ b/src/FilterLists.Web/src/components/listsTable/index.ts
@@ -1,3 +1,3 @@
-import { ListsTableHoc } from './ListsTableHoc';
+import { ListsTableHoc } from "./ListsTableHoc";
 
-export { ListsTableHoc as ListsTable };
\ No newline at end of file
+export { ListsTableHoc as ListsTable };
diff --git a/src/FilterLists.Web/src/components/listsTable/listsTable.css b/src/FilterLists.Web/src/components/listsTable/listsTable.css
index 308a44b11..34d395832 100644
--- a/src/FilterLists.Web/src/components/listsTable/listsTable.css
+++ b/src/FilterLists.Web/src/components/listsTable/listsTable.css
@@ -1,3 +1,3 @@
 .ant-table-header-column > div {
   margin-top: 8px;
-}
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/components/maintainerCloud/MaintainerCloud.tsx b/src/FilterLists.Web/src/components/maintainerCloud/MaintainerCloud.tsx
index 90d9fff0c..155b92fe1 100644
--- a/src/FilterLists.Web/src/components/maintainerCloud/MaintainerCloud.tsx
+++ b/src/FilterLists.Web/src/components/maintainerCloud/MaintainerCloud.tsx
@@ -1,26 +1,31 @@
-import { Tag } from 'antd';
-import React from 'react';
+import { Tag } from "antd";
+import React from "react";
 
-import { Maintainer } from '../../interfaces/Maintainer';
-import styles from './MaintainerCloud.module.css';
+import { Maintainer } from "../../interfaces/Maintainer";
+import styles from "./MaintainerCloud.module.css";
 
 interface Props {
   maintainers: Maintainer[];
-};
+}
 
 export const MaintainerCloud = (props: Props) =>
-  props.maintainers && props.maintainers.length
-    ? <div className={styles.grow}>
+  props.maintainers && props.maintainers.length ? (
+    <div className={styles.grow}>
       {props.maintainers.map((m: Maintainer, i: number) =>
-        m.homeUrl
-          ? <Tag key={i}>
-            <a href={m.homeUrl}
+        m.homeUrl ? (
+          <Tag key={i}>
+            <a
+              href={m.homeUrl}
               title={`View ${m.name}'s homepage.`}
               target="_blank"
-              rel="noopener noreferrer">
+              rel="noopener noreferrer"
+            >
               {m.name}
             </a>
           </Tag>
-          : <Tag key={i}>{m.name}</Tag>)}
+        ) : (
+          <Tag key={i}>{m.name}</Tag>
+        )
+      )}
     </div>
-    : null;
\ No newline at end of file
+  ) : null;
diff --git a/src/FilterLists.Web/src/components/maintainerCloud/index.ts b/src/FilterLists.Web/src/components/maintainerCloud/index.ts
index d7e5ed272..c0c593fa3 100644
--- a/src/FilterLists.Web/src/components/maintainerCloud/index.ts
+++ b/src/FilterLists.Web/src/components/maintainerCloud/index.ts
@@ -1,3 +1,3 @@
-import { MaintainerCloud } from './MaintainerCloud';
+import { MaintainerCloud } from "./MaintainerCloud";
 
-export { MaintainerCloud };
\ No newline at end of file
+export { MaintainerCloud };
diff --git a/src/FilterLists.Web/src/components/maintainers/Maintainers.tsx b/src/FilterLists.Web/src/components/maintainers/Maintainers.tsx
index d6890734b..12e235300 100644
--- a/src/FilterLists.Web/src/components/maintainers/Maintainers.tsx
+++ b/src/FilterLists.Web/src/components/maintainers/Maintainers.tsx
@@ -1,22 +1,23 @@
-import './maintainers.css';
+import "./maintainers.css";
 
-import { Card, Icon } from 'antd';
-import React from 'react';
+import { Card, Icon } from "antd";
+import React from "react";
 
-import { Maintainer } from '../../interfaces/Maintainer';
+import { Maintainer } from "../../interfaces/Maintainer";
 
 interface Props {
   maintainers: Maintainer[];
-};
+}
 
 export const Maintainers = (props: Props) =>
-  props.maintainers && props.maintainers.length
-    ? <>
+  props.maintainers && props.maintainers.length ? (
+    <>
       <h3>Maintainer{props.maintainers.length > 1 ? "s" : ""}:</h3>
-      {props.maintainers.map((m: Maintainer, index: number) =>
-        <MaintainerComponent key={index} maintainer={m} />)}
+      {props.maintainers.map((m: Maintainer, index: number) => (
+        <MaintainerComponent key={index} maintainer={m} />
+      ))}
     </>
-    : null;
+  ) : null;
 
 interface MaintainerComponentProps {
   maintainer: Maintainer;
@@ -26,35 +27,39 @@ const MaintainerComponent = (props: MaintainerComponentProps) => {
   let actions = [];
   if (props.maintainer.homeUrl) {
     actions.push(
-      <a href={props.maintainer.homeUrl}
+      <a
+        href={props.maintainer.homeUrl}
         title={`View ${props.maintainer.name}'s homepage.`}
         target="_blank"
-        rel="noopener noreferrer">
+        rel="noopener noreferrer"
+      >
         <Icon type="home" key="home" />
       </a>
     );
   }
   if (props.maintainer.emailAddress) {
     actions.push(
-      <a href={`mailto:${props.maintainer.emailAddress}`}
+      <a
+        href={`mailto:${props.maintainer.emailAddress}`}
         title={`Email ${props.maintainer.name}.`}
         target="_blank"
-        rel="noopener noreferrer">
+        rel="noopener noreferrer"
+      >
         <Icon type="mail" key="mail" />
       </a>
     );
   }
   if (props.maintainer.twitterHandle) {
     actions.push(
-      <a href={`https://twitter.com/${props.maintainer.twitterHandle}`}
+      <a
+        href={`https://twitter.com/${props.maintainer.twitterHandle}`}
         title={`${props.maintainer.twitterHandle} on Twitter`}
         target="_blank"
-        rel="noopener noreferrer">
+        rel="noopener noreferrer"
+      >
         <Icon type="twitter" key="twitter" />
       </a>
     );
   }
-  return <Card
-    title={props.maintainer.name}
-    actions={actions} />;
-}
\ No newline at end of file
+  return <Card title={props.maintainer.name} actions={actions} />;
+};
diff --git a/src/FilterLists.Web/src/components/maintainers/index.ts b/src/FilterLists.Web/src/components/maintainers/index.ts
index 47f755084..c44a20b8f 100644
--- a/src/FilterLists.Web/src/components/maintainers/index.ts
+++ b/src/FilterLists.Web/src/components/maintainers/index.ts
@@ -1,3 +1,3 @@
-import { Maintainers } from './Maintainers';
+import { Maintainers } from "./Maintainers";
 
-export { Maintainers };
\ No newline at end of file
+export { Maintainers };
diff --git a/src/FilterLists.Web/src/components/softwareCloud/SoftwareCloud.tsx b/src/FilterLists.Web/src/components/softwareCloud/SoftwareCloud.tsx
index 50090622d..332a23f3c 100644
--- a/src/FilterLists.Web/src/components/softwareCloud/SoftwareCloud.tsx
+++ b/src/FilterLists.Web/src/components/softwareCloud/SoftwareCloud.tsx
@@ -1,26 +1,26 @@
-import React from 'react';
+import React from "react";
 
-import { Software } from '../../interfaces/Software';
-import styles from './SoftwareCloud.module.css';
-import { SoftwareIcon } from './SoftwareIcon';
+import { Software } from "../../interfaces/Software";
+import styles from "./SoftwareCloud.module.css";
+import { SoftwareIcon } from "./SoftwareIcon";
 
 interface Props {
   software: Software[];
   showLabel?: boolean;
-};
+}
 
 export const SoftwareCloud = (props: Props) =>
-  props.software && props.software.length
-    ? <div className={styles.grow}>
+  props.software && props.software.length ? (
+    <div className={styles.grow}>
       {props.showLabel && <h3>{`Software:`}</h3>}
       {props.software.map((s: Software, i: number) =>
-        s.homeUrl
-          ? <a key={i}
-            href={s.homeUrl}
-            target="_blank"
-            rel="noopener noreferrer">
+        s.homeUrl ? (
+          <a key={i} href={s.homeUrl} target="_blank" rel="noopener noreferrer">
             <SoftwareIcon id={s.id} />
           </a>
-          : <SoftwareIcon key={i} id={s.id} />)}
+        ) : (
+          <SoftwareIcon key={i} id={s.id} />
+        )
+      )}
     </div>
-    : null;
\ No newline at end of file
+  ) : null;
diff --git a/src/FilterLists.Web/src/components/softwareCloud/SoftwareIcon.tsx b/src/FilterLists.Web/src/components/softwareCloud/SoftwareIcon.tsx
index 06c0fbeb1..de456fc53 100644
--- a/src/FilterLists.Web/src/components/softwareCloud/SoftwareIcon.tsx
+++ b/src/FilterLists.Web/src/components/softwareCloud/SoftwareIcon.tsx
@@ -1,4 +1,4 @@
-import * as React from 'react';
+import * as React from "react";
 
 import {
   img01,
@@ -37,27 +37,28 @@ import {
   img35,
   img36,
   img37
-} from './imgs';
+} from "./imgs";
 
 interface Props {
   id: number;
-};
+}
 
 export const SoftwareIcon = (props: Props) =>
-  icons[props.id]
-    ? <img
+  icons[props.id] ? (
+    <img
       src={icons[props.id].image}
       height="20"
       alt={icons[props.id].imageTitle}
-      title={icons[props.id].imageTitle} />
-    : null;
+      title={icons[props.id].imageTitle}
+    />
+  ) : null;
 
 interface Icon {
   image: any;
   imageTitle: string;
-};
+}
 
-const icons: { [id: number]: Icon; } = {
+const icons: { [id: number]: Icon } = {
   1: { image: img01, imageTitle: "uBlock Origin" },
   2: { image: img02, imageTitle: "Adblock Plus" },
   3: { image: img03, imageTitle: "AdGuard" },
@@ -94,4 +95,4 @@ const icons: { [id: number]: Icon; } = {
   35: { image: img35, imageTitle: "Shadowsocks" },
   36: { image: img36, imageTitle: "ShadowsocksR" },
   37: { image: img37, imageTitle: "Shadowrocket" }
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/components/softwareCloud/imgs/imgs.d.ts b/src/FilterLists.Web/src/components/softwareCloud/imgs/imgs.d.ts
index 7f415fac2..a29b0ba00 100644
--- a/src/FilterLists.Web/src/components/softwareCloud/imgs/imgs.d.ts
+++ b/src/FilterLists.Web/src/components/softwareCloud/imgs/imgs.d.ts
@@ -6,4 +6,4 @@
 declare module "*.png" {
   const content: any;
   export default content;
-}
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/components/softwareCloud/imgs/index.ts b/src/FilterLists.Web/src/components/softwareCloud/imgs/index.ts
index 6a3593408..b08d560e2 100644
--- a/src/FilterLists.Web/src/components/softwareCloud/imgs/index.ts
+++ b/src/FilterLists.Web/src/components/softwareCloud/imgs/index.ts
@@ -1,39 +1,39 @@
-import img01 from './01-uBlock-Origin.svg';
-import img02 from './02-Adblock-Plus.svg';
-import img03 from './03-AdGuard.svg';
-import img04 from './04-DNS66.png';
-import img05 from './05-Nano-Adblocker.png';
-import img06 from './06-AdBlock.png';
-import img07 from './07-AdAway.png';
-import img08 from './08-Personal-Blocklist.png';
-import img10 from './10-Redirector.png';
-import img11 from './11-Hosts-File-Editor.png';
-import img12 from './12-Gas-Mask.png';
-import img13 from './13-MinerBlock.svg';
-import img14 from './14-Pi-hole.svg';
-import img15 from './15-uBlock.svg';
-import img16 from './16-Internet-Explorer-TPL.svg';
-import img17 from './17-Google-Hit-Hider-by-Domain.png';
-import img18 from './18-FireHOL.png';
-import img19 from './19-Samsung-Knox.png';
-import img20 from './20-Little-Snitch.png';
-import img21 from './21-Privoxy.png';
-import img22 from './22-Diversion.png';
-import img23 from './23-dnsmasq.png';
-import img24 from './24-Slimjet.png';
-import img25 from './25-uMatrix.png';
-import img26 from './26-Blokada.png';
-import img27 from './27-hostsmgr.png';
-import img28 from './28-personalDNSfilter.svg';
-import img29 from './29-Unbound.png';
-import img30 from './30-BIND.png';
-import img31 from './31-AdGuard-Home.png';
-import img32 from './32-AdNauseam.png';
-import img33 from './33-Legacy-Unix-Derivatives.png';
-import img34 from './34-Windows-command-line.png';
-import img35 from './35-Shadowsocks.png';
-import img36 from './36-ShadowsocksR.png';
-import img37 from './37-Shadowrocket.png';
+import img01 from "./01-uBlock-Origin.svg";
+import img02 from "./02-Adblock-Plus.svg";
+import img03 from "./03-AdGuard.svg";
+import img04 from "./04-DNS66.png";
+import img05 from "./05-Nano-Adblocker.png";
+import img06 from "./06-AdBlock.png";
+import img07 from "./07-AdAway.png";
+import img08 from "./08-Personal-Blocklist.png";
+import img10 from "./10-Redirector.png";
+import img11 from "./11-Hosts-File-Editor.png";
+import img12 from "./12-Gas-Mask.png";
+import img13 from "./13-MinerBlock.svg";
+import img14 from "./14-Pi-hole.svg";
+import img15 from "./15-uBlock.svg";
+import img16 from "./16-Internet-Explorer-TPL.svg";
+import img17 from "./17-Google-Hit-Hider-by-Domain.png";
+import img18 from "./18-FireHOL.png";
+import img19 from "./19-Samsung-Knox.png";
+import img20 from "./20-Little-Snitch.png";
+import img21 from "./21-Privoxy.png";
+import img22 from "./22-Diversion.png";
+import img23 from "./23-dnsmasq.png";
+import img24 from "./24-Slimjet.png";
+import img25 from "./25-uMatrix.png";
+import img26 from "./26-Blokada.png";
+import img27 from "./27-hostsmgr.png";
+import img28 from "./28-personalDNSfilter.svg";
+import img29 from "./29-Unbound.png";
+import img30 from "./30-BIND.png";
+import img31 from "./31-AdGuard-Home.png";
+import img32 from "./32-AdNauseam.png";
+import img33 from "./33-Legacy-Unix-Derivatives.png";
+import img34 from "./34-Windows-command-line.png";
+import img35 from "./35-Shadowsocks.png";
+import img36 from "./36-ShadowsocksR.png";
+import img37 from "./37-Shadowrocket.png";
 
 export {
   img01,
@@ -72,4 +72,4 @@ export {
   img35,
   img36,
   img37
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/components/softwareCloud/index.ts b/src/FilterLists.Web/src/components/softwareCloud/index.ts
index 212ee46c3..6c9548df2 100644
--- a/src/FilterLists.Web/src/components/softwareCloud/index.ts
+++ b/src/FilterLists.Web/src/components/softwareCloud/index.ts
@@ -1,4 +1,4 @@
-import { SoftwareCloud } from './SoftwareCloud';
-import { SoftwareIcon } from './SoftwareIcon';
+import { SoftwareCloud } from "./SoftwareCloud";
+import { SoftwareIcon } from "./SoftwareIcon";
 
-export { SoftwareCloud, SoftwareIcon };
\ No newline at end of file
+export { SoftwareCloud, SoftwareIcon };
diff --git a/src/FilterLists.Web/src/components/tagCloud/TagCloud.tsx b/src/FilterLists.Web/src/components/tagCloud/TagCloud.tsx
index 45b0d4073..ec36461fb 100644
--- a/src/FilterLists.Web/src/components/tagCloud/TagCloud.tsx
+++ b/src/FilterLists.Web/src/components/tagCloud/TagCloud.tsx
@@ -1,19 +1,22 @@
-import { Tag } from 'antd';
-import React from 'react';
+import { Tag } from "antd";
+import React from "react";
 
-import { Tag as TagInterface } from '../../interfaces/Tag';
-import styles from './TagCloud.module.css';
+import { Tag as TagInterface } from "../../interfaces/Tag";
+import styles from "./TagCloud.module.css";
 
 interface Props {
   tags: TagInterface[];
   showLabel?: boolean;
-};
+}
 
 export const TagCloud = (props: Props) =>
-  props.tags && props.tags.length
-    ? <div className={styles.grow}>
+  props.tags && props.tags.length ? (
+    <div className={styles.grow}>
       {props.showLabel && <h3>{`Tag${props.tags.length > 1 ? "s" : ""}:`}</h3>}
-      {props.tags.map((t: TagInterface, i: number) =>
-        <Tag key={i} title={t.description}>{t.name}</Tag>)}
+      {props.tags.map((t: TagInterface, i: number) => (
+        <Tag key={i} title={t.description}>
+          {t.name}
+        </Tag>
+      ))}
     </div>
-    : null;
\ No newline at end of file
+  ) : null;
diff --git a/src/FilterLists.Web/src/components/tagCloud/index.ts b/src/FilterLists.Web/src/components/tagCloud/index.ts
index eeb9fca3f..6cea6c0e9 100644
--- a/src/FilterLists.Web/src/components/tagCloud/index.ts
+++ b/src/FilterLists.Web/src/components/tagCloud/index.ts
@@ -1,3 +1,3 @@
-import { TagCloud } from './TagCloud';
+import { TagCloud } from "./TagCloud";
 
-export { TagCloud };
\ No newline at end of file
+export { TagCloud };
diff --git a/src/FilterLists.Web/src/constants.ts b/src/FilterLists.Web/src/constants.ts
index 16a9843a4..b8ecfa656 100644
--- a/src/FilterLists.Web/src/constants.ts
+++ b/src/FilterLists.Web/src/constants.ts
@@ -1 +1 @@
-export const SlugifyOptions = { remove: /[^a-zA-Z0-9- ]/g, lower: true }
\ No newline at end of file
+export const SlugifyOptions = { remove: /[^a-zA-Z0-9- ]/g, lower: true };
diff --git a/src/FilterLists.Web/src/hooks/index.ts b/src/FilterLists.Web/src/hooks/index.ts
index 80f36753c..7cf7cd825 100644
--- a/src/FilterLists.Web/src/hooks/index.ts
+++ b/src/FilterLists.Web/src/hooks/index.ts
@@ -1,12 +1,12 @@
-import { useLanguages } from './useLanguages';
-import { useLicenses } from './useLicenses';
-import { useLists } from './useLists';
-import { useMaintainers } from './useMaintainers';
-import { useSearchColumnFilter } from './useSearchColumnFilter';
-import { useSoftware } from './useSoftware';
-import { useSyntaxes } from './useSyntaxes';
-import { useTablePageSizer } from './useTablePageSizer';
-import { useTags } from './useTags';
+import { useLanguages } from "./useLanguages";
+import { useLicenses } from "./useLicenses";
+import { useLists } from "./useLists";
+import { useMaintainers } from "./useMaintainers";
+import { useSearchColumnFilter } from "./useSearchColumnFilter";
+import { useSoftware } from "./useSoftware";
+import { useSyntaxes } from "./useSyntaxes";
+import { useTablePageSizer } from "./useTablePageSizer";
+import { useTags } from "./useTags";
 
 export {
   useLanguages,
@@ -18,4 +18,4 @@ export {
   useSyntaxes,
   useTablePageSizer,
   useTags
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/hooks/useApiData.tsx b/src/FilterLists.Web/src/hooks/useApiData.tsx
index 8ff9eb54b..63de2fac1 100644
--- a/src/FilterLists.Web/src/hooks/useApiData.tsx
+++ b/src/FilterLists.Web/src/hooks/useApiData.tsx
@@ -1,10 +1,11 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState } from "react";
 
 export const useApiData = <T extends {}>(url: string) => {
   const [data, setData] = useState<T>();
   useEffect(() => {
-    const fetchData = async () => (await fetch(url)).json().then(r => setData(r));
+    const fetchData = async () =>
+      (await fetch(url)).json().then(r => setData(r));
     fetchData();
   }, [url]);
   return data;
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/hooks/useLanguages.tsx b/src/FilterLists.Web/src/hooks/useLanguages.tsx
index bd8a00105..f24b042f6 100644
--- a/src/FilterLists.Web/src/hooks/useLanguages.tsx
+++ b/src/FilterLists.Web/src/hooks/useLanguages.tsx
@@ -1,5 +1,7 @@
-import { Language } from '../interfaces/Language';
-import { useApiData } from './useApiData';
+import { Language } from "../interfaces/Language";
+import { useApiData } from "./useApiData";
 
-export const useLanguages = () => (useApiData<Language[]>("/api/v1/languages") || [])
-  .sort((a: Language, b: Language) => a.name.localeCompare(b.name));
\ No newline at end of file
+export const useLanguages = () =>
+  (useApiData<Language[]>("/api/v1/languages") || []).sort(
+    (a: Language, b: Language) => a.name.localeCompare(b.name)
+  );
diff --git a/src/FilterLists.Web/src/hooks/useLicenses.tsx b/src/FilterLists.Web/src/hooks/useLicenses.tsx
index aeb6c5845..94ae7c968 100644
--- a/src/FilterLists.Web/src/hooks/useLicenses.tsx
+++ b/src/FilterLists.Web/src/hooks/useLicenses.tsx
@@ -1,5 +1,7 @@
-import { License } from '../interfaces/License';
-import { useApiData } from './useApiData';
+import { License } from "../interfaces/License";
+import { useApiData } from "./useApiData";
 
-export const useLicenses = () => (useApiData<License[]>("/api/v1/licenses") || [])
-  .sort((a: License, b: License) => a.name.localeCompare(b.name));
\ No newline at end of file
+export const useLicenses = () =>
+  (useApiData<License[]>("/api/v1/licenses") || []).sort(
+    (a: License, b: License) => a.name.localeCompare(b.name)
+  );
diff --git a/src/FilterLists.Web/src/hooks/useLists.tsx b/src/FilterLists.Web/src/hooks/useLists.tsx
index ffdadc769..265ede5d9 100644
--- a/src/FilterLists.Web/src/hooks/useLists.tsx
+++ b/src/FilterLists.Web/src/hooks/useLists.tsx
@@ -1,12 +1,11 @@
-import slugify from 'slugify';
+import slugify from "slugify";
 
-import { SlugifyOptions } from '../constants';
-import { List } from '../interfaces/List';
-import { useApiData } from './useApiData';
+import { SlugifyOptions } from "../constants";
+import { List } from "../interfaces/List";
+import { useApiData } from "./useApiData";
 
 export const useLists = () => {
   const lists = useApiData<List[]>("/api/v1/lists");
-  lists && lists.forEach(l => l.slug = slugify(l.name, SlugifyOptions));
-  return (lists || [])
-    .sort((a: List, b: List) => a.name.localeCompare(b.name));
-};
\ No newline at end of file
+  lists && lists.forEach(l => (l.slug = slugify(l.name, SlugifyOptions)));
+  return (lists || []).sort((a: List, b: List) => a.name.localeCompare(b.name));
+};
diff --git a/src/FilterLists.Web/src/hooks/useMaintainers.tsx b/src/FilterLists.Web/src/hooks/useMaintainers.tsx
index 69bcb8dfe..4acd1c445 100644
--- a/src/FilterLists.Web/src/hooks/useMaintainers.tsx
+++ b/src/FilterLists.Web/src/hooks/useMaintainers.tsx
@@ -1,5 +1,7 @@
-import { Maintainer } from '../interfaces/Maintainer';
-import { useApiData } from './useApiData';
+import { Maintainer } from "../interfaces/Maintainer";
+import { useApiData } from "./useApiData";
 
-export const useMaintainers = () => (useApiData<Maintainer[]>("/api/v1/maintainers") || [])
-  .sort((a: Maintainer, b: Maintainer) => a.name.localeCompare(b.name));
\ No newline at end of file
+export const useMaintainers = () =>
+  (useApiData<Maintainer[]>("/api/v1/maintainers") || []).sort(
+    (a: Maintainer, b: Maintainer) => a.name.localeCompare(b.name)
+  );
diff --git a/src/FilterLists.Web/src/hooks/useSearchColumnFilter.tsx b/src/FilterLists.Web/src/hooks/useSearchColumnFilter.tsx
index 1b435def0..b103d553d 100644
--- a/src/FilterLists.Web/src/hooks/useSearchColumnFilter.tsx
+++ b/src/FilterLists.Web/src/hooks/useSearchColumnFilter.tsx
@@ -1,9 +1,11 @@
-import { Button, Icon, Input } from 'antd';
-import { FilterDropdownProps } from 'antd/lib/table';
-import React, { useEffect, useState } from 'react';
+import { Button, Icon, Input } from "antd";
+import { FilterDropdownProps } from "antd/lib/table";
+import React, { useEffect, useState } from "react";
 
 interface FilterPropsState<T> {
-  filterDropdown?: React.ReactNode | ((props: FilterDropdownProps) => React.ReactNode);
+  filterDropdown?:
+    | React.ReactNode
+    | ((props: FilterDropdownProps) => React.ReactNode);
   filterIcon?: React.ReactNode | ((filtered: boolean) => React.ReactNode);
   onFilter?: (value: any, record: T) => boolean;
 }
@@ -22,36 +24,59 @@ export const useSearchColumnFilter = <T extends {}>(dataIndex: string) => {
       clearFilters && clearFilters([]);
     };
     setFilterProps({
-      filterDropdown: ({ setSelectedKeys, selectedKeys, confirm, clearFilters }) => (
+      filterDropdown: ({
+        setSelectedKeys,
+        selectedKeys,
+        confirm,
+        clearFilters
+      }) => (
         <div style={{ padding: 8 }}>
           <Input
-            placeholder={`Search ${dataIndex.charAt(0).toUpperCase() + dataIndex.slice(1)}`}
+            placeholder={`Search ${dataIndex.charAt(0).toUpperCase() +
+              dataIndex.slice(1)}`}
             value={selectedKeys && selectedKeys[0]}
-            onChange={e => setSelectedKeys && setSelectedKeys(e.target.value ? [e.target.value] : [])}
+            onChange={e =>
+              setSelectedKeys &&
+              setSelectedKeys(e.target.value ? [e.target.value] : [])
+            }
             onPressEnter={() => handleSearch(confirm)}
-            style={{ width: 188, marginBottom: 8, display: 'block' }} />
+            style={{ width: 188, marginBottom: 8, display: "block" }}
+          />
           <Button
             type="primary"
             onClick={() => handleSearch(confirm)}
             icon="search"
             size="small"
-            style={{ width: 90, marginRight: 8 }} >
+            style={{ width: 90, marginRight: 8 }}
+          >
             Search
-                    </Button>
+          </Button>
           <Button
             onClick={() => handleReset(clearFilters)}
             size="small"
-            style={{ width: 90 }} >
+            style={{ width: 90 }}
+          >
             Reset
-                    </Button>
+          </Button>
         </div>
       ),
-      filterIcon: filtered => <Icon type="search" style={{ color: filtered ? '#1890ff' : undefined }} />,
+      filterIcon: filtered => (
+        <Icon
+          type="search"
+          style={{ color: filtered ? "#1890ff" : undefined }}
+        />
+      ),
       onFilter: (value, record) => {
         const searchValue = (record as any)[dataIndex];
-        return searchValue && searchValue.toString().toLowerCase().includes(value.toString().toLowerCase())
+        return (
+          searchValue &&
+          searchValue
+            .toString()
+            .toLowerCase()
+            .includes(value.toString().toLowerCase())
+        );
       }
-    })
+    });
   }, [dataIndex]);
   return filterProps;
-};
\ No newline at end of file
+};
diff --git a/src/FilterLists.Web/src/hooks/useSoftware.tsx b/src/FilterLists.Web/src/hooks/useSoftware.tsx
index 452871f19..4f20e12bf 100644
--- a/src/FilterLists.Web/src/hooks/useSoftware.tsx
+++ b/src/FilterLists.Web/src/hooks/useSoftware.tsx
@@ -1,5 +1,7 @@
-import { Software } from '../interfaces/Software';
-import { useApiData } from './useApiData';
+import { Software } from "../interfaces/Software";
+import { useApiData } from "./useApiData";
 
-export const useSoftware = () => (useApiData<Software[]>("/api/v1/software") || [])
-  .sort((a: Software, b: Software) => a.name.localeCompare(b.name));
\ No newline at end of file
+export const useSoftware = () =>
+  (useApiData<Software[]>("/api/v1/software") || []).sort(
+    (a: Software, b: Software) => a.name.localeCompare(b.name)
+  );
diff --git a/src/FilterLists.Web/src/hooks/useSyntaxes.tsx b/src/FilterLists.Web/src/hooks/useSyntaxes.tsx
index e3cd1b3ce..a3ae4a2db 100644
--- a/src/FilterLists.Web/src/hooks/useSyntaxes.tsx
+++ b/src/FilterLists.Web/src/hooks/useSyntaxes.tsx
@@ -1,5 +1,7 @@
-import { Syntax } from '../interfaces/Syntax';
-import { useApiData } from './useApiData';
+import { Syntax } from "../interfaces/Syntax";
+import { useApiData } from "./useApiData";
 
-export const useSyntaxes = () => (useApiData<Syntax[]>("/api/v1/syntaxes") || [])
-  .sort((a: Syntax, b: Syntax) => a.name.localeCompare(b.name));
\ No newline at end of file
+export const useSyntaxes = () =>
+  (useApiData<Syntax[]>("/api/v1/syntaxes") || []).sort(
+    (a: Syntax, b: Syntax) => a.name.localeCompare(b.name)
+  );
diff --git a/src/FilterLists.Web/src/hooks/useTablePageSizer.tsx b/src/FilterLists.Web/src/hooks/useTablePageSizer.tsx
index bd225a280..38e4f2b5b 100644
--- a/src/FilterLists.Web/src/hooks/useTablePageSizer.tsx
+++ b/src/FilterLists.Web/src/hooks/useTablePageSizer.tsx
@@ -1,16 +1,16 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState } from "react";
 
 interface TablePageSize {
   pageSize: number;
   isNarrowWindow: boolean;
-};
+}
 
 export const useTablePageSizer = () => {
   const [state, setState] = useState<TablePageSize>(calculateSize());
   useEffect(() => {
     const updatePageSize = () => setState(calculateSize());
-    window.addEventListener('resize', updatePageSize);
-    return () => window.removeEventListener('resize', updatePageSize);
+    window.addEventListener("resize", updatePageSize);
+    return () => window.removeEventListener("resize", updatePageSize);
   }, []);
   return state;
 };
@@ -18,4 +18,4 @@ export const useTablePageSizer = () => {
 const calculateSize = () => ({
   pageSize: Math.floor((window.innerHeight - 184) / 57),
   isNarrowWindow: window.innerWidth < 576 ? true : false
-});
\ No newline at end of file
+});
diff --git a/src/FilterLists.Web/src/hooks/useTags.tsx b/src/FilterLists.Web/src/hooks/useTags.tsx
index 7f5de56e5..6faf3cb9d 100644
--- a/src/FilterLists.Web/src/hooks/useTags.tsx
+++ b/src/FilterLists.Web/src/hooks/useTags.tsx
@@ -1,5 +1,7 @@
-import { Tag } from '../interfaces/Tag';
-import { useApiData } from './useApiData';
+import { Tag } from "../interfaces/Tag";
+import { useApiData } from "./useApiData";
 
-export const useTags = () => (useApiData<Tag[]>("/api/v1/tags") || [])
-  .sort((a: Tag, b: Tag) => a.name.localeCompare(b.name));
\ No newline at end of file
+export const useTags = () =>
+  (useApiData<Tag[]>("/api/v1/tags") || []).sort((a: Tag, b: Tag) =>
+    a.name.localeCompare(b.name)
+  );
diff --git a/src/FilterLists.Web/src/index.tsx b/src/FilterLists.Web/src/index.tsx
index 8fec59ed5..f0dbcb5c2 100644
--- a/src/FilterLists.Web/src/index.tsx
+++ b/src/FilterLists.Web/src/index.tsx
@@ -1,8 +1,8 @@
-import './index.css';
+import "./index.css";
 
-import React from 'react';
-import ReactDOM from 'react-dom';
+import React from "react";
+import ReactDOM from "react-dom";
 
-import { App } from './App';
+import { App } from "./App";
 
-ReactDOM.render(<App />, document.getElementById('root'));
\ No newline at end of file
+ReactDOM.render(<App />, document.getElementById("root"));
diff --git a/src/FilterLists.Web/src/interfaces/Language.ts b/src/FilterLists.Web/src/interfaces/Language.ts
index 8adf69639..af4d69de7 100644
--- a/src/FilterLists.Web/src/interfaces/Language.ts
+++ b/src/FilterLists.Web/src/interfaces/Language.ts
@@ -3,4 +3,4 @@ export interface Language {
   filterListIds: number[];
   iso6391: string;
   name: string;
-};
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/interfaces/License.ts b/src/FilterLists.Web/src/interfaces/License.ts
index 765fd1c51..841df2905 100644
--- a/src/FilterLists.Web/src/interfaces/License.ts
+++ b/src/FilterLists.Web/src/interfaces/License.ts
@@ -3,4 +3,4 @@ export interface License {
   descriptionUrl: string;
   filterListIds: number[];
   name: string;
-};
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/interfaces/List.ts b/src/FilterLists.Web/src/interfaces/List.ts
index 09ae2972e..901184ab1 100644
--- a/src/FilterLists.Web/src/interfaces/List.ts
+++ b/src/FilterLists.Web/src/interfaces/List.ts
@@ -22,4 +22,4 @@
 
   // auto-generated by useLists hook
   slug: string;
-};
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/interfaces/Maintainer.ts b/src/FilterLists.Web/src/interfaces/Maintainer.ts
index 794b934a9..aa3746832 100644
--- a/src/FilterLists.Web/src/interfaces/Maintainer.ts
+++ b/src/FilterLists.Web/src/interfaces/Maintainer.ts
@@ -5,4 +5,4 @@ export interface Maintainer {
   homeUrl: string;
   name: string;
   twitterHandle: string;
-};
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/interfaces/Software.ts b/src/FilterLists.Web/src/interfaces/Software.ts
index e4582b01d..dd8d151ac 100644
--- a/src/FilterLists.Web/src/interfaces/Software.ts
+++ b/src/FilterLists.Web/src/interfaces/Software.ts
@@ -4,4 +4,4 @@ export interface Software {
   isAbpSubscribable: boolean;
   name: string;
   syntaxIds: number[];
-};
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/interfaces/Syntax.ts b/src/FilterLists.Web/src/interfaces/Syntax.ts
index 35b69000c..0873306d9 100644
--- a/src/FilterLists.Web/src/interfaces/Syntax.ts
+++ b/src/FilterLists.Web/src/interfaces/Syntax.ts
@@ -4,4 +4,4 @@ export interface Syntax {
   filterListIds: number[];
   name: string;
   softwareIds: number[];
-};
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/interfaces/Tag.ts b/src/FilterLists.Web/src/interfaces/Tag.ts
index 755e683f7..4141dd434 100644
--- a/src/FilterLists.Web/src/interfaces/Tag.ts
+++ b/src/FilterLists.Web/src/interfaces/Tag.ts
@@ -3,4 +3,4 @@ export interface Tag {
   description: string;
   filterListIds: number[];
   name: string;
-};
\ No newline at end of file
+}
diff --git a/src/FilterLists.Web/src/react-app-env.d.ts b/src/FilterLists.Web/src/react-app-env.d.ts
index 6889c6b37..6431bc5fc 100644
--- a/src/FilterLists.Web/src/react-app-env.d.ts
+++ b/src/FilterLists.Web/src/react-app-env.d.ts
@@ -1 +1 @@
-/// <reference types="react-scripts" />
\ No newline at end of file
+/// <reference types="react-scripts" />
diff --git a/src/FilterLists.Web/src/utils/index.ts b/src/FilterLists.Web/src/utils/index.ts
index d22b49973..844235139 100644
--- a/src/FilterLists.Web/src/utils/index.ts
+++ b/src/FilterLists.Web/src/utils/index.ts
@@ -1,3 +1,3 @@
-import { nameof } from './nameof';
+import { nameof } from "./nameof";
 
-export { nameof };
\ No newline at end of file
+export { nameof };
diff --git a/src/FilterLists.Web/src/utils/nameof.ts b/src/FilterLists.Web/src/utils/nameof.ts
index 5a09f50fa..282dd0ab2 100644
--- a/src/FilterLists.Web/src/utils/nameof.ts
+++ b/src/FilterLists.Web/src/utils/nameof.ts
@@ -1,2 +1,2 @@
 //https://stackoverflow.com/a/50470026/2343739
-export const nameof = <T>(name: Extract<keyof T, string>) => name;
\ No newline at end of file
+export const nameof = <T>(name: Extract<keyof T, string>) => name;