Add linting and pre-commit

See: https://codeberg.org/kytta/toot/pulls/17
2023-03-01 12:46:12 +01:00 · 2023-03-01 12:46:12 +01:00 · 725f9353cf
parent 2b842ca027 4df79c322b
commit 725f9353cf
14 changed files with 986 additions and 71 deletions
--- a/.browserslistrc
+++ b/.browserslistrc
@ -1 +1 @@
-cover 95%
+cover 95%
--- a/.eslintignore
+++ b/.eslintignore
@ -0,0 +1,2 @@
+/dist/
+/public/
--- a/.eslintrc.json
+++ b/.eslintrc.json
@ -0,0 +1,23 @@
+{
+	"env": {
+		"browser": true
+	},
+	"extends": ["eslint:recommended", "plugin:unicorn/recommended", "prettier"],
+	"parserOptions": {
+		"ecmaVersion": "latest",
+		"sourceType": "module"
+	},
+	"overrides": [
+		{
+			"files": ["gulpfile.js", "api/*.js"],
+			"env": {
+				"node": true,
+				"browser": false
+			},
+			"rules": {
+				"unicorn/prefer-module": 0,
+				"unicorn/prefer-node-protocol": 0
+			}
+		}
+	]
+}
--- a/.node-version
+++ b/.node-version
@ -1 +0,0 @@
-14
--- a/.pre-commit-config.yaml
+++ b/.pre-commit-config.yaml
@ -0,0 +1,27 @@
+repos:
+  - repo: https://github.com/pre-commit/pre-commit-hooks
+    rev: v4.4.0
+    hooks:
+      - id: end-of-file-fixer
+      - id: fix-byte-order-marker
+      - id: mixed-line-ending
+      - id: trailing-whitespace
+        args: [--markdown-linebreak-ext=md]
+      - id: check-json
+      - id: check-toml
+      - id: check-yaml
+  - repo: https://github.com/pre-commit/mirrors-prettier
+    rev: "v2.7.1"
+    hooks:
+      - id: prettier
+        additional_dependencies:
+          - prettier@2
+  - repo: https://github.com/pre-commit/mirrors-eslint
+    rev: "v8.35.0"
+    hooks:
+      - id: eslint
+        additional_dependencies:
+          - eslint
+          - eslint-config-prettier
+          - eslint-plugin-unicorn
+          - prettier
--- a/.prettierignore
+++ b/.prettierignore
@ -1,3 +1,5 @@
 *.md
-/public
-/.vercel
+/dist/
+/public/
+/.vercel/
+pnpm-lock.yaml
--- a/.prettierrc.json
+++ b/.prettierrc.json
@ -1 +1,4 @@
-{}
+{
+	"quoteProps": "consistent",
+	"trailingComma": "es5"
+}
--- a/api/toot.js
+++ b/api/toot.js
@ -19,20 +19,21 @@
 const http = require("http");

 http
