update deps

.github/workflows/publish.yml

@@ -14,7 +14,7 @@ jobs:
       - name: ⎔ Setup node
         uses: actions/setup-node@v2
         with:
-          node-version: 14
+          node-version: 16
           registry-url: "https://npm.pkg.github.com"
           scope: "@iamnapo"
 

template.json

@@ -36,73 +36,89 @@
 				"iamnapo/with-react"
 			],
 			"rules": {
-				"import/no-extraneous-dependencies": [
-					"error",
-					{
-						"devDependencies": [
-							"cypress/**/*.js"
+				"unicorn/prefer-module": "off"
+			},
+			"overrides": [
+				{
+					"files": [
+						"src/service-worker.js"
+					],
+					"rules": {
+						"no-restricted-globals": "off"
+					}
+				},
+				{
+					"files": [
+						"cypress/**/*"
+					],
+					"rules": {
+						"import/no-extraneous-dependencies": [
+							"error",
+							{
+								"devDependencies": true
+							}
 						]
 					}
-				]
-			},
+				}
+			],
 			"ignorePatterns": [
 				"build",
 				"coverage"
 			]
 		},
 		"dependencies": {
-			"@craco/craco": "^6.1.1",
-			"@emotion/react": "^11.1.5",
-			"@emotion/styled": "^11.1.5",
-			"@fontsource/roboto": "^4.2.2",
-			"@iamnapo/construct-url": "^2.0.0",
-			"@material-ui/core": "^5.0.0-alpha.27",
-			"@material-ui/icons": "^5.0.0-alpha.27",
-			"@material-ui/lab": "^5.0.0-alpha.27",
-			"@sentry/browser": "^6.2.3",
+			"@craco/craco": "^6.1.2",
+			"@emotion/react": "^11.4.0",
+			"@emotion/styled": "^11.3.0",
+			"@fontsource/roboto": "^4.3.0",
+			"@iamnapo/construct-url": "^2.0.1",
+			"@material-ui/core": "^5.0.0-alpha.34",
+			"@material-ui/icons": "^5.0.0-alpha.34",
+			"@material-ui/lab": "^5.0.0-alpha.34",
+			"@sentry/browser": "^6.4.0",
 			"clsx": "^1.1.1",
-			"date-fns": "^2.19.0",
+			"date-fns": "^2.21.3",
 			"history": "^4.10.1",
-			"ky": "^0.27.0",
-			"notistack": "^1.0.5",
+			"ky": "^0.28.1",
+			"notistack": "^1.0.8",
 			"prop-types": "^15.7.2",
 			"query-string": "^7.0.0",
 			"react-ga": "^3.3.0",
 			"react-router-dom": "^5.2.0",
-			"swr": "^0.5.4",
-			"web-vitals": "^1.1.1",
-			"workbox-background-sync": "^6.1.2",
-			"workbox-broadcast-update": "^6.1.2",
-			"workbox-cacheable-response": "^6.1.2",
-			"workbox-core": "^6.1.2",
-			"workbox-expiration": "^6.1.2",
-			"workbox-google-analytics": "^6.1.2",
-			"workbox-navigation-preload": "^6.1.2",
-			"workbox-precaching": "^6.1.2",
-			"workbox-range-requests": "^6.1.2",
-			"workbox-routing": "^6.1.2",
-			"workbox-strategies": "^6.1.2",
-			"workbox-streams": "^6.1.2",
-			"zustand": "^3.3.3"
+			"swr": "^0.5.6",
+			"web-vitals": "^1.1.2",
+			"workbox-background-sync": "^6.1.5",
+			"workbox-broadcast-update": "^6.1.5",
+			"workbox-cacheable-response": "^6.1.5",
+			"workbox-core": "^6.1.5",
+			"workbox-expiration": "^6.1.5",
+			"workbox-google-analytics": "^6.1.5",
+			"workbox-navigation-preload": "^6.1.5",
+			"workbox-precaching": "^6.1.5",
+			"workbox-range-requests": "^6.1.5",
+			"workbox-routing": "^6.1.5",
+			"workbox-strategies": "^6.1.5",
+			"workbox-streams": "^6.1.5",
+			"zustand": "^3.5.1"
 		},
 		"devDependencies": {
-			"@cypress/code-coverage": "^3.9.2",
+			"@cypress/code-coverage": "^3.9.5",
 			"@cypress/instrument-cra": "^1.4.0",
-			"@iamnapo/prettier-config": "^1.0.2",
+			"@iamnapo/prettier-config": "^1.0.3",
 			"babel-plugin-import": "^1.13.3",
-			"cypress": "^6.8.0",
-			"dotenv": "^8.2.0",
-			"eslint": "^7.22.0",
-			"eslint-config-iamnapo": "^12.0.1",
-			"eslint-plugin-cypress": "^2.11.2",
-			"eslint-plugin-import": "^2.22.1",
+			"cypress": "^7.3.0",
+			"dotenv": "^9.0.2",
+			"eslint": "^7.26.0",
+			"eslint-config-iamnapo": "^15.0.0",
+			"eslint-plugin-cypress": "^2.11.3",
+			"eslint-plugin-import": "^2.23.2",
 			"eslint-plugin-jsx-a11y": "^6.4.1",
-			"eslint-plugin-react": "^7.22.0",
+			"eslint-plugin-react": "^7.23.2",
 			"eslint-plugin-react-hooks": "^4.2.0",
-			"eslint-plugin-unicorn": "^28.0.2",
-			"sass": "^1.32.8",
+			"eslint-plugin-unicorn": "^32.0.1",
+			"sass": "^1.32.13",
 			"source-map-explorer": "^2.5.2",
-			"start-server-and-test": "^1.12.1"
+			"start-server-and-test": "^1.12.2"
 		},
 		"engines": {
 			"node": ">=14"

template/.github/workflows/ci.yml

@@ -14,14 +14,12 @@ jobs:
         uses: actions/checkout@v2
 
       - name: ⎔ Setup node
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v2
         with:
-          node-version: 14
+          node-version: 16
 
       - name: 📥 Download deps
-        run: bahmutov/npm-install@v1
-        with:
-          useLockFile: false
+        run: npm i --legacy-peer-deps
 
       - name: 🧪 Run test script
         run: npm test

template/src/api/index.js

@@ -1,5 +1,5 @@
 import useSWR from "swr";
-import ky from "ky";
+import ky from "ky/distribution";
 import queryString from "query-string";
 import constructUrl from "@iamnapo/construct-url";
 

template/src/index.js

@@ -1,8 +1,8 @@
 import { lazy, StrictMode, Suspense, useCallback, useEffect } from "react";
 import ReactDOM from "react-dom";
 import { Router, Switch, Route, useLocation } from "react-router-dom";
-import { LinearProgress, StyledEngineProvider } from "@material-ui/core";
-import { ThemeProvider, createMuiTheme } from "@material-ui/core/styles";
+import { LinearProgress } from "@material-ui/core";
+import { ThemeProvider, createTheme, StyledEngineProvider } from "@material-ui/core/styles";
 import { SnackbarProvider } from "notistack";
 import ReactGA from "react-ga";
 import * as Sentry from "@sentry/browser";
@@ -14,8 +14,9 @@ import "./index.scss";
 
 import history from "./history";
 import { useGlobalState } from "./utils";
-import * as serviceWorkerRegistration from "./serviceWorkerRegistration";
-import reportWebVitals from "./reportWebVitals";
+import api from "./api";
+import * as serviceWorkerRegistration from "./service-worker-registration";
+import reportWebVitals from "./report-web-vitals";
 
 const Home = lazy(() => import("./screens/Home"));
 
@@ -26,8 +27,8 @@ Sentry.init({
 	enabled: process.env.NODE_ENV === "production",
 });
 ReactGA.initialize(process.env.REACT_APP_GA, { testMode: process.env.NODE_ENV !== "production" });
-const swrConfig = { revalidateOnFocus: false, shouldRetryOnError: false };
-const theme = createMuiTheme({
+const swrConfig = { revalidateOnFocus: false, shouldRetryOnError: false, fetcher: api.get };
+const theme = createTheme({
 	palette: {
 		primary: {
 			main: "#61dafb",

template/src/screens/Home.js

@@ -10,7 +10,16 @@ const Home = () => {
 
 	return (
 		<Box>
-			<Grid container component="header" alignItems="center" justifyContent="center" direction="column" bgcolor="secondary.main" minHeight="100vh">
+			<Grid
+				container
+				component="header"
+				alignItems="center"
+				justifyContent="center"
+				textAlign="center"
+				direction="column"
+				bgcolor="secondary.main"
+				minHeight="100vh"
+			>
 				<Grid item>
 					<Logo />
 				</Grid>

template/src/serviceWorkerRegistration.js → template/src/service-worker-registration.js

@@ -59,6 +59,8 @@ function checkValidServiceWorker(swUrl, config) {
 
 export function unregister() {
 	if ("serviceWorker" in navigator) {
-		navigator.serviceWorker.ready.then((registration) => registration.unregister()).catch((error) => console.error(error.message));
+		navigator.serviceWorker.ready
+			.then((registration) => registration.unregister())
+			.catch((error) => console.error(error.message));
 	}
 }

template/src/service-worker.js

@@ -1,5 +1,3 @@
-/* eslint-disable no-restricted-globals */
-
 import { clientsClaim } from "workbox-core";
 import { ExpirationPlugin } from "workbox-expiration";
 import { precacheAndRoute, createHandlerBoundToURL } from "workbox-precaching";

template/src/utils/index.js

@@ -1,3 +1,3 @@
-export { default as useSnackbar } from "./useSnackbar";
-export { default as useGlobalState } from "./useGlobalState";
+export { default as useSnackbar } from "./use-snackbar";
+export { default as useGlobalState } from "./use-global-state";
 export const STUFF = [1, 2, 3];