dear lord typescript gets messy fast

.eslintrc.json

@@ -1,7 +1,11 @@
 {
   "extends": [
     "plugin:compat/recommended",
-    "plugin:prettier/recommended"
+    "plugin:prettier/recommended",
+    "prettier"
+  ],
+  "plugins": [
+    "prettier"
   ],
   "parserOptions": {
     "parser": "@babel/eslint-parser",
@@ -21,10 +25,13 @@
       "api/**/*.ts"
     ],
     "extends": [
-      "plugin:@typescript-eslint/recommended"
+      "plugin:@typescript-eslint/recommended",
+      "plugin:prettier/recommended",
+      "prettier"
     ],
     "plugins": [
-      "@typescript-eslint"
+      "@typescript-eslint",
+      "prettier"
     ],
     "parser": "@typescript-eslint/parser",
     "parserOptions": {
@@ -32,7 +39,9 @@
       "sourceType": "module"
     },
     "env": {
-      "browser": false
+      "browser": false,
+      "node": true,
+      "es6": true
     },
     "rules": {
       "compat/compat": "off"

api/hits.ts

@@ -4,11 +4,8 @@ import { VercelRequest, VercelResponse } from "@vercel/node";
 import { Client, query as q } from "faunadb";
 import numeral from "numeral";
 import pluralize from "pluralize";
-import dotenv from "dotenv";
 
-dotenv.config();
-
-module.exports = async (req: VercelRequest, res: VercelResponse) => {
+export default async (req: VercelRequest, res: VercelResponse): Promise<VercelResponse> => {
   const { slug } = req.query;
 
   try {
@@ -27,22 +24,32 @@ module.exports = async (req: VercelRequest, res: VercelResponse) => {
       secret: process.env.FAUNADB_SERVER_SECRET,
     });
 
+    type PageHits = {
+      slug: string;
+      hits: number;
+      pretty_hits?: string;
+      pretty_unit?: string;
+    };
+
     // refer to snippet below for the `hit` function defined in the Fauna cloud
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const result = await client.query<any>(q.Call(q.Function("hit"), slug));
 
-    // send client the new hit count
+    const hits: PageHits = {
+      ...result.data,
+      pretty_hits: numeral(result.data.hits).format("0,0"),
+      pretty_unit: pluralize("hit", result.data.hits),
+    };
+
+    // disable caching on both ends
     res.setHeader("Cache-Control", "private, no-cache, no-store, must-revalidate");
     res.setHeader("Expires", 0);
     res.setHeader("Pragma", "no-cache");
     res.setHeader("Access-Control-Allow-Methods", "GET");
     res.setHeader("Access-Control-Allow-Origin", "*");
-    return res.json({
-      slug: result.data.slug,
-      hits: result.data.hits,
-      pretty_hits: numeral(result.data.hits).format("0,0"),
-      pretty_unit: pluralize("hit", result.data.hits),
-    });
+
+    // send client the *new* hit count
+    return res.json(hits);
   } catch (error) {
     console.error(error);
 

api/projects.ts

@@ -1,13 +1,11 @@
 "use strict";
 
 import { VercelRequest, VercelResponse } from "@vercel/node";
-import { GraphQLClient, gql } from "graphql-request";
 import { escape } from "html-escaper";
-import numeral from "numeral";
 import { DateTime } from "luxon";
-import dotenv from "dotenv";
-
-dotenv.config();
+import numeral from "numeral";
+import { GraphQLClient } from "graphql-request";
+import gql from "graphql-tag";
 
 const username = "jakejarvis";
 const endpoint = "https://api.github.com/graphql";
@@ -55,20 +53,34 @@ async function fetchRepos(sort: string, limit: number) {
     }
   `;
 
-  const response = await client.request(query, { sort, limit });
+  type Repository = {
+    name: string;
+    url: string;
+    description: string;
+    pushedAt: string;
+    pushedAt_relative?: string;
+    stargazerCount: number;
+    stargazerCount_pretty?: string;
+    forkCount: number;
+    forkCount_pretty?: string;
+    primaryLanguage?: unknown;
+  };
 
-  const currentRepos = response.user.repositories.edges.map(({ node: repo }) => ({
-    ...repo,
-    description: escape(repo.description),
-    stargazerCount_pretty: numeral(repo.stargazerCount).format("0,0"),
-    forkCount_pretty: numeral(repo.forkCount).format("0,0"),
-    pushedAt_relative: DateTime.fromISO(repo.pushedAt).toRelative({ locale: "en" }),
-  }));
+  const response = await client.request(query, { sort, limit });
+  const currentRepos: Array<Repository> = response.user.repositories.edges.map(
+    ({ node: repo }: { [key: string]: Repository }) => ({
+      ...repo,
+      description: escape(repo.description),
+      stargazerCount_pretty: numeral(repo.stargazerCount).format("0,0"),
+      forkCount_pretty: numeral(repo.forkCount).format("0,0"),
+      pushedAt_relative: DateTime.fromISO(repo.pushedAt).toRelative({ locale: "en" }),
+    })
+  );
 
   return currentRepos;
 }
 
-module.exports = async (req: VercelRequest, res: VercelResponse) => {
+export default async (req: VercelRequest, res: VercelResponse): Promise<VercelResponse> => {
   try {
     // some rudimentary error handling
     if (req.method !== "GET") {
@@ -89,6 +101,7 @@ module.exports = async (req: VercelRequest, res: VercelResponse) => {
     res.setHeader("Cache-Control", "s-maxage=900, stale-while-revalidate");
     res.setHeader("Access-Control-Allow-Methods", "GET");
     res.setHeader("Access-Control-Allow-Origin", "*");
+
     return res.json(repos);
   } catch (error) {
     console.error(error);

api/stats.ts

@@ -5,13 +5,10 @@ import { Client, query as q } from "faunadb";
 import numeral from "numeral";
 import pluralize from "pluralize";
 import rssParser from "rss-parser";
-import dotenv from "dotenv";
-
-dotenv.config();
 
 const baseUrl = "https://jarv.is/";
 
-module.exports = async (req: VercelRequest, res: VercelResponse) => {
+export default async (req: VercelRequest, res: VercelResponse): Promise<VercelResponse> => {
   try {
     // some rudimentary error handling
     if (!process.env.FAUNADB_SERVER_SECRET) {
@@ -40,45 +37,50 @@ module.exports = async (req: VercelRequest, res: VercelResponse) => {
       ),
     ]);
 
-    // TODO: make typescript interface/type
-    const stats = {
-      total: {
-        hits: 0,
-        pretty_hits: "",
-        pretty_unit: "",
-      },
-      pages: result.data,
+    type SiteStats = {
+      hits: number;
+      pretty_hits?: string;
+      pretty_unit?: string;
+    };
+    type PageStats = {
+      title: string;
+      url: string;
+      date: string;
+      slug?: string;
+      hits: number;
+      pretty_hits: string;
+      pretty_unit: string;
+    };
+    type OverallStats = {
+      total: SiteStats;
+      pages: Array<PageStats>;
     };
 
-    stats.pages.map(
-      (p: {
-        title: string;
-        url: string;
-        date: string;
-        slug?: string;
-        hits: number;
-        pretty_hits: string;
-        pretty_unit: string;
-      }) => {
-        // match URLs from RSS feed with db to populate some metadata
-        const match = feed.items.find((x: { link: string }) => x.link === baseUrl + p.slug + "/");
-        if (match) {
-          p.title = match.title;
-          p.url = match.link;
-          p.date = match.isoDate;
-          delete p.slug;
-        }
+    const pages: Array<PageStats> = result.data;
+    const stats: OverallStats = {
+      total: { hits: 0 },
+      pages,
+    };
 
-        // it's easier to add comma-separated numbers and proper pluralization here on the backend
-        p.pretty_hits = numeral(p.hits).format("0,0");
-        p.pretty_unit = pluralize("hit", p.hits);
-
-        // add these hits to running tally
-        stats.total.hits += p.hits;
-
-        return p;
+    pages.map((p: PageStats) => {
+      // match URLs from RSS feed with db to populate some metadata
+      const match = feed.items.find((x: { link: string }) => x.link === baseUrl + p.slug + "/");
+      if (match) {
+        p.title = match.title;
+        p.url = match.link;
+        p.date = match.isoDate;
+        delete p.slug;
       }
-    );
+
+      // it's easier to add comma-separated numbers and proper pluralization here on the backend
+      p.pretty_hits = numeral(p.hits).format("0,0");
+      p.pretty_unit = pluralize("hit", p.hits);
+
+      // add these hits to running tally
+      stats.total.hits += p.hits;
+
+      return p;
+    });
 
     // sort by hits (descending)
     stats.pages.sort((a: { hits: number }, b: { hits: number }) => {
@@ -93,6 +95,7 @@ module.exports = async (req: VercelRequest, res: VercelResponse) => {
     res.setHeader("Cache-Control", "s-maxage=900, stale-while-revalidate");
     res.setHeader("Access-Control-Allow-Methods", "GET");
     res.setHeader("Access-Control-Allow-Origin", "*");
+
     return res.json(stats);
   } catch (error) {
     console.error(error);

package.json

@@ -22,8 +22,8 @@
     "minify:img": "glob-exec --parallel --foreach 'public/**/{img,images}/' -- imagemin '{{file.path}}*' --plugin=mozjpeg --plugin.mozjpeg.progressive --plugin.mozjpeg.quality=85 --plugin=pngquant --plugin.pngquant.quality={0.1,0.3} --plugin.pngquant.speed=1 --plugin.pngquant.strip --plugin=gifsicle --plugin=svgo --out-dir='{{file.path}}'",
     "lint": "run-s lint:**",
     "lint:scss": "stylelint 'assets/sass/**/*.scss' --syntax scss",
-    "lint:js": "eslint --ext .js,.ts '**/*.{js,ts}'",
-    "lint:ts": "tsc --noEmit --esModuleInterop **/*.ts",
+    "lint:js": "eslint --ext .js,.ts .",
+    "lint:ts": "tsc --noEmit --esModuleInterop",
     "lint:md": "markdownlint 'content/**/*.md'",
     "lint:prettier": "prettier --check .",
     "docker": "docker run --rm -v $(pwd):/src:ro -p 1337:1337 $(docker build -q .)",
@@ -37,6 +37,7 @@
     "faunadb": "fauna/faunadb-js#master",
     "graphql": "^15.5.0",
     "graphql-request": "^3.4.0",
+    "graphql-tag": "^2.12.4",
     "html-escaper": "^3.0.3",
     "luxon": "^1.27.0",
     "modern-normalize": "1.1.0",

tsconfig.json

@@ -6,7 +6,7 @@
     ],
     "module": "commonjs",
     "moduleResolution": "node",
-    "strict": false,
+    "strict": true,
     "allowJs": true,
     "noEmit": true,
     "esModuleInterop": true

yarn.lock

@@ -3656,6 +3656,13 @@ graphql-request@^3.4.0:
     extract-files "^9.0.0"
     form-data "^3.0.0"
 
+graphql-tag@^2.12.4:
+  version "2.12.4"
+  resolved "https://registry.yarnpkg.com/graphql-tag/-/graphql-tag-2.12.4.tgz#d34066688a4f09e72d6f4663c74211e9b4b7c4bf"
+  integrity sha512-VV1U4O+9x99EkNpNmCUV5RZwq6MnK4+pGbRYWG+lA/m3uo7TSqJF81OkcOP148gFP6fzdl7JWYBrwWVTS9jXww==
+  dependencies:
+    tslib "^2.1.0"
+
 graphql@^15.5.0:
   version "15.5.0"
   resolved "https://registry.yarnpkg.com/graphql/-/graphql-15.5.0.tgz#39d19494dbe69d1ea719915b578bf920344a69d5"
@@ -3806,7 +3813,7 @@ hugo-extended@jakejarvis/hugo-extended#9f615221831632cb3b8879ab3fc420fff921e1fd:
   dependencies:
     chalk "^4.1.1"
     decompress "^4.2.1"
-    execa "^5.0.1"
+    execa "^5.1.1"
     follow-redirects "^1.14.1"
     sumchecker "^3.0.1"
 
@@ -7189,6 +7196,11 @@ tslib@^1.8.1, tslib@^1.9.0:
   resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
+tslib@^2.1.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.2.0.tgz#fb2c475977e35e241311ede2693cee1ec6698f5c"
+  integrity sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==
+
 tsutils@^3.21.0:
   version "3.21.0"
   resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.21.0.tgz#b48717d394cea6c1e096983eed58e9d61715b623"