add eslint

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

package.json

@@ -57,7 +57,8 @@
     "@types/react-dom": "^18.0.3",
     "@types/ua-parser-js": "^0.7.36",
     "@types/uuid": "^8.3.4",
-    "eslint": "^8.11.0",
+    "eslint": "^8.15.0",
+    "eslint-config-next": "^12.1.6",
     "postcss-import": "^14.1.0",
     "prisma": "^3.13.0",
     "tailwindcss": "^3.0.24",

src/components/common/LoginModal.tsx

@@ -42,7 +42,7 @@ export const LoginModal: React.FC = () => {
             {requestLoginLink.data && (
               <div className="mb-5">
                 We just emailed you with a link to log in, please check your
-                inbox and spam folder in case you can't find it.
+                inbox and spam folder in case you can{`'`}t find it.
               </div>
             )}
             <form className="space-y-5" onSubmit={form.handleSubmit}>

src/components/common/SubscribeModal.tsx

@@ -1,7 +1,6 @@
 import React, { useEffect } from "react"
 import { useFormik } from "formik"
 import { useStore } from "~/lib/store"
-import { Badge } from "../ui/Badge"
 import { Button } from "../ui/Button"
 import { Modal } from "../ui/Modal"
 import toast from "react-hot-toast"
@@ -51,7 +50,7 @@ export const SubscribeModal: React.FC<{
       toast.success(subscription ? "Updated!" : "Subscribed!")
       trpcContext.invalidateQueries("site.subscription")
     }
-  }, [subscribe, isLoggedIn, subscription])
+  }, [subscribe, isLoggedIn, subscription, trpcContext])
 
   useEffect(() => {
     if (unsubscribe.isSuccess) {
@@ -59,7 +58,7 @@ export const SubscribeModal: React.FC<{
       toast.success("Unsubscribed!")
       trpcContext.invalidateQueries("site.subscription")
     }
-  }, [unsubscribe])
+  }, [unsubscribe, trpcContext])
 
   return (
     <Modal title="Become a subscriber" open={open} setOpen={setOpen}>

src/components/dashboard/PagesManager.tsx

@@ -33,7 +33,7 @@ export const PagesManager: React.FC<{
       toast.success("Deleted!")
       trpcContext.invalidateQueries("site.pages")
     }
-  }, [deletePage])
+  }, [deletePage, trpcContext])
 
   const pagesResult = trpc.useQuery(
     [

src/components/main/MainLayout.tsx

@@ -45,7 +45,7 @@ export function MainLayout({
               </span>
             </div>
             <div className="italic text-zinc-500 text-sm mt-1">
-              ..is under early testing, don't use this app in production.
+              ..is under early testing, don{`'`}t use this app in production.
             </div>
             <div className="space-x-5 mt-10">
               {links.map((link) => {

src/components/ui/Avatar.tsx

@@ -1,5 +1,6 @@
 import clsx from "clsx"
 import React, { useMemo } from "react"
+import Image from "next/image"
 
 export const Avatar: React.FC<
   {
@@ -60,7 +61,7 @@ export const Avatar: React.FC<
         height: `${size}px`,
       }}
     >
-      <img
+      <Image
         className={borderRadius}
         src={image}
         width={size}

src/pages/_middleware.ts

@@ -3,7 +3,7 @@ import { IS_PROD } from "~/lib/constants"
 import { S3_BUCKET_NAME, S3_ENDPOINT } from "~/lib/env.server"
 import { getTenant } from "~/lib/tenant.server"
 
-export default (req: NextRequest) => {
+export default function middleware(req: NextRequest) {
   const { pathname } = req.nextUrl
 
   if (!IS_PROD && pathname.startsWith("/dev-s3-proxy")) {

src/pages/dashboard/[subdomain]/account/profile.tsx

@@ -40,7 +40,7 @@ export default function AccountProfilePage() {
         email: viewer.data.email,
       })
     }
-  }, [viewer.data])
+  }, [viewer.data, form])
 
   return (
     <DashboardLayout>

src/pages/dashboard/[subdomain]/editor.tsx

@@ -71,7 +71,7 @@ export default function SubdomainEditor() {
         }`
       )
     }
-  }, [createOrUpdatePage])
+  }, [createOrUpdatePage, isPost, router, subdomain, trpcContext])
 
   useEffect(() => {
     if (!page) return

src/pages/dashboard/[subdomain]/settings/domains.tsx

@@ -18,27 +18,6 @@ export default function SettingsDomainsPage() {
   const ctx = trpc.useContext()
   const updateSite = trpc.useMutation("site.updateSite")
 
-  useEffect(() => {
-    if (updateSite.isSuccess && updateSite.data) {
-      toast.success("Saved!")
-      updateSite.reset()
-      ctx.invalidateQueries()
-      if (updateSite.data.subdomainUpdated) {
-        router.replace(
-          `/dashboard/${updateSite.data.site.subdomain}/settings/domains`
-        )
-      }
-    }
-  }, [updateSite])
-
-  useEffect(() => {
-    if (siteResult.data) {
-      form.setValues({
-        subdomain: siteResult.data.subdomain,
-      })
-    }
-  }, [siteResult.data])
-
   const form = useFormik({
     initialValues: {
       subdomain: "",
@@ -51,6 +30,27 @@ export default function SettingsDomainsPage() {
     },
   })
 
+  useEffect(() => {
+    if (updateSite.isSuccess && updateSite.data) {
+      toast.success("Saved!")
+      updateSite.reset()
+      ctx.invalidateQueries()
+      if (updateSite.data.subdomainUpdated) {
+        router.replace(
+          `/dashboard/${updateSite.data.site.subdomain}/settings/domains`
+        )
+      }
+    }
+  }, [ctx, router, updateSite])
+
+  useEffect(() => {
+    if (siteResult.data) {
+      form.setValues({
+        subdomain: siteResult.data.subdomain,
+      })
+    }
+  }, [form, siteResult.data])
+
   return (
     <DashboardLayout>
       <SettingsLayout title="Site Settings" type="site">

src/pages/dashboard/[subdomain]/settings/general.tsx

@@ -41,7 +41,7 @@ export default function SiteSettingsGeneralPage() {
         description: site.description || "",
       })
     }
-  }, [site])
+  }, [form, site])
 
   useEffect(() => {
     if (updateSite.isSuccess && updateSite.data) {

src/pages/dashboard/index.tsx

@@ -15,4 +15,6 @@ export const getServerSideProps = serverSidePropsHandler(async (ctx) => {
   return redirect(`/dashboard/${site.subdomain}`)
 })
 
-export default () => null
+export default function Dashboard() {
+  return <div>You should never see this</div>
+}

src/pages/dashboard/new-site.tsx

@@ -31,7 +31,7 @@ export default function NewSitePage() {
       createSite.reset()
       router.push(`/dashboard/${createSite.data.subdomain}`)
     }
-  }, [createSite])
+  }, [createSite, router])
 
   return (
     <div>