Merge pull request #48 from alexis-opolka/develop

Fixed Lint issues

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,
 }: {

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';

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,
 }: {

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,

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 {

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<any> = await client
+  const res: ApolloQueryResult<never> = await client
     .query({
       query: gql`
         query {

src/app/api/github-requests/projects/route.ts

@@ -30,7 +30,7 @@ export const client = new ApolloClient({
 });
 
 export async function GET() {
-  const res: ApolloQueryResult<any> = await client
+  const res: ApolloQueryResult<never> = await client
     .query({
       query: gql`
         query{

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}){
 

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(){
 

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({
                         </Box>
 
                         <ProgressBar sx={{width: "60%", margin: 1}}>
-                            {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

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

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",

src/components/phoneComponents/MessageApp/ActionsHandlers/ActionHandlersTypeGuards.tsx

@@ -28,7 +28,7 @@ export function isStartReplaceMessageAction(action: MessageAppInterfaces.Discuss
   action is {
     type: "replaceMessage",
     target: Array<number>,
-    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";
 }

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}
       </Box>
     )
-  };
+  }
 
   // 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){
         </Box>
       </Box>
     );
-  };
+  }
 
   // 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();
-};
+}

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

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.