From ba04fee0ece166e366f2e8688a0d90a998b591b6 Mon Sep 17 00:00:00 2001 From: alexis-opolka Date: Thu, 17 Aug 2023 20:48:22 +0200 Subject: [PATCH] Fixed Lint issues --- src/app/(portfolio)/(landing-page)/layout.tsx | 9 ------- src/app/(portfolio)/(landing-page)/page.tsx | 2 +- src/app/(portfolio)/about/layout.tsx | 9 ------- src/app/(portfolio)/settings/layout.tsx | 7 ------ src/app/(portfolio)/settings/page.tsx | 17 ++++++------- .../projects/[repository]/route.ts | 2 +- src/app/api/github-requests/projects/route.ts | 2 +- src/app/layout.tsx | 5 ++-- .../AboutComponents/Education/Education.tsx | 3 +-- .../AboutComponents/SkillCard/SkillCard.tsx | 3 +-- src/components/PortfolioHeader.tsx | 2 +- src/components/ThemeComponents.tsx | 8 +++--- .../ActionHandlersTypeGuards.tsx | 6 ++--- .../MessageApp/BardDiscussion.tsx | 25 ++++++++++--------- .../MessageApp/MessageAppInterfaces.ts | 3 ++- .../phoneComponents/PhoneContext.tsx | 8 ++---- .../PhoneStatus/NTPComponents.tsx | 9 +++---- .../phoneComponents/PhoneStatus/Network.tsx | 10 ++++---- src/components/wrappers/DevDebugWrappers.tsx | 7 +++--- src/components/wrappers/LinguiJSWrappers.tsx | 3 ++- src/components/wrappers/NoSSR.tsx | 1 + src/headers/themes.ts | 2 +- 22 files changed, 58 insertions(+), 85 deletions(-) diff --git a/src/app/(portfolio)/(landing-page)/layout.tsx b/src/app/(portfolio)/(landing-page)/layout.tsx index 94373c5..2cb4260 100644 --- a/src/app/(portfolio)/(landing-page)/layout.tsx +++ b/src/app/(portfolio)/(landing-page)/layout.tsx @@ -1,8 +1,5 @@ "use client" -// Stylesheets and Types imports -import type { Metadata } from 'next'; - // NextJS imports import { PageLayout, Box, Breadcrumbs } from "@primer/react"; @@ -11,12 +8,6 @@ import PortfolioHeader from "@/components/PortfolioHeader"; import PortfolioFooter from "@/components/PortfolioFooter"; -// Exports (Functions, Components, Variables/Constants) -const metadata: Metadata = { - title: 'Alexis Opolka Portfolio', - description: 'The website & portfolio of Alexis Opolka', -} - export default function RootLayout({ children, }: { diff --git a/src/app/(portfolio)/(landing-page)/page.tsx b/src/app/(portfolio)/(landing-page)/page.tsx index 09b7aa5..67257be 100644 --- a/src/app/(portfolio)/(landing-page)/page.tsx +++ b/src/app/(portfolio)/(landing-page)/page.tsx @@ -1,7 +1,7 @@ "use client" // NextJS Imports -import { Box, Heading, Text } from '@primer/react'; +import { Box, Heading } from '@primer/react'; // Intern Imports import PhoneComponent from '@/components/phoneComponents/PhoneComponent'; diff --git a/src/app/(portfolio)/about/layout.tsx b/src/app/(portfolio)/about/layout.tsx index 2344373..3f5fe04 100644 --- a/src/app/(portfolio)/about/layout.tsx +++ b/src/app/(portfolio)/about/layout.tsx @@ -1,8 +1,5 @@ "use client" -// Stylesheets and Types imports -import type { Metadata } from 'next'; - // NextJS imports import { PageLayout, Box, Breadcrumbs } from "@primer/react"; @@ -12,12 +9,6 @@ import PortfolioHeader from "@/components/PortfolioHeader"; import PortfolioFooter from "@/components/PortfolioFooter"; -// Exports (Functions, Components, Variables/Constants) -const metadata: Metadata = { - title: 'Alexis Opolka Portfolio', - description: 'The website & portfolio of Alexis Opolka', -} - export default function AboutLayout({ children, }: { diff --git a/src/app/(portfolio)/settings/layout.tsx b/src/app/(portfolio)/settings/layout.tsx index a917d52..8b3b5b8 100644 --- a/src/app/(portfolio)/settings/layout.tsx +++ b/src/app/(portfolio)/settings/layout.tsx @@ -1,8 +1,5 @@ "use client" -// Stylesheets and Types imports -import type { Metadata } from 'next'; - // NextJS imports import { PageLayout, Box, Breadcrumbs } from "@primer/react"; @@ -13,10 +10,6 @@ import PortfolioFooter from "@/components/PortfolioFooter"; // Exports (Functions, Components, Variables/Constants) -const metadata: Metadata = { - title: 'Alexis Opolka Portfolio', - description: 'The website & portfolio of Alexis Opolka', -} export default function SettingsLayout({ children, diff --git a/src/app/(portfolio)/settings/page.tsx b/src/app/(portfolio)/settings/page.tsx index 1ba352e..f02acd7 100644 --- a/src/app/(portfolio)/settings/page.tsx +++ b/src/app/(portfolio)/settings/page.tsx @@ -1,8 +1,8 @@ "use client" -import { Pagehead, Box, TabNav, Heading, Text } from "@primer/react"; +import { Pagehead, Box, TabNav, Heading } from "@primer/react"; import { useCallback, useState } from "react"; -import { useRouter, usePathname, useSearchParams } from "next/navigation"; +import { usePathname, useSearchParams } from "next/navigation"; import { BetterSystemStyleObject } from "@primer/react/lib/sx"; // Intern imports @@ -25,7 +25,6 @@ const panelStyle: BetterSystemStyleObject = { export default function SettingsPages() { - const router = useRouter() const pathname = usePathname() const searchParams = useSearchParams() @@ -93,7 +92,7 @@ export default function SettingsPages() { function DefaultPanel({ panelSetter }: { - panelSetter: Function + panelSetter: (panel: string) => void }){ panelSetter('default') @@ -108,7 +107,7 @@ function DefaultPanel({ function ProfilePanel({ panelSetter }: { - panelSetter: Function + panelSetter: (panel: string) => void }){ panelSetter('profile') @@ -123,7 +122,7 @@ function ProfilePanel({ function ThemePanel({ panelSetter }: { - panelSetter: Function + panelSetter: (panel: string) => void }){ @@ -135,14 +134,14 @@ function ThemePanel({ // of the themes (dynamically), and then we're going to map through // the array to display the themes in a 3x3 grid. - var themeArrayToDisplay = []; + const themeArrayToDisplay = []; if (themeSchemes.length%3 === 0){ - for (var i = 0; i < themeSchemes.length; i+=3){ + for (let i = 0; i < themeSchemes.length; i+=3){ themeArrayToDisplay.push([themeSchemes[i], themeSchemes[i+1], themeSchemes[i+2]]) } } else { - for (var i = 0; i < themeSchemes.length; i+=3){ + for (let i = 0; i < themeSchemes.length; i+=3){ if (i+2 < themeSchemes.length){ themeArrayToDisplay.push([themeSchemes[i], themeSchemes[i+1], themeSchemes[i+2]]) } else { diff --git a/src/app/api/github-requests/projects/[repository]/route.ts b/src/app/api/github-requests/projects/[repository]/route.ts index e6417d8..1a7cc49 100644 --- a/src/app/api/github-requests/projects/[repository]/route.ts +++ b/src/app/api/github-requests/projects/[repository]/route.ts @@ -39,7 +39,7 @@ export async function GET(request: NextRequest) { const repository = request.nextUrl.pathname.split("/")[request.nextUrl.pathname.split("/").length-1] - const res: ApolloQueryResult = await client + const res: ApolloQueryResult = await client .query({ query: gql` query { diff --git a/src/app/api/github-requests/projects/route.ts b/src/app/api/github-requests/projects/route.ts index 716fb1e..5dedaae 100644 --- a/src/app/api/github-requests/projects/route.ts +++ b/src/app/api/github-requests/projects/route.ts @@ -30,7 +30,7 @@ export const client = new ApolloClient({ }); export async function GET() { - const res: ApolloQueryResult = await client + const res: ApolloQueryResult = await client .query({ query: gql` query{ diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 87db633..c0b7fa3 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -7,7 +7,7 @@ import styles from "/public/stylesheets/master.module.css"; import { Inter } from 'next/font/google' import { I18nProvider } from "@lingui/react"; import { i18n } from '@lingui/core'; -import { useEffect, useState } from "react"; +import { useEffect } from "react"; // Intern Imports import NoSSR from "@/components/wrappers/NoSSR"; @@ -21,7 +21,7 @@ const inter = Inter({ subsets: ['latin'] }) // We set this variable to false as default // as it serves us to know if the `useEffect` hook // was called before rendering `I18nProvider` Component -var isDefaultLocaleSet = false; +let isDefaultLocaleSet = false; // Dynamically call translations inside a `useEffect` React hook const I18nApp = () => { useEffect(() => { @@ -31,6 +31,7 @@ const I18nApp = () => { isDefaultLocaleSet = true; }, []) } +I18nApp(); export default function RootLayout({children}:{children: React.ReactNode}){ diff --git a/src/components/AboutComponents/Education/Education.tsx b/src/components/AboutComponents/Education/Education.tsx index bb38dff..e89ab05 100644 --- a/src/components/AboutComponents/Education/Education.tsx +++ b/src/components/AboutComponents/Education/Education.tsx @@ -1,8 +1,7 @@ // NextJS Imports -import { Box, Link, Heading, Timeline, Octicon, Text } from "@primer/react"; +import { Box, Timeline, Octicon, Text } from "@primer/react"; import { BetterSystemStyleObject } from "@primer/react/lib/sx"; import {FlameIcon} from "@primer/octicons-react"; -import styles from "@/sass/master.module.sass"; export default function AboutMyEducation(){ diff --git a/src/components/AboutComponents/SkillCard/SkillCard.tsx b/src/components/AboutComponents/SkillCard/SkillCard.tsx index 3c6e4c7..4aed3eb 100644 --- a/src/components/AboutComponents/SkillCard/SkillCard.tsx +++ b/src/components/AboutComponents/SkillCard/SkillCard.tsx @@ -6,7 +6,6 @@ import { useEffect, useState } from "react"; // Intern Imports import { ProjectsInterface, LibraryInterface } from "../interfaces"; -import styles from "@/sass/master.module.sass"; import githubLinguist from '../libs/github-linguist.yaml'; // <-- Should produce an error (or at least a warning) because it can't find its module or type declaractions @@ -257,7 +256,7 @@ function ShowGithubRepositoryRelatedToSkill({ - {repository.languages.edges.map((languageNode: any, nodeID: number) => { + {repository.languages.edges.map((languageNode: {size: number, node: {color: string}}, nodeID: number) => { // We're creating the language programming bar you can see on GitHub. // It is, for me, quite common and typical of a git repository to have diff --git a/src/components/PortfolioHeader.tsx b/src/components/PortfolioHeader.tsx index 29608f8..be17ea2 100644 --- a/src/components/PortfolioHeader.tsx +++ b/src/components/PortfolioHeader.tsx @@ -1,6 +1,6 @@ // NextJS Imports -import { Header, Avatar, Select, FormControl, Text, Box, Octicon, Button } from "@primer/react"; +import { Header, Octicon, Button } from "@primer/react"; import { GearIcon } from "@primer/octicons-react"; // Intern Imports diff --git a/src/components/ThemeComponents.tsx b/src/components/ThemeComponents.tsx index 2c9ee69..e89cf24 100644 --- a/src/components/ThemeComponents.tsx +++ b/src/components/ThemeComponents.tsx @@ -64,7 +64,7 @@ export const themeSchemes: { export function ThemeToggleButton() { const { setDayScheme, setNightScheme, setColorMode, colorMode } = useTheme(); - var defaultColorValue; + let defaultColorValue; // As the `colorMode` can be changed, the default value // should also change. @@ -102,8 +102,8 @@ export function ThemeToggleButton() { setCurrentPrimerTheme(0); setSchemesValue(0) - }; - }; + } + } function setSchemesValue(newColorMode: IndexKind){ setDayScheme(themeSchemes[newColorMode].value); @@ -117,7 +117,7 @@ export function ThemeToggleButton() { ) } -export function ThemePreview({scheme}: {scheme: any}){ +export function ThemePreview({scheme}: {scheme: {value: string, name: string, icon: Icon}}){ const themePreviewStyle: BetterSystemStyleObject = { display: "flex", diff --git a/src/components/phoneComponents/MessageApp/ActionsHandlers/ActionHandlersTypeGuards.tsx b/src/components/phoneComponents/MessageApp/ActionsHandlers/ActionHandlersTypeGuards.tsx index f578c56..1d28f4a 100644 --- a/src/components/phoneComponents/MessageApp/ActionsHandlers/ActionHandlersTypeGuards.tsx +++ b/src/components/phoneComponents/MessageApp/ActionsHandlers/ActionHandlersTypeGuards.tsx @@ -28,7 +28,7 @@ export function isStartReplaceMessageAction(action: MessageAppInterfaces.Discuss action is { type: "replaceMessage", target: Array, - content: any + content: never } { return action.type === "replaceMessage" && action.content && Array.isArray(action.target); } @@ -37,8 +37,8 @@ export function isStartReplaceMessageAction(action: MessageAppInterfaces.Discuss export function isSetStatefulVariableAction( action: MessageAppInterfaces.DiscussionChoicesActions ): action is { type: "setStatefulVariable"; - variableSetter: Function; - value: any + variableSetter: never; + value: never; } { return action.type === "setStatefulVariable" && typeof action.variableSetter === "function"; } \ No newline at end of file diff --git a/src/components/phoneComponents/MessageApp/BardDiscussion.tsx b/src/components/phoneComponents/MessageApp/BardDiscussion.tsx index f133d27..932b27c 100644 --- a/src/components/phoneComponents/MessageApp/BardDiscussion.tsx +++ b/src/components/phoneComponents/MessageApp/BardDiscussion.tsx @@ -1,11 +1,12 @@ +/* eslint-disable @typescript-eslint/no-unused-vars */ +/* eslint-disable @typescript-eslint/no-explicit-any */ "use client" -import React, { useState, useEffect, useRef } from "react"; -import { StaticImageData } from "next/image"; +import React, { useState } from "react"; import { Box } from "@primer/react"; import { BetterSystemStyleObject } from "@primer/react/lib/sx"; import { useRouter } from "next/navigation"; -import { DiscussionPlayer, DiscussionChoicesInterface, DiscussionMessageInterface, DiscussionChoicesOptions, DiscussionChoicesActions, DiscussionChoicesStatefulVariableActions, DiscussionChoicesStartActions } from "./MessageAppInterfaces"; +import { DiscussionChoicesInterface, DiscussionMessageInterface, DiscussionChoicesOptions, DiscussionChoicesActions, DiscussionChoicesStatefulVariableActions, DiscussionChoicesStartActions } from "./MessageAppInterfaces"; import { isReplaceMessageAction, allowedChoiceActions} from "./ActionsHandlers"; import { messageChoices } from "./MessageChoices"; @@ -39,7 +40,7 @@ export default function BardDiscussion(props: any){ {choiceContent} ) - }; + } // The `renderMessage` function is the function that is used to render both // the messages and the choices using loops and conditions. @@ -103,7 +104,7 @@ export default function BardDiscussion(props: any){ ); - }; + } // The router is used to navigate to pages const nextRouter = useRouter(); @@ -129,7 +130,7 @@ export default function BardDiscussion(props: any){ function addMessageToHistory(message: DiscussionMessageInterface){ setMessageHistory([...messageHistory, message]); - }; + } // The `handleClick` function is the default handler for the choices and their actions function handleClick(event: any){ @@ -138,7 +139,7 @@ export default function BardDiscussion(props: any){ if (!allowedChoiceActions.includes(action.type)) { console.error(`The action "${action.type}" is not allowed!`); return false; - }; + } if (action.type === "goToChoiceIndex") { if (typeof action.target === "number"){ @@ -166,7 +167,7 @@ export default function BardDiscussion(props: any){ console.error("The target of the action is not a number!"); } } else if (action.type === "displayMessage") { - var message; + let message; if (type === "startAction"){ message = action.content; @@ -183,7 +184,7 @@ export default function BardDiscussion(props: any){ } else { console.error(`The action "${action.type}" is not implemented!`); } - }; + } const selectedChoice = event.target.textContent; @@ -195,12 +196,12 @@ export default function BardDiscussion(props: any){ setShowChoices(true); } - for (var i = 0; i < messages[currentIndex].options[selectedChoiceIndex].actions.length; i++) { + for (let i = 0; i < messages[currentIndex].options[selectedChoiceIndex].actions.length; i++) { const action: (DiscussionChoicesActions | DiscussionChoicesStatefulVariableActions) = messages[currentIndex].options[selectedChoiceIndex].actions[i]; ActionsHandler(action, "choiceAction"); } - }; + } return renderMessage(); -}; \ No newline at end of file +} \ No newline at end of file diff --git a/src/components/phoneComponents/MessageApp/MessageAppInterfaces.ts b/src/components/phoneComponents/MessageApp/MessageAppInterfaces.ts index 4eb5594..4038439 100644 --- a/src/components/phoneComponents/MessageApp/MessageAppInterfaces.ts +++ b/src/components/phoneComponents/MessageApp/MessageAppInterfaces.ts @@ -1,3 +1,4 @@ +/* eslint-disable @typescript-eslint/no-explicit-any */ import { StaticImageData } from "next/image"; // Interface Definition @@ -88,7 +89,7 @@ export interface DiscussionChoicesActions extends DiscussionBaseInterface { export interface DiscussionChoicesStatefulVariableActions extends DiscussionChoicesActions { value: any, - variableSetter: Function, + variableSetter: never, } // We define an extension of the base interface for the choice actions diff --git a/src/components/phoneComponents/PhoneContext.tsx b/src/components/phoneComponents/PhoneContext.tsx index 19518b5..99879c7 100644 --- a/src/components/phoneComponents/PhoneContext.tsx +++ b/src/components/phoneComponents/PhoneContext.tsx @@ -1,5 +1,5 @@ // NextJS Imports -import { Box, Text } from "@primer/react"; +import { Box } from "@primer/react"; import type { BetterSystemStyleObject } from "@primer/react/lib/sx"; import {MdKeyboardArrowLeft, MdOutlineHome, MdMenu} from "react-icons/md"; @@ -16,11 +16,7 @@ import MessageAppWrapper from "@/components/phoneComponents/MessageApp/MessageWr * This is the function that exports the PhoneContext Component. * @returns Test */ -export default function PhoneContext({ - sx -}: { - sx?: BetterSystemStyleObject -}){ +export default function PhoneContext(){ // This component doesn't take any arguments (apart from sx) but wraps all he returns // in the PhoneContextManager Component which is in charge of supervising // the state of the "game" the player is at on the website. diff --git a/src/components/phoneComponents/PhoneStatus/NTPComponents.tsx b/src/components/phoneComponents/PhoneStatus/NTPComponents.tsx index 5a37d85..9d357a8 100644 --- a/src/components/phoneComponents/PhoneStatus/NTPComponents.tsx +++ b/src/components/phoneComponents/PhoneStatus/NTPComponents.tsx @@ -7,20 +7,19 @@ export default function NTPLocalTime(){ // it would appear on an android phone // i.e: HH:MM - var defaultDate = new Date(); + const defaultDate = new Date(); const [currentDisplayableTime, setDisplayableTime] = useState(`${defaultDate.getHours()}:${defaultDate.getMinutes()}`); useEffect(() => { function updateCurrentTime(){ const currentTime = new Date(); - var currentHour, currentMinutes; - currentHour = currentTime.getHours(); - currentMinutes = currentTime.getMinutes(); + const currentHour = currentTime.getHours(); + const currentMinutes = currentTime.getMinutes(); setDisplayableTime(`${currentHour}:${currentMinutes}`); console.log("Current Time updated!"); - }; + } // We update the current time every 15s (or 1/4 of a minute) // to have a low latency on update time but to not take a lot diff --git a/src/components/phoneComponents/PhoneStatus/Network.tsx b/src/components/phoneComponents/PhoneStatus/Network.tsx index 92c5044..39fdeca 100644 --- a/src/components/phoneComponents/PhoneStatus/Network.tsx +++ b/src/components/phoneComponents/PhoneStatus/Network.tsx @@ -1,7 +1,8 @@ +/* eslint-disable @typescript-eslint/no-explicit-any */ +/* eslint-disable @typescript-eslint/no-unused-vars */ import { Box, Text } from '@primer/react'; -import { useState, useEffect } from 'react'; +import { useState } from 'react'; import { MdWifiOff, MdNetworkWifi, MdNetworkWifi1Bar, MdNetworkWifi3Bar, MdOutlineSignalCellularAlt } from 'react-icons/md'; -import IconsToShow from '@/components/wrappers/Icons'; export default function NetworkStatus({ connectivity, @@ -16,7 +17,7 @@ export default function NetworkStatus({ // Let's start assuming we have a network connection. const [netStatus, setNetStatus] = useState(true); - var connectionIcon; + let connectionIcon; // Let's make changes, if necessary // connected? setNetStatus(connected) : setNetStatus(true); @@ -29,7 +30,7 @@ export default function NetworkStatus({ connectionIcon = ; } else { connectionIcon = ; - }; + } return( ${locale}`); dynamicLoadNActivateLocale(locale); - }; + } // type ReactMouseEvent; diff --git a/src/components/wrappers/NoSSR.tsx b/src/components/wrappers/NoSSR.tsx index 9c0a372..cc8366e 100644 --- a/src/components/wrappers/NoSSR.tsx +++ b/src/components/wrappers/NoSSR.tsx @@ -7,6 +7,7 @@ import dynamic from 'next/dynamic'; import React from 'react'; +// eslint-disable-next-line @typescript-eslint/no-explicit-any const NoSSR = (props: any) => ( {props.children} ) diff --git a/src/headers/themes.ts b/src/headers/themes.ts index 89a4280..b25da0e 100644 --- a/src/headers/themes.ts +++ b/src/headers/themes.ts @@ -13,5 +13,5 @@ export default function ToggleTheme(){ } else { setColorMode("dark"); setCurrentPrimerTheme("dark"); - }; + } }