Skip to content

Commit

Permalink
Add Next.js Recommended ESLint Config for Stricter Linting (#159)
Browse files Browse the repository at this point in the history
This commit leads to a stricter ESLint configuration for the repository:

- Add strict core web vitals rules set recommended by Next.js
- Remove unnecessary configuration already covered in the new config
- Remove dummy href on <a> tags and have passHref on all <Link> elements
  to enforce common style and fix lint errors regarding this.

Ref: https://nextjs.org/docs/basic-features/eslint

Signed-off-by: Shubhanshu Saxena <[email protected]>
  • Loading branch information
shubhanshu02 authored Oct 31, 2021
1 parent 45de787 commit 62cada6
Show file tree
Hide file tree
Showing 17 changed files with 365 additions and 80 deletions.
24 changes: 5 additions & 19 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,38 +6,30 @@ module.exports = {
},
extends: [
"eslint:recommended",
"plugin:react/recommended",
"plugin:import/errors",
"plugin:import/warnings",
"plugin:jsx-a11y/recommended",
"prettier/@typescript-eslint",
"next/core-web-vitals",
"prettier",
"prettier/react",
// TODO: Fix TypeScript Problems and then enable
//"plugin:@typescript-eslint/recommended",
],
parser: "@typescript-eslint/parser",
parserOptions: {
ecmaFeatures: {
jsx: true,
},
ecmaVersion: 2018,
ecmaVersion: "latest",
sourceType: "module",
},
plugins: [
"react",
"@typescript-eslint",
"import",
"jsx-a11y",
"react-hooks",
],
plugins: ["@typescript-eslint"],
rules: {
"react/prop-types": "off",
"no-console": "warn",
"@typescript-eslint/explicit-function-return-type": "off",
"@typescript-eslint/interface-name-prefix": "off",
"@typescript-eslint/no-explicit-any": "off",
"@typescript-eslint/ban-ts-ignore": "off",
// needed for NextJS's jsx without react import
"react/react-in-jsx-scope": "off",
"react-hooks/rules-of-hooks": "error",
"react-hooks/exhaustive-deps": 1,
"react/jsx-filename-extension": [
Expand All @@ -47,12 +39,6 @@ module.exports = {
"no-unused-vars": "warn",
},
settings: {
react: {
version: "detect",
},
"import/parsers": {
"@typescript-eslint/parser": [".ts", ".tsx"],
},
"import/resolver": {
typescript: {},
},
Expand Down
5 changes: 2 additions & 3 deletions components/Buttons/signInButton.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export default function SignInButton() {
rounded="sm"
shadow="2"
hoverShadow="4"
cursor="pointer"
cursor="pointer"
>
<Div m={{ x: "0.7rem", y: "auto" }}>
<FcGoogle />
Expand All @@ -22,5 +22,4 @@ export default function SignInButton() {
</Div>
</>
)

}
}
18 changes: 9 additions & 9 deletions components/Footer/Footer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export default function Footer(): ReactElement {
>
<Text m={{ y: "0.5rem" }} textColor="white">
<Link href="/contributors" passHref>
<a href="/#" rel="noopener noreferrer">
<a rel="noopener noreferrer">
<span
role="img"
aria-label="laptop"
Expand Down Expand Up @@ -89,14 +89,14 @@ export default function Footer(): ReactElement {
<b>Quick Links</b>
<Text m={{ t: "0.5rem" }}>
<Link href="/" passHref>
<a href="/#">
<a>
<span>Home</span>
</a>
</Link>
</Text>
<Text>
<Link href="/hackathons" passHref>
<a href="/#">
<a>
<span>Hackathons</span>
</a>
</Link>
Expand All @@ -107,7 +107,7 @@ export default function Footer(): ReactElement {
href={`/profile/${profile.username}`}
passHref
>
<a href="/#">
<a>
<span>Profile</span>
</a>
</Link>
Expand All @@ -118,7 +118,7 @@ export default function Footer(): ReactElement {
href="https://copsiitbhu.co.in"
passHref
>
<a href="/#">
<a>
<span>COPS</span>
</a>
</Link>
Expand All @@ -137,7 +137,7 @@ export default function Footer(): ReactElement {
href="https://www.linkedin.com/company/cops-iitbhu/mycompany/"
passHref
>
<a href="/#">
<a>
<i
className="fab fa-linkedin fa-2x"
style={{ margin: "10px 5px" }}
Expand All @@ -148,7 +148,7 @@ export default function Footer(): ReactElement {
href="https://github.com/COPS-IITBHU"
passHref
>
<a href="/#">
<a>
<i
className="fab fa-github fa-2x"
style={{ margin: "10px 5px" }}
Expand All @@ -159,7 +159,7 @@ export default function Footer(): ReactElement {
href="https://www.facebook.com/cops.iitbhu/"
passHref
>
<a href="/#">
<a>
<i
className="fab fa-facebook fa-2x"
style={{ margin: "10px 5px" }}
Expand All @@ -170,7 +170,7 @@ export default function Footer(): ReactElement {
href="https://cops-discord-freshers.herokuapp.com/"
passHref
>
<a href="/#">
<a>
<i
className="fab fa-discord fa-2x"
style={{ margin: "10px 5px" }}
Expand Down
2 changes: 1 addition & 1 deletion components/HackathonCard/HackathonCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ export default function HackathonCard({ hackathon }: HackathonCardProps) {
href={`/hackathon/${hackathon.slug}`}
passHref
>
<a href="/#">
<a>
<Button
hoverBg="black300"
m={{ l: "auto" }}
Expand Down
2 changes: 1 addition & 1 deletion components/HackathonDetailPage/Leaderboard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ export function Leaderboard({
<td> {submission.score}</td>
<td>
<Link href={`/submission/${submission.id}`} passHref>
<a href="/#">{submission.title}</a>
<a>{submission.title}</a>
</Link>
</td>
</tr>
Expand Down
6 changes: 2 additions & 4 deletions components/HackathonDetailPage/Participants.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -88,9 +88,7 @@ export function Participants({ slug }: ParticipantsPropTypes) {
href={`/profile/${team.leader.username}`}
passHref
>
<a href="/#">
{team.leader.username}
</a>
<a>{team.leader.username}</a>
</Link>
</td>
</tr>
Expand All @@ -116,7 +114,7 @@ export function Participants({ slug }: ParticipantsPropTypes) {
href={`/profile/${team.members[i].username}`}
passHref
>
<a href="/#">
<a>
{
team.members[i]
.username
Expand Down
9 changes: 5 additions & 4 deletions components/Header/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ export default function Header(): ReactElement {
className={`d-flex align-items-center justify-content-between w-100 h-100 p-3`}
>
<Link href="/" passHref>
<a href="/#" className="text-dark">
<a className="text-dark">
<div>
<span
style={{
Expand Down Expand Up @@ -77,7 +77,7 @@ export default function Header(): ReactElement {
className={`d-flex flex-column flex-md-row justify-content-center align-items-center`}
>
<div className="py-2">
<Link href="/">
<Link href="/" passHref>
<Button
shadow="3"
hoverShadow="4"
Expand All @@ -91,7 +91,7 @@ export default function Header(): ReactElement {
</Link>
</div>
<div className="py-2">
<Link href="/hackathons">
<Link href="/hackathons" passHref>
<Button
shadow="3"
hoverShadow="4"
Expand Down Expand Up @@ -120,6 +120,7 @@ export default function Header(): ReactElement {
<div className="py-2">
<Link
href={`/profile/${profile.username}`}
passHref
>
<Button
shadow="3"
Expand Down Expand Up @@ -210,4 +211,4 @@ export default function Header(): ReactElement {
`}</style>
</div>
)
}
}
1 change: 0 additions & 1 deletion components/Headline/EventText.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ interface TextProps {
export default function EventText({
tag,
text,
children,
textSizeXs,
textSizeMd,
}: PropsWithChildren<TextProps>) {
Expand Down
4 changes: 2 additions & 2 deletions components/Home/EventHeader.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { Text, Button } from "atomize"
import { Button } from "atomize"
import Link from "next/link"
import EventText from "../Headline/EventText"

Expand All @@ -17,7 +17,7 @@ export default function EventHeader({ headerText }: { headerText: string }) {
/>
</div>
<div className="pr-3">
<Link href="/hackathons">
<Link href="/hackathons" passHref>
<Button
shadow="3"
hoverShadow="4"
Expand Down
2 changes: 1 addition & 1 deletion components/Profile/TeamCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ export default function TeamCard({ team }: { team: TeamSerializer }) {
const date: Date = new Date(team.hackathon.end)
const currentDate: Date = new Date()
return (
<Link href={`/hackathon/${team.hackathon.slug}/`}>
<Link href={`/hackathon/${team.hackathon.slug}/`} passHref>
<Div bg="white" shadow="4" rounded="xl" m={{ b: "1rem" }}>
<Div>
<Image
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@
"@typescript-eslint/eslint-plugin": "^4.30.0",
"@typescript-eslint/parser": "^4.30.0",
"eslint": "^7.16.0",
"eslint-config-next": "11.1.2",
"eslint-config-prettier": "^7.2.0",
"eslint-import-resolver-typescript": "^2.4.0",
"eslint-plugin-import": "^2.24.2",
Expand Down
2 changes: 1 addition & 1 deletion pages/_app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import { AuthProvider } from "../context/auth"
import Header from "../components/Header/Header"
import Footer from "../components/Footer/Footer"
import { ToastContainer } from "react-toastify"
import { AppProps } from "next/dist/next-server/lib/router/router"
import { AppProps } from "next/app"

const theme = {
fontFamily: {
Expand Down
18 changes: 9 additions & 9 deletions pages/hackathon/[slug]/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -235,7 +235,7 @@ export default function Hackathon() {
href={`/hackathon/${slug}/teams/${myTeam.team_id}`}
passHref
>
<a href="/#">
<a>
<Button
variant="success"
className="w-100"
Expand All @@ -255,7 +255,7 @@ export default function Hackathon() {
href={`/hackathon/${slug}/teams/${myTeam.team_id}/submit`}
passHref
>
<a href="/#">
<a>
<Button
variant="success"
className="w-100"
Expand Down Expand Up @@ -287,7 +287,7 @@ export default function Hackathon() {
href={`/hackathon/${slug}/teams/${myTeam.team_id}`}
passHref
>
<a href="/#">
<a>
<Button
variant="success"
className="w-100"
Expand All @@ -307,7 +307,7 @@ export default function Hackathon() {
href={`/submission/${submissions[0].id}`}
passHref
>
<a href="/#">
<a>
<Button
variant="success"
className="w-100 pt-3"
Expand All @@ -322,7 +322,7 @@ export default function Hackathon() {
href="#"
passHref
>
<a href="/#">
<a>
<Button
variant="success"
className="w-100 pt-3"
Expand Down Expand Up @@ -356,7 +356,7 @@ export default function Hackathon() {
href={`/hackathon/${slug}/register`}
passHref
>
<a href="/#">
<a>
<Button
variant="success"
className="w-100"
Expand All @@ -381,7 +381,7 @@ export default function Hackathon() {
href={`/hackathon/${slug}/register`}
passHref
>
<a href="/#">
<a>
<Button
className="w-100"
variant="success"
Expand Down Expand Up @@ -442,7 +442,7 @@ export default function Hackathon() {
href={`/hackathon/${slug}/register`}
passHref
>
<a href="/#">
<a>
<Button variant="success">
Register
</Button>
Expand All @@ -455,7 +455,7 @@ export default function Hackathon() {
href={`/hackathon/${slug}/teams/${myTeam.team_id}`}
passHref
>
<a href="/#">
<a>
<Button variant="success">
Your Team
</Button>
Expand Down
2 changes: 1 addition & 1 deletion pages/hackathon/[slug]/teams/[team_id]/submit.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -309,7 +309,7 @@ const MessageModal = ({
<Modal.Footer>
<Link href={buttonLink} passHref>
<Button>
<a href="/#">Okay</a>
<a>Okay</a>
</Button>
</Link>
</Modal.Footer>
Expand Down
3 changes: 1 addition & 2 deletions pages/index.tsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,8 @@
import HackathonCard from "../components/HackathonCard/HackathonCard"
import { Text, Button } from "atomize"
import { Text } from "atomize"
import { Spinner } from "react-bootstrap"
import axiosInstance from "../util/axios"
import React, { useEffect, useState } from "react"
import Link from "next/link"
import Head from "next/head"
import { HackathonSerializer } from "../types/backend"
import Lottie from "react-lottie"
Expand Down
Loading

0 comments on commit 62cada6

Please sign in to comment.