-	.createServer(async (req, res) => {
+	.createServer(async (request, response) => {
 		const buffers = [];
-		for await (const chunk of req) {
+		for await (const chunk of request) {
 			buffers.push(chunk);
 		}
 		const data = Buffer.concat(buffers).toString();
-		const params = new URLSearchParams(data);
+		const searchParameters = new URLSearchParams(data);

-		const text = params.get("text") || "";
-		const instanceURL = params.get("instance") || "https://mastodon.social/";
+		const text = searchParameters.get("text") || "";
+		const instanceURL =
+			searchParameters.get("instance") || "https://mastodon.social/";

 		const finalURL = new URL("share", instanceURL);
 		finalURL.search = new URLSearchParams({ text }).toString();

-		res.writeHead(303, { Location: finalURL.toString() }).end();
+		response.writeHead(303, { Location: finalURL.toString() }).end();
 	})
 	.listen(8000);
--- a/gulpfile.js
+++ b/gulpfile.js
@ -1,20 +1,22 @@
-const { join, resolve } = require("path");
+const path = require("path");
 const gulp = require("gulp");
 const postcss = require("gulp-postcss");
 const sass = require("gulp-sass")(require("sass"));
 const sourcemaps = require("gulp-sourcemaps");
 const terser = require("gulp-terser");

-const SOURCE_DIR = resolve(__dirname, "src");
-const OUTPUT_DIR = resolve(__dirname, "public");
+const SOURCE_DIR = path.resolve(__dirname, "src");
+const OUTPUT_DIR = path.resolve(__dirname, "public");

 function html() {
-	return gulp.src(join(SOURCE_DIR, "index.html")).pipe(gulp.dest(OUTPUT_DIR));
+	return gulp
+		.src(path.join(SOURCE_DIR, "index.html"))
+		.pipe(gulp.dest(OUTPUT_DIR));
 }

 function css() {
 	return gulp
-		.src(join(SOURCE_DIR, "scss", "*.scss"))
+		.src(path.join(SOURCE_DIR, "scss", "*.scss"))
 		.pipe(sourcemaps.init())
 		.pipe(sass.sync().on("error", sass.logError))
 		.pipe(postcss([require("autoprefixer"), require("postcss-csso")]))
@ -24,24 +26,24 @@ function css() {

 function js() {
 	return gulp
-		.src([join(SOURCE_DIR, "main.js"), join(SOURCE_DIR, "count.js")])
+		.src([path.join(SOURCE_DIR, "main.js"), path.join(SOURCE_DIR, "count.js")])
 		.pipe(sourcemaps.init())
 		.pipe(terser({ ecma: 5 }))
 		.pipe(sourcemaps.write("."))
 		.pipe(gulp.dest(OUTPUT_DIR));
 }

-function static() {
+function staticFiles() {
 	return gulp
-		.src(join(SOURCE_DIR, "static", "**", "*"))
+		.src(path.join(SOURCE_DIR, "static", "**", "*"))
 		.pipe(gulp.dest(OUTPUT_DIR));
 }

-exports.default = gulp.parallel(html, css, js, static);
+exports.default = gulp.parallel(html, css, js, staticFiles);

 exports.watch = () => {
-	gulp.watch(join(SOURCE_DIR, "index.html"), html);
-	gulp.watch(join(SOURCE_DIR, "scss", "*.scss"), css);
-	gulp.watch(join(SOURCE_DIR, "*.js"), js);
-	gulp.watch(join(SOURCE_DIR, "static", "**", "*"), static);
+	gulp.watch(path.join(SOURCE_DIR, "index.html"), html);
+	gulp.watch(path.join(SOURCE_DIR, "scss", "*.scss"), css);
+	gulp.watch(path.join(SOURCE_DIR, "*.js"), js);
+	gulp.watch(path.join(SOURCE_DIR, "static", "**", "*"), staticFiles);
 };
--- a/package.json
+++ b/package.json
@ -13,11 +13,17 @@
 	"scripts": {
 		"build": "gulp",
 		"dev": "gulp watch",
+		"fmt": "prettier --write .",
+		"lint": "prettier --check . && eslint .",
+		"test": "pnpm run lint",
 		"serve": "sirv ./public --dev"
 	},
 	"devDependencies": {
 		"autoprefixer": "^10.4.2",
 		"browserslist": "^4.19.1",
+		"eslint": "^8.35.0",
+		"eslint-config-prettier": "^8.6.0",
+		"eslint-plugin-unicorn": "^45.0.2",
 		"gulp": "^4.0.2",
 		"gulp-postcss": "^9.0.1",
 		"gulp-sass": "^5.1.0",
@ -25,7 +31,7 @@
 		"gulp-terser": "^2.1.0",
 		"postcss": "^8.4.6",
 		"postcss-csso": "^6.0.0",
-		"prettier": "2.5.1",
+		"prettier": "^2.8.4",
 		"sass": "^1.49.7",
 		"sirv-cli": "^2.0.2"
 	}
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/src/count.js
+++ b/src/count.js
@ -38,25 +38,24 @@ if (
 	window.location.host === "s2f.kytta.dev" ||
 	window.location.host === "share2fedi.kytta.dev"
 ) {
-	fetch("//gc.zgo.at/", { method: "HEAD" })
-		.then((result) => {
-			if (!result.ok) {
-				return;
-			}
+	// eslint-disable-next-line unicorn/prefer-top-level-await
+	fetch("//gc.zgo.at/", { method: "HEAD" }).then((result) => {
+		if (!result.ok) {
+			return;
+		}

-			const screen = encodeURIComponent(
-				[
-					window.screen.width,
-					window.screen.height,
-					window.devicePixelRatio || 1,
-				].join(",")
-			);
+		const screen = encodeURIComponent(
+			[
+				window.screen.width,
+				window.screen.height,
+				window.devicePixelRatio || 1,
+			].join(",")
+		);

-			const random = encodeURIComponent(Math.random().toString(36).slice(2));
+		const random = encodeURIComponent(Math.random().toString(36).slice(2));

-			navigator.sendBeacon(
-				`https://share2fedi.goatcounter.com/count?p=%2F&s=${screen}&b=0&rnd=${random}`
-			);
-		})
-		.catch((_) => {});
+		navigator.sendBeacon(
+			`https://share2fedi.goatcounter.com/count?p=%2F&s=${screen}&b=0&rnd=${random}`
+		);
+	});
 }
--- a/src/main.js
+++ b/src/main.js
@ -30,8 +30,8 @@ const INSTANCE_LIST_URL = "https://api.joinmastodon.org/servers";
 const LOCAL_STORAGE_KEY = "recentInstances";
 const RECENT_INSTANCES_SIZE = 5;

-const $instance = document.getElementById("instance");
-const $instanceDatalist = document.getElementById("instanceDatalist");
+const $instance = document.querySelector("#instance");
+const $instanceDatalist = document.querySelector("#instanceDatalist");

 /**
 * Adds missing "https://" and ending slash to the URL
@ -40,7 +40,7 @@ const $instanceDatalist = document.getElementById("instanceDatalist");
 * @return {string} normalized URL
 */
 function normalizeUrl(url) {
-	if (url.indexOf("http://") == -1 && url.indexOf("https://") == -1) {
+	if (!url.includes("http://") && !url.includes("https://")) {
 		url = "https://" + url;
 	}
 	if (url.charAt(url.length - 1) !== "/") {
@ -59,16 +59,18 @@ function onLoadInstancesSuccess() {
 	}

 	const currentInstance = $instance.value;
-	const instanceDomains = JSON.parse(this.responseText).map((i) => i.domain);
-	if (currentInstance && instanceDomains.indexOf(currentInstance) < 0) {
+	const instanceDomains = JSON.parse(this.responseText).map(
+		(index) => index.domain
+	);
+	if (currentInstance && !instanceDomains.includes(currentInstance)) {
 		instanceDomains.push(currentInstance);
 	}
 	instanceDomains.sort();

-	for (let i = 0; i < instanceDomains.length; i++) {
+	for (const instanceDomain of instanceDomains) {
 		const $option = document.createElement("option");
-		$option.value = normalizeUrl(instanceDomains[i]);
-		$instanceDatalist.appendChild($option);
+		$option.value = normalizeUrl(instanceDomain);
+		$instanceDatalist.append($option);
 	}
 }

@ -106,6 +108,8 @@ function rememberInstance(instance) {
 	);
 }

+// Used in HTML
+// eslint-disable-next-line no-unused-vars
 function onFormSubmit(form) {
 	const formData = new FormData(form);

@ -117,17 +121,19 @@ function onFormSubmit(form) {

 let prefillInstance = getRecentInstances()[0];

-const URLParams = window.location.search.substr(1).split("&");
-for (let i = 0; i < URLParams.length; i++) {
-	const URLParamPair = URLParams[i].split("=");
-	if (URLParamPair[0] === "text") {
-		document.getElementById("text").value = decodeURIComponent(URLParamPair[1]);
-	} else if (URLParamPair[0] === "instance") {
-		prefillInstance = decodeURIComponent(URLParamPair[1]);
+const URLParameters = window.location.search.slice(1).split("&");
+for (const URLParameter of URLParameters) {
+	const URLParameterPair = URLParameter.split("=");
+	if (URLParameterPair[0] === "text") {
+		document.querySelector("#text").value = decodeURIComponent(
+			URLParameterPair[1]
+		);
+	} else if (URLParameterPair[0] === "instance") {
+		prefillInstance = decodeURIComponent(URLParameterPair[1]);
 	}
 }

-if (prefillInstance != null) {
+if (prefillInstance != undefined) {
 	$instance.value = normalizeUrl(prefillInstance);
 }

--- a/src/static/icon.svg
+++ b/src/static/icon.svg
@ -1 +1 @@
-<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2"><path d="M473.266 301.162c-6.855 35.271-61.403 73.871-124.051 81.352-32.669 3.898-64.833 7.48-99.131 5.908-56.092-2.57-100.352-13.389-100.352-13.389 0 5.46.337 10.66 1.01 15.522 7.293 55.356 54.89 58.672 99.977 60.218 45.508 1.558 86.028-11.22 86.028-11.22l1.87 41.141s-31.83 17.093-88.533 20.236c-31.268 1.719-70.092-.786-115.31-12.755C36.7 462.217 19.833 357.677 17.253 251.604c-.786-31.494-.302-61.191-.302-86.028C16.952 57.11 88.02 25.318 88.02 25.318c35.834-16.457 97.32-23.378 161.243-23.9h1.57c63.923.522 125.45 7.443 161.281 23.9 0 0 71.064 31.792 71.064 140.258 0 0 .892 80.026-9.91 135.586" fill="#3088d4" fill-rule="nonzero"/><g fill="#fff"><path d="M476.925 278.214c-4.531 1.19-9.3 1.72-14.272 1.72-15.137 0-26.834-3.956-35.088-11.868-8.256-7.915-12.386-19.439-12.386-34.576v-66.309h-22.704V141.38h22.704v-31.477h32.253v31.477h34.342c.961 7.6 1.403 15.66 1.403 24.197l-.003 1.605h-35.742v65.536c0 6.708 1.633 11.826 4.9 15.352 3.27 3.527 7.999 5.288 14.192 5.288 5.035 0 9.482-.918 13.318-2.817l-.471 5.996-2.446 21.678z"/><path d="M326.94 279.935c-13.933 0-26.492-3.012-37.672-9.033-11.182-6.02-19.91-14.404-26.19-25.155-6.276-10.75-9.417-22.922-9.417-36.51 0-13.587 3.141-25.715 9.418-36.38 6.28-10.665 15.007-19.008 26.19-25.026 11.179-6.02 23.738-9.032 37.67-9.032 14.105 0 26.747 3.011 37.927 9.032 11.182 6.018 19.91 14.361 26.19 25.026 6.276 10.665 9.417 22.793 9.417 36.38 0 13.588-3.14 25.76-9.418 36.51-6.279 10.751-15.007 19.135-26.19 25.155-11.179 6.021-23.82 9.033-37.926 9.033zm0-27.61c11.866 0 21.671-3.954 29.41-11.868 7.743-7.912 11.614-18.319 11.614-31.22 0-12.9-3.871-23.307-11.613-31.219-7.74-7.911-17.545-11.869-29.412-11.869-11.869 0-21.631 3.958-29.285 11.87-7.656 7.911-11.48 18.318-11.48 31.219 0 12.9 3.824 23.307 11.48 31.219 7.654 7.914 17.416 11.869 29.285 11.869z" fill-rule="nonzero"/><path d="M181.159 279.935c-13.933 0-26.489-3.012-37.668-9.033-11.182-6.02-19.91-14.404-26.19-25.155-6.28-10.75-9.418-22.922-9.418-36.51 0-13.587 3.139-25.715 9.418-36.38 6.28-10.665 15.008-19.008 26.19-25.026 11.18-6.02 23.735-9.032 37.668-9.032 14.105 0 26.747 3.011 37.93 9.032 11.179 6.018 19.91 14.361 26.189 25.026 6.276 10.665 9.415 22.793 9.415 36.38 0 13.588-3.139 25.76-9.415 36.51-6.28 10.751-15.01 19.135-26.19 25.155-11.182 6.021-23.824 9.033-37.93 9.033zm0-27.61c11.869 0 21.674-3.954 29.414-11.868 7.742-7.912 11.61-18.319 11.61-31.22 0-12.9-3.868-23.307-11.61-31.219-7.74-7.911-17.545-11.869-29.414-11.869-11.867 0-21.63 3.958-29.285 11.87-7.653 7.911-11.481 18.318-11.481 31.219 0 12.9 3.828 23.307 11.48 31.219 7.657 7.914 17.42 11.869 29.286 11.869z" fill-rule="nonzero"/><path d="M18.353 141.38h21.158v-31.478h32.25v31.477h36.896v25.802H71.762v65.536c0 6.708 1.635 11.826 4.902 15.352 3.268 3.527 7.998 5.288 14.192 5.288 7.222 0 13.243-1.89 18.06-5.676l9.029 22.963c-3.782 3.098-8.383 5.42-13.803 6.969-5.418 1.546-11.137 2.322-17.158 2.322-15.136 0-26.833-3.957-35.09-11.87-8.256-7.914-12.383-19.438-12.383-34.575v-66.309H16.947l.005-1.605c0-8.537.44-16.597 1.401-24.197z"/></g></svg>
+<svg viewBox="0 0 500 500" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2"><path d="M473.266 301.162c-6.855 35.271-61.403 73.871-124.051 81.352-32.669 3.898-64.833 7.48-99.131 5.908-56.092-2.57-100.352-13.389-100.352-13.389 0 5.46.337 10.66 1.01 15.522 7.293 55.356 54.89 58.672 99.977 60.218 45.508 1.558 86.028-11.22 86.028-11.22l1.87 41.141s-31.83 17.093-88.533 20.236c-31.268 1.719-70.092-.786-115.31-12.755C36.7 462.217 19.833 357.677 17.253 251.604c-.786-31.494-.302-61.191-.302-86.028C16.952 57.11 88.02 25.318 88.02 25.318c35.834-16.457 97.32-23.378 161.243-23.9h1.57c63.923.522 125.45 7.443 161.281 23.9 0 0 71.064 31.792 71.064 140.258 0 0 .892 80.026-9.91 135.586" fill="#3088d4" fill-rule="nonzero"/><g fill="#fff"><path d="M476.925 278.214c-4.531 1.19-9.3 1.72-14.272 1.72-15.137 0-26.834-3.956-35.088-11.868-8.256-7.915-12.386-19.439-12.386-34.576v-66.309h-22.704V141.38h22.704v-31.477h32.253v31.477h34.342c.961 7.6 1.403 15.66 1.403 24.197l-.003 1.605h-35.742v65.536c0 6.708 1.633 11.826 4.9 15.352 3.27 3.527 7.999 5.288 14.192 5.288 5.035 0 9.482-.918 13.318-2.817l-.471 5.996-2.446 21.678z"/><path d="M326.94 279.935c-13.933 0-26.492-3.012-37.672-9.033-11.182-6.02-19.91-14.404-26.19-25.155-6.276-10.75-9.417-22.922-9.417-36.51 0-13.587 3.141-25.715 9.418-36.38 6.28-10.665 15.007-19.008 26.19-25.026 11.179-6.02 23.738-9.032 37.67-9.032 14.105 0 26.747 3.011 37.927 9.032 11.182 6.018 19.91 14.361 26.19 25.026 6.276 10.665 9.417 22.793 9.417 36.38 0 13.588-3.14 25.76-9.418 36.51-6.279 10.751-15.007 19.135-26.19 25.155-11.179 6.021-23.82 9.033-37.926 9.033zm0-27.61c11.866 0 21.671-3.954 29.41-11.868 7.743-7.912 11.614-18.319 11.614-31.22 0-12.9-3.871-23.307-11.613-31.219-7.74-7.911-17.545-11.869-29.412-11.869-11.869 0-21.631 3.958-29.285 11.87-7.656 7.911-11.48 18.318-11.48 31.219 0 12.9 3.824 23.307 11.48 31.219 7.654 7.914 17.416 11.869 29.285 11.869z" fill-rule="nonzero"/><path d="M181.159 279.935c-13.933 0-26.489-3.012-37.668-9.033-11.182-6.02-19.91-14.404-26.19-25.155-6.28-10.75-9.418-22.922-9.418-36.51 0-13.587 3.139-25.715 9.418-36.38 6.28-10.665 15.008-19.008 26.19-25.026 11.18-6.02 23.735-9.032 37.668-9.032 14.105 0 26.747 3.011 37.93 9.032 11.179 6.018 19.91 14.361 26.189 25.026 6.276 10.665 9.415 22.793 9.415 36.38 0 13.588-3.139 25.76-9.415 36.51-6.28 10.751-15.01 19.135-26.19 25.155-11.182 6.021-23.824 9.033-37.93 9.033zm0-27.61c11.869 0 21.674-3.954 29.414-11.868 7.742-7.912 11.61-18.319 11.61-31.22 0-12.9-3.868-23.307-11.61-31.219-7.74-7.911-17.545-11.869-29.414-11.869-11.867 0-21.63 3.958-29.285 11.87-7.653 7.911-11.481 18.318-11.481 31.219 0 12.9 3.828 23.307 11.48 31.219 7.657 7.914 17.42 11.869 29.286 11.869z" fill-rule="nonzero"/><path d="M18.353 141.38h21.158v-31.478h32.25v31.477h36.896v25.802H71.762v65.536c0 6.708 1.635 11.826 4.902 15.352 3.268 3.527 7.998 5.288 14.192 5.288 7.222 0 13.243-1.89 18.06-5.676l9.029 22.963c-3.782 3.098-8.383 5.42-13.803 6.969-5.418 1.546-11.137 2.322-17.158 2.322-15.136 0-26.833-3.957-35.09-11.87-8.256-7.914-12.383-19.438-12.383-34.575v-66.309H16.947l.005-1.605c0-8.537.44-16.597 1.401-24.197z"/></g></svg>