diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 0000000..7e9eaac --- /dev/null +++ b/.eslintignore @@ -0,0 +1,6 @@ +.next +.lighthouseci +node_modules +next-env.d.ts +**/workbox-*.js +**/sw.js diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000..b426668 --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,15 @@ +{ + "extends": ["standard-with-typescript", "eslint-config-prettier"], + "plugins": ["eslint-plugin-prettier"], + "parserOptions": { + "project": "./tsconfig.json" + }, + "env": { + "node": true, + "browser": true, + "jest": true + }, + "rules": { + "prettier/prettier": "error" + } +} diff --git a/.husky/pre-commit b/.husky/pre-commit index 2b2fddb..3199e8e 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,7 +1,4 @@ #!/bin/sh . "$(dirname "$0")/_/husky.sh" -npm run lint:docker -npm run lint:editorconfig -npm run lint:markdown -npm run lint:typescript +npm run lint:staged diff --git a/.lintstagedrc.json b/.lintstagedrc.json new file mode 100644 index 0000000..cea1c00 --- /dev/null +++ b/.lintstagedrc.json @@ -0,0 +1,7 @@ +{ + "*": ["editorconfig-checker"], + "*.{js,ts,jsx,tsx}": ["prettier --write", "eslint --fix"], + "*.{css,yml,json}": ["prettier --write"], + "*.{md}": ["prettier --write", "markdownlint --dot --fix"], + "./Dockerfile": ["dockerfilelint"] +} diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 0000000..6d4bdb9 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,8 @@ +.next +.lighthouseci +node_modules +next-env.d.ts +package.json +package-lock.json +**/workbox-*.js +**/sw.js diff --git a/.prettierrc.json b/.prettierrc.json new file mode 100644 index 0000000..83ef1ce --- /dev/null +++ b/.prettierrc.json @@ -0,0 +1,6 @@ +{ + "singleQuote": true, + "jsxSingleQuote": true, + "semi": false, + "trailingComma": "none" +} diff --git a/.vscode/extensions.json b/.vscode/extensions.json index bbe4d0f..68345f7 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -1,11 +1,12 @@ { "recommendations": [ + "editorconfig.editorconfig", + "esbenp.prettier-vscode", + "dbaeumer.vscode-eslint", "divlo.vscode-styled-jsx-syntax", "divlo.vscode-styled-jsx-languageserver", "bradlc.vscode-tailwindcss", - "standard.vscode-standard", "mikestead.dotenv", - "editorconfig.editorconfig", "coenraads.bracket-pair-colorizer", "davidanson.vscode-markdownlint" ] diff --git a/.vscode/settings.json b/.vscode/settings.json index 320a6bb..f7a833f 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,8 +1,9 @@ { - "standard.enable": true, - "standard.engine": "ts-standard", - "standard.treatErrorsAsWarnings": true, - "standard.usePackageJson": true, - "standard.autoFixOnSave": true, - "typescript.tsdk": "node_modules/typescript/lib" + "typescript.tsdk": "node_modules/typescript/lib", + "editor.defaultFormatter": "esbenp.prettier-vscode", + "prettier.configPath": ".prettierrc.json", + "editor.formatOnSave": true, + "editor.codeActionsOnSave": { + "source.fixAll": true + } } diff --git a/components/Contact/FormResult.tsx b/components/Contact/FormResult.tsx index 27c6a6d..63b856d 100644 --- a/components/Contact/FormResult.tsx +++ b/components/Contact/FormResult.tsx @@ -17,15 +17,11 @@ export const FormResult: React.FC = (props) => { if (state === 'loading' || state === 'success') { return ( - - {t(`home:contact.result.${state}`)} - + {t(`home:contact.result.${state}`)} ) } return ( - - {t(`home:contact.result.${state}`)} - + {t(`home:contact.result.${state}`)} ) } diff --git a/components/Contact/FormState.tsx b/components/Contact/FormState.tsx index cd7c90f..3ec9aea 100644 --- a/components/Contact/FormState.tsx +++ b/components/Contact/FormState.tsx @@ -5,7 +5,7 @@ export interface FormStateProps extends React.ComponentPropsWithRef<'p'> { children: string } -export const FormState: React.FC = props => { +export const FormState: React.FC = (props) => { const { state, children, ...rest } = props const { t } = useTranslation() @@ -15,24 +15,28 @@ export const FormState: React.FC = props => {

