Use absolute imports and move files

.eslintrc

@@ -30,11 +30,11 @@
         ]
       }
     ],
-    "jsx-a11y/click-events-have-key-events": "off",
     "react/prop-types": "off",
     "react/jsx-props-no-spreading": "off",
     "import/prefer-default-export": "off",
     "no-param-reassign": "off",
-    "no-nested-ternary": "off"
+    "no-nested-ternary": "off",
+    "import/no-unresolved": "off"
   }
 }

components/layout.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import Head from 'next/head';
 import Link from 'next/link';
-import { useCurrentUser } from '../lib/hooks';
+import { useCurrentUser } from '@/hooks/index';
 
 export default function Layout({ children }) {
   const [user, { mutate }] = useCurrentUser();

components/post/editor.jsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { useCurrentUser } from '../../lib/hooks';
+import { useCurrentUser } from '@/hooks/index';
 
 export default function PostEditor() {
   const [user] = useCurrentUser();

components/post/posts.jsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import { useSWRInfinite } from 'swr';
 import Link from 'next/link';
-import { useUser } from '../../lib/hooks';
-import fetcher from '../../lib/fetch';
+import { useUser } from '@/hooks/index';
+import fetcher from '@/lib/fetch';
 
 function Post({ post }) {
   const user = useUser(post.creatorId);

hooks/index.js

@@ -0,0 +1 @@
+export * from './user';

lib/hooks.jsx → hooks/user.js

@@ -1,5 +1,5 @@
 import useSWR from 'swr';
-import fetcher from './fetch';
+import fetcher from '@/lib/fetch';
 
 export function useCurrentUser() {
   const { data, mutate } = useSWR('/api/user', fetcher);

jsconfig.json

@@ -0,0 +1,11 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/components/*": ["components/*"],
+      "@/lib/*": ["lib/*"],
+      "@/middlewares/*": ["middlewares/*"],
+      "@/hooks/*": ["hooks/*"]
+    }
+  }
+}

middlewares/all.js

@@ -0,0 +1,10 @@
+import nc from 'next-connect';
+import passport from 'middlewares/passport';
+import database from './database';
+import session from './session';
+
+const all = nc();
+
+all.use(database).use(session).use(passport.initialize()).use(passport.session());
+
+export default all;

middlewares/index.js

@@ -0,0 +1,3 @@
+export { default as database } from './database';
+export { default as all } from './all';
+export { default as session } from './session';

pages/_app.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import Head from 'next/head';
-import Layout from '../components/layout';
+import Layout from '@/components/layout';
 
 export default function MyApp({ Component, pageProps }) {
   return (

pages/api/auth.js

@@ -1,11 +1,11 @@
-import nextConnect from 'next-connect';
-import middleware from '../../middlewares/middleware';
-import passport from '../../lib/passport';
-import { extractUser } from '../../lib/api-helpers';
+import nc from 'next-connect';
+import { all } from '@/middlewares/index';
+import passport from 'middlewares/passport';
+import { extractUser } from '@/lib/api-helpers';
 
-const handler = nextConnect();
+const handler = nc();
 
-handler.use(middleware);
+handler.use(all);
 
 handler.post(passport.authenticate('local'), (req, res) => {
   res.json({ user: extractUser(req) });

pages/api/posts/index.js

@@ -1,10 +1,10 @@
-import nextConnect from 'next-connect';
+import nc from 'next-connect';
 import { nanoid } from 'nanoid';
-import middleware from '../../../middlewares/middleware';
+import { all } from '@/middlewares/index';
 
-const handler = nextConnect();
+const handler = nc();
 
-handler.use(middleware);
+handler.use(all);
 
 handler.get(async (req, res) => {
   // Pagination: Fetch posts from before the input date or fetch from newest

pages/api/user/email/verify.js

@@ -1,11 +1,11 @@
 import crypto from 'crypto';
-import nextConnect from 'next-connect';
-import { sendMail } from '../../../../lib/mail';
-import middleware from '../../../../middlewares/middleware';
+import nc from 'next-connect';
+import { sendMail } from '@/lib/mail';
+import { all } from '@/middlewares/index';
 
-const handler = nextConnect();
+const handler = nc();
 
-handler.use(middleware);
+handler.use(all);
 
 handler.post(async (req, res) => {
   if (!req.user) { res.json(401).send('you need to be authenticated'); return; }

pages/api/user/index.js

@@ -1,11 +1,11 @@
-import nextConnect from 'next-connect';
+import nc from 'next-connect';
 import multer from 'multer';
 import { v2 as cloudinary } from 'cloudinary';
-import middleware from '../../../middlewares/middleware';
-import { extractUser } from '../../../lib/api-helpers';
+import { all } from '@/middlewares/index';
+import { extractUser } from '@/lib/api-helpers';
 
 const upload = multer({ dest: '/tmp' });
-const handler = nextConnect();
+const handler = nc();
 
 /* eslint-disable camelcase */
 const {
@@ -20,7 +20,7 @@ cloudinary.config({
   api_secret,
 });
 
-handler.use(middleware);
+handler.use(all);
 
 handler.get(async (req, res) => res.json({ user: extractUser(req) }));
 

pages/api/user/password/index.js

@@ -1,9 +1,9 @@
-import nextConnect from 'next-connect';
+import nc from 'next-connect';
 import bcrypt from 'bcryptjs';
-import middleware from '../../../../middlewares/middleware';
+import { all } from '@/middlewares/index';
 
-const handler = nextConnect();
-handler.use(middleware);
+const handler = nc();
+handler.use(all);
 
 handler.put(async (req, res) => {
   if (!req.user) { res.json(401).send('you need to be authenticated'); return; }

pages/api/user/password/reset.js

@@ -1,10 +1,10 @@
 import crypto from 'crypto';
 import bcrypt from 'bcryptjs';
-import nextConnect from 'next-connect';
-import { sendMail } from '../../../../lib/mail';
-import database from '../../../../middlewares/database';
+import nc from 'next-connect';
+import { sendMail } from '@/lib/mail';
+import { database } from '@/middlewares/index';
 
-const handler = nextConnect();
+const handler = nc();
 
 handler.use(database);
 

pages/api/users.js

@@ -1,14 +1,14 @@
-import nextConnect from 'next-connect';
+import nc from 'next-connect';
 import isEmail from 'validator/lib/isEmail';
 import normalizeEmail from 'validator/lib/normalizeEmail';
 import bcrypt from 'bcryptjs';
 import { nanoid } from 'nanoid';
-import middleware from '../../middlewares/middleware';
-import { extractUser } from '../../lib/api-helpers';
+import { all } from '@/middlewares/index';
+import { extractUser } from '@/lib/api-helpers';
 
-const handler = nextConnect();
+const handler = nc();
 
-handler.use(middleware);
+handler.use(all);
 
 handler.post(async (req, res) => {
   const { name, password } = req.body;

pages/api/users/[userId]/index.js

@@ -1,11 +1,10 @@
+import nc from 'next-connect';
+import { all } from '@/middlewares/index';
+import { getUser } from '@/lib/db';
 
-import nextConnect from 'next-connect';
-import middleware from '../../../../middlewares/middleware';
-import { getUser } from '../../../../lib/db';
+const handler = nc();
 
-const handler = nextConnect();
-
-handler.use(middleware);
+handler.use(all);
 
 handler.get(async (req, res) => {
   const user = await getUser(req, req.query.userId);

pages/forget-password/[token].jsx

@@ -1,8 +1,8 @@
 import React from 'react';
 import Head from 'next/head';
-import nextConnect from 'next-connect';
+import nc from 'next-connect';
 import Router from 'next/router';
-import database from '../../middlewares/database';
+import { database } from '@/middlewares/index';
 
 const ResetPasswordTokenPage = ({ valid, token }) => {
   async function handleSubmit(event) {
@@ -56,9 +56,9 @@ const ResetPasswordTokenPage = ({ valid, token }) => {
 };
 
 export async function getServerSideProps(ctx) {
-  const handler = nextConnect();
+  const handler = nc();
   handler.use(database);
-  await handler.apply(ctx.req, ctx.res);
+  await handler.run(ctx.req, ctx.res);
   const { token } = ctx.query;
 
   const tokenDoc = await ctx.req.db.collection('tokens').findOne({

pages/index.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
-import { useCurrentUser } from '../lib/hooks';
-import PostEditor from '../components/post/editor';
-import Posts from '../components/post/posts';
+import { useCurrentUser } from '@/hooks/index';
+import PostEditor from '@/components/post/editor';
+import Posts from '@/components/post/posts';
 
 const IndexPage = () => {
   const [user] = useCurrentUser();

pages/login.jsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import Head from 'next/head';
 import Link from 'next/link';
 import { useRouter } from 'next/router';
-import { useCurrentUser } from '../lib/hooks';
+import { useCurrentUser } from '@/hooks/index';
 
 const LoginPage = () => {
   const router = useRouter();

pages/settings.jsx

@@ -1,6 +1,6 @@
 import React, { useState, useEffect, useRef } from 'react';
 import Head from 'next/head';
-import { useCurrentUser } from '../lib/hooks';
+import { useCurrentUser } from '@/hooks/index';
 
 const ProfileSection = () => {
   const [user, { mutate }] = useCurrentUser();

pages/signup.jsx

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import Head from 'next/head';
 import Router from 'next/router';
-import { useCurrentUser } from '../lib/hooks';
+import { useCurrentUser } from '@/hooks/index';
 
 const SignupPage = () => {
   const [user, { mutate }] = useCurrentUser();

pages/user/[userId]/index.jsx

@@ -2,10 +2,10 @@ import React from 'react';
 import Head from 'next/head';
 import Link from 'next/link';
 import Error from 'next/error';
-import middleware from '../../../middlewares/middleware';
-import { useCurrentUser } from '../../../lib/hooks';
-import Posts from '../../../components/post/posts';
-import { getUser } from '../../../lib/db';
+import { all } from '@/middlewares/index';
+import { useCurrentUser } from '@/hooks/index';
+import Posts from '@/components/post/posts';
+import { getUser } from '@/lib/db';
 
 export default function UserPage({ user }) {
   if (!user) return <Error statusCode={404} />;
@@ -77,7 +77,7 @@ export default function UserPage({ user }) {
 }
 
 export async function getServerSideProps(context) {
-  await middleware.apply(context.req, context.res);
+  await all.run(context.req, context.res);
   const user = await getUser(context.req, context.params.userId);
   if (!user) context.res.statusCode = 404;
   return {

pages/verify-email/[token].jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import Head from 'next/head';
-import nextConnect from 'next-connect';
-import database from '../../middlewares/database';
+import nc from 'next-connect';
+import { all } from '@/middlewares/index';
 
 export default function EmailVerifyPage({ success }) {
   return (
@@ -22,9 +22,9 @@ export default function EmailVerifyPage({ success }) {
 }
 
 export async function getServerSideProps(ctx) {
-  const handler = nextConnect();
-  handler.use(database);
-  await handler.apply(ctx.req, ctx.res);
+  const handler = nc();
+  handler.use(all);
+  await handler.run(ctx.req, ctx.res);
 
   const { token } = ctx.query;
   const { value: tokenDoc } = await ctx.req.db