🚨 Was updated .lintstagedrc.json

.eslintrc.json

@@ -1,10 +1,13 @@
 {
 	"env": {
 		"browser": true,
-		"es2021": true
+		"es2021": true,
+		"jest": true
 	},
 	"extends": [
 		"eslint:recommended",
+		"standard",
+		"eslint-config-prettier",
 		"plugin:@typescript-eslint/recommended",
 		"plugin:react/recommended",
 		"plugin:testing-library/react",
@@ -15,8 +18,38 @@
 		"ecmaVersion": "latest",
 		"sourceType": "module"
 	},
-	"plugins": ["@typescript-eslint", "react"],
+	"plugins": ["@typescript-eslint", "react", "simple-import-sort"],
 	"rules": {
-		"@typescript-eslint/ban-ts-comment": "off"
-	}
+		"@typescript-eslint/ban-ts-comment": "off",
+		"simple-import-sort/imports": "error",
+		"simple-import-sort/exports": "error"
+	},
+	"overrides": [
+		{
+			"files": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"],
+			"rules": {
+				"simple-import-sort/imports": [
+					"error",
+					{
+						"groups": [
+							// `react` first, `next` second, then packages starting with a character
+							["^react$", "^next", "^[a-z]"],
+							// Packages starting with `@`
+							["^@"],
+							// Packages starting with `~`
+							["^~"],
+							// Imports starting with `../`
+							["^\\.\\.(?!/?$)", "^\\.\\./?$"],
+							// Imports starting with `./`
+							["^\\./(?=.*/)(?!/?$)", "^\\.(?!/?$)", "^\\./?$"],
+							// Style imports
+							["^.+\\.s?css$"],
+							// Side effect imports
+							["^\\u0000"]
+						]
+					}
+				]
+			}
+		}
+	]
 }

.lintstagedrc.json

@@ -1,3 +1,3 @@
 {
-	"**/*.{js,jsx,ts,tsx}": ["eslint"]
+	"*.{js,jsx,ts,tsx}": ["eslint"]
 }

jest.config.js