{['error', 'success'].includes(state) && ( - {state === 'error' ? t('home:contact.error') : t('home:contact.success')}: + {state === 'error' + ? t('home:contact.error') + : t('home:contact.success')} + : )}{' '} {children}

- ) diff --git a/components/ErrorPage.tsx b/components/ErrorPage.tsx index e89e867..bd3fc65 100644 --- a/components/ErrorPage.tsx +++ b/components/ErrorPage.tsx @@ -6,7 +6,7 @@ export interface ErrorPageProps { message: string } -export const ErrorPage: React.FC = props => { +export const ErrorPage: React.FC = (props) => { const { message, statusCode } = props const { t } = useTranslation() @@ -19,19 +19,20 @@ export const ErrorPage: React.FC = props => { {message} {t('errors:returnToHomePage')}

- ) diff --git a/components/Footer.tsx b/components/Footer.tsx index a4185a7..a95f31c 100644 --- a/components/Footer.tsx +++ b/components/Footer.tsx @@ -7,7 +7,8 @@ export const Footer: React.FC = () => { <>

- Divlo | {t('common:allRightsReserved')} + Divlo |{' '} + {t('common:allRightsReserved')}

diff --git a/components/Head.tsx b/components/Head.tsx index fde73b5..4473354 100644 --- a/components/Head.tsx +++ b/components/Head.tsx @@ -7,7 +7,7 @@ interface HeadProps { url?: string } -export const Head: React.FC = props => { +export const Head: React.FC = (props) => { const { title = 'Divlo', image = '/images/icons/icon-96x96.png', diff --git a/components/Interests/InterestsList/InterestItem.tsx b/components/Interests/InterestsList/InterestItem.tsx index 9008bb5..d7c3c58 100644 --- a/components/Interests/InterestsList/InterestItem.tsx +++ b/components/Interests/InterestsList/InterestItem.tsx @@ -7,7 +7,7 @@ interface InterestItemProps { fontAwesomeIcon: IconDefinition } -export const InterestItem: React.FC = props => { +export const InterestItem: React.FC = (props) => { const { fontAwesomeIcon, title } = props return ( diff --git a/components/Interests/index.tsx b/components/Interests/index.tsx index 0e6bf35..7a987d5 100644 --- a/components/Interests/index.tsx +++ b/components/Interests/index.tsx @@ -6,9 +6,13 @@ import { InterestsList } from './InterestsList' export const Interests: React.FC = () => { const { t } = useTranslation() - const paragraphs: InterestParagraphProps[] = t('home:interests.paragraphs', {}, { - returnObjects: true - }) + const paragraphs: InterestParagraphProps[] = t( + 'home:interests.paragraphs', + {}, + { + returnObjects: true + } + ) return ( <> diff --git a/components/Portfolio/PortfolioItem.tsx b/components/Portfolio/PortfolioItem.tsx index cd51c3b..4d0e450 100644 --- a/components/Portfolio/PortfolioItem.tsx +++ b/components/Portfolio/PortfolioItem.tsx @@ -7,7 +7,7 @@ export interface PortfolioItemProps { image: string } -export const PortfolioItem: React.FC = props => { +export const PortfolioItem: React.FC = (props) => { const { title, description, link, image } = props return ( @@ -32,15 +32,15 @@ export const PortfolioItem: React.FC = props => { ) diff --git a/components/Profile/SocialMediaList/SocialMediaItem.tsx b/components/Profile/SocialMediaList/SocialMediaItem.tsx index b8b2a0e..2373724 100644 --- a/components/Profile/SocialMediaList/SocialMediaItem.tsx +++ b/components/Profile/SocialMediaList/SocialMediaItem.tsx @@ -6,7 +6,7 @@ interface SocialMediaItemProps { socialMedia: 'Email' | 'GitHub' | 'Twitch' | 'Twitter' | 'YouTube' } -export const SocialMediaItem: React.FC = props => { +export const SocialMediaItem: React.FC = (props) => { const { link, socialMedia } = props return ( diff --git a/components/Profile/SocialMediaList/index.tsx b/components/Profile/SocialMediaList/index.tsx index 5634c87..c52d794 100644 --- a/components/Profile/SocialMediaList/index.tsx +++ b/components/Profile/SocialMediaList/index.tsx @@ -25,16 +25,17 @@ export const SocialMediaList: React.FC = () => { - ) diff --git a/components/Skills/Skill.tsx b/components/Skills/Skill.tsx index e9f46b4..48f6e3d 100644 --- a/components/Skills/Skill.tsx +++ b/components/Skills/Skill.tsx @@ -6,7 +6,7 @@ export interface SkillProps { skill: keyof typeof skills } -export const Skill: React.FC = props => { +export const Skill: React.FC = (props) => { const { skill } = props const skillProperties = skills[skill] @@ -29,15 +29,16 @@ export const Skill: React.FC = props => { - ) diff --git a/components/Skills/SkillsSection.tsx b/components/Skills/SkillsSection.tsx index c53a9f8..df9f714 100644 --- a/components/Skills/SkillsSection.tsx +++ b/components/Skills/SkillsSection.tsx @@ -5,7 +5,7 @@ export interface SkillsSectionProps { children: React.ReactNode } -export const SkillsSection: React.FC = props => { +export const SkillsSection: React.FC = (props) => { const { title, children } = props return ( @@ -23,21 +23,22 @@ export const SkillsSection: React.FC = props => { - ) diff --git a/components/design/Input.tsx b/components/design/Input.tsx index 254c0e3..61de9bf 100644 --- a/components/design/Input.tsx +++ b/components/design/Input.tsx @@ -16,59 +16,60 @@ export const Input = forwardRef((props, ref) => { - ) diff --git a/components/design/RevealFade.tsx b/components/design/RevealFade.tsx index 5ed082b..92f0b93 100644 --- a/components/design/RevealFade.tsx +++ b/components/design/RevealFade.tsx @@ -1,6 +1,6 @@ import { useEffect, useRef } from 'react' -export const RevealFade: React.FC = props => { +export const RevealFade: React.FC = (props) => { const { children } = props const htmlElement = useRef(null) @@ -8,7 +8,7 @@ export const RevealFade: React.FC = props => { useEffect(() => { const observer = new window.IntersectionObserver( (entries, observer) => { - entries.forEach(entry => { + entries.forEach((entry) => { if (entry.isIntersecting) { entry.target.classList.add('reveal-visible') observer.unobserve(entry.target) @@ -30,19 +30,20 @@ export const RevealFade: React.FC = props => { {children} - ) diff --git a/components/design/Section/SectionHeading.tsx b/components/design/Section/SectionHeading.tsx index b50a2b3..2a12bc7 100644 --- a/components/design/Section/SectionHeading.tsx +++ b/components/design/Section/SectionHeading.tsx @@ -3,8 +3,8 @@ import { forwardRef } from 'react' type SectionHeadingProps = React.ComponentPropsWithRef<'h2'> export const SectionHeading = forwardRef< -HTMLHeadingElement, -SectionHeadingProps + HTMLHeadingElement, + SectionHeadingProps >((props, ref) => { const { children, ...rest } = props diff --git a/components/design/ShadowContainer.tsx b/components/design/ShadowContainer.tsx index 863a7a7..43e5265 100644 --- a/components/design/ShadowContainer.tsx +++ b/components/design/ShadowContainer.tsx @@ -1,6 +1,6 @@ type ShadowContainerProps = React.ComponentPropsWithRef<'div'> -export const ShadowContainer: React.FC = props => { +export const ShadowContainer: React.FC = (props) => { const { children, className, ...rest } = props return ( diff --git a/components/design/Textarea.tsx b/components/design/Textarea.tsx index f71f776..eeb576e 100644 --- a/components/design/Textarea.tsx +++ b/components/design/Textarea.tsx @@ -16,22 +16,23 @@ export const Textarea = forwardRef(