@@ -1,4 +1,4 @@
-const nextJest = require('next/jest')
+import nextJest from 'next/jest'
 
 const createJestConfig = nextJest({
 	// Provide the path to your Next.js app to load next.config.js and .env files in your test environment
@@ -15,4 +15,4 @@ const config = {
 }
 
 // createJestConfig is exported this way to ensure that next/jest can load the Next.js config which is async
-module.exports = createJestConfig(config)
+export default createJestConfig(config)

package.json

@@ -8,6 +8,7 @@
 		"dev": "next dev",
 		"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx}\"",
 		"lint": "next lint",
+		"lint:fix": "next lint --fix",
 		"prepare": "husky install",
 		"start": "next start",
 		"test": "jest",
@@ -22,16 +23,13 @@
 		"@googlemaps/three": "^4.0.5",
 		"@rainbow-me/rainbowkit": "^1.0.11",
 		"autoprefixer": "10.4.14",
-		"eslint": "^8.52.0",
-		"eslint-config-next": "13.4.10",
 		"ethers": "5.7.2",
 		"formik": "^2.4.5",
 		"framer-motion": "^10.16.2",
 		"i18next": "^23.5.1",
 		"moment": "^2.29.4",
 		"next": "13.4.10",
 		"postcss": "8.4.26",
-		"prettier": "^3.0.0",
 		"react": "18.2.0",
 		"react-blockies": "^1.4.1",
 		"react-dom": "18.2.0",
@@ -56,14 +54,22 @@
 		"assert": "^2.0.0",
 		"buffer": "^6.0.3",
 		"crypto-browserify": "^3.12.0",
+		"eslint": "^8.52.0",
+		"eslint-config-next": "13.4.10",
+		"eslint-config-prettier": "^9.0.0",
+		"eslint-config-standard": "^17.1.0",
+		"eslint-plugin-n": "^16.2.0",
+		"eslint-plugin-promise": "^6.1.1",
 		"eslint-plugin-react": "^7.33.2",
+		"eslint-plugin-simple-import-sort": "^10.0.0",
 		"eslint-plugin-testing-library": "^6.1.0",
 		"https-browserify": "^1.0.0",
 		"husky": "^8.0.3",
 		"jest": "^29.7.0",
 		"jest-environment-jsdom": "^29.7.0",
 		"lint-staged": "^15.0.2",
 		"os-browserify": "^0.3.0",
+		"prettier": "^3.0.0",
 		"process": "^0.11.10",
 		"react-app-rewired": "^2.2.1",
 		"react-icons": "^4.10.1",

src/components/events/AssistantAvatar.tsx

@@ -1,9 +1,11 @@
 import React from 'react'
-import { Box, Divider, Text, useClipboard, useToast } from '@chakra-ui/react'
-import CopyTextIcon from './CopyTextIcon'
-import Blockies from 'react-blockies'
 import Link from 'next/link'
+import Blockies from 'react-blockies'
+
 import { SCAN } from '@/constants/constants'
+import { Box, Divider, Text, useClipboard, useToast } from '@chakra-ui/react'
+
+import CopyTextIcon from './CopyTextIcon'
 
 type Props = {
 	wallet: string
@@ -15,7 +17,6 @@ export function AssistantAvatar(props: Props): JSX.Element {
 		wallet.substring(0, 6) + '...' + wallet.substring(wallet.length - 4)
 
 	const { hasCopied, onCopy } = useClipboard(wallet)
-	const toast = useToast()
 
 	const handleCopy = () => {
 		onCopy()

src/components/events/AssistantCard.tsx

@@ -1,5 +1,7 @@
 import React from 'react'
-import { Box, Avatar, Divider } from '@chakra-ui/react'
+
+import { Avatar, Box, Divider } from '@chakra-ui/react'
+
 import CopyTextIcon from './CopyTextIcon'
 
 export default function AssistantCard() {

src/components/events/Attendees.tsx

@@ -1,7 +1,9 @@
 import React from 'react'
+import { useTranslation } from 'react-i18next'
+
 import { Flex, SimpleGrid, Text } from '@chakra-ui/react'
+
 import { AssistantAvatar } from './AssistantAvatar'
-import { useTranslation } from 'react-i18next'
 
 type Props = {
 	attendees: string[]

src/components/events/Attendess.test.tsx

@@ -1,4 +1,5 @@
 import { render, screen } from '@testing-library/react'
+
 import Attendees from './Attendees'
 
 jest.mock('react-blockies', () => () => null)
@@ -24,7 +25,7 @@ describe('Attendees', () => {
 		render(<Attendees attendees={attendees} />)
 
 		// @ts-ignore
-		expect(screen.getByText('Asistntes')).toBeInTheDocument()
+		expect(screen.getByText('Asistentes')).toBeInTheDocument()
 	})
 
 	it('should render shorted attendee wallet', () => {

src/components/events/Carousel.tsx

@@ -1,9 +1,10 @@
+import { A11y, Navigation, Pagination } from 'swiper/modules'
 import { Swiper, SwiperSlide } from 'swiper/react'
+
 import 'swiper/css'
 import 'swiper/css/navigation'
 import 'swiper/css/pagination'
 import 'swiper/css/scrollbar'
-import { Navigation, Pagination, A11y } from 'swiper/modules'
 
 export default function Carousel() {
 	return (

src/components/events/EventDetails.tsx

@@ -1,7 +1,8 @@
 import React from 'react'
-import { Flex, Text, VStack } from '@chakra-ui/react'
 import { useTranslation } from 'react-i18next'
+
 import { Event } from '@/models/event.model'
+import { Flex, Text, VStack } from '@chakra-ui/react'
 interface EventDetailsProps {
 	event: Event | null
 }

src/components/events/EventImage.tsx

@@ -1,11 +1,12 @@
 import React from 'react'
-import { Flex, Text, Box } from '@chakra-ui/react'
+
+import { Box, Flex, Text } from '@chakra-ui/react'
 interface EventImageProps {
 	eventName: string
 	eventId: string
 }
 const EventImage = ({ eventName, eventId }: EventImageProps) => {
-	const firstEvent: boolean = eventId == "mC8cCmWH5Ws8IZQy"
+	const firstEvent: boolean = eventId == 'mC8cCmWH5Ws8IZQy'
 
 	return (
 		<Box position='relative' width='full' mx='auto'>
@@ -32,13 +33,15 @@ const EventImage = ({ eventName, eventId }: EventImageProps) => {
 				minH={{ base: '300px', md: '400px', lg: '500px' }}
 				mx='auto'
 				bg={'brand.newBlack'}
-				backgroundImage={firstEvent ? '/images/voluntarioBSL.png' : '/images/side_event.jpg'}
+				backgroundImage={
+					firstEvent ? '/images/voluntarioBSL.png' : '/images/side_event.jpg'
+				}
 				backgroundSize={'cover'}
 				backgroundRepeat={'no-repeat'}
 				backgroundPosition={'center'}
 				align='center'
 				position='relative'
-				borderRadius={"3xl"}
+				borderRadius={'3xl'}
 			/>
 		</Box>
 	)

src/components/events/EventLocation.tsx

@@ -1,25 +1,27 @@
+import { useEffect, useState } from 'react'
+import moment from 'moment'
+import { useTranslation } from 'react-i18next'
+
+import { Event } from '@/models/event.model'
+import { CalendarIcon, InfoIcon } from '@chakra-ui/icons'
 import {
-	Flex,
-	Text,
-	VStack,
+	Avatar,
 	Box,
-	HStack,
 	Divider,
-	Avatar
+	Flex,
+	HStack,
+	Text,
+	VStack
 } from '@chakra-ui/react'
-import { CalendarIcon, InfoIcon } from '@chakra-ui/icons'
-import { useTranslation } from 'react-i18next'
-import { Event } from '@/models/event.model'
-import { useEffect, useState } from 'react'
-import moment from 'moment'
-import 'moment/locale/es';
+
+import 'moment/locale/es'
 
 interface EventLocationProps {
 	event: Event | null
 }
 
 const EventLocation = ({ event }: EventLocationProps) => {
-	const [startDate, setStartDate] = useState<string>('');
+	const [startDate, setStartDate] = useState<string>('')
 	const { t, i18n } = useTranslation()
 
 	useEffect(() => {