From 5655931d5bbe4883962b49150b6ab59af77e92c9 Mon Sep 17 00:00:00 2001
From: Riley Abrahamson <32375220+RileyAbr@users.noreply.github.com>
Date: Thu, 7 Nov 2024 16:24:09 -0800
Subject: [PATCH] Fix eslint issues

---
 wally-registry-frontend/.eslintrc.json        |  4 +-
 wally-registry-frontend/next.config.ts        |  1 +
 wally-registry-frontend/src/app/layout.tsx    |  5 ---
 .../[packageScope]/[packageName]/page.tsx     | 11 ++---
 .../src/components/Header.tsx                 |  5 ++-
 .../src/components/Img.tsx                    | 40 -------------------
 .../src/components/PackageTag.tsx             |  3 ++
 wally-registry-frontend/src/lib/registry.tsx  | 14 +------
 .../src/services/wally.api.ts                 | 12 ++++--
 9 files changed, 26 insertions(+), 69 deletions(-)
 delete mode 100644 wally-registry-frontend/src/components/Img.tsx

diff --git a/wally-registry-frontend/.eslintrc.json b/wally-registry-frontend/.eslintrc.json
index daa2c20..8227bc1 100644
--- a/wally-registry-frontend/.eslintrc.json
+++ b/wally-registry-frontend/.eslintrc.json
@@ -3,10 +3,10 @@
   "extends": [
     "next/core-web-vitals",
     "next/typescript",
-    "plugin:jsx-a11y/strict "
+    "plugin:jsx-a11y/strict"
   ],
   "rules": {
-    "no-constant-condition": ["error", { "checkLoops": "all" }],
+    "no-constant-condition": ["error", { "checkLoops": true }],
     "no-unused-vars": 0,
     "no-console": 2
   }
diff --git a/wally-registry-frontend/next.config.ts b/wally-registry-frontend/next.config.ts
index 02a795f..37ac0e8 100644
--- a/wally-registry-frontend/next.config.ts
+++ b/wally-registry-frontend/next.config.ts
@@ -2,6 +2,7 @@ import createMDX from "@next/mdx"
 import type { NextConfig } from "next"
 
 const nextConfig: NextConfig = {
+  output: "export",
   pageExtensions: ["js", "jsx", "md", "mdx", "ts", "tsx"],
   compiler: {
     styledComponents: true,
diff --git a/wally-registry-frontend/src/app/layout.tsx b/wally-registry-frontend/src/app/layout.tsx
index 626760c..1a7ccf8 100644
--- a/wally-registry-frontend/src/app/layout.tsx
+++ b/wally-registry-frontend/src/app/layout.tsx
@@ -59,11 +59,6 @@ const iosevka = localFont({
   fallback: ["Hack", "Consolas", "monospace"],
 })
 
-const iconFont = localFont({
-  src: "./fonts/icons.woff2",
-  display: "block",
-})
-
 export default function RootLayout({
   children,
 }: Readonly<{
diff --git a/wally-registry-frontend/src/app/package/[packageScope]/[packageName]/page.tsx b/wally-registry-frontend/src/app/package/[packageScope]/[packageName]/page.tsx
index 4ddb43d..666d895 100644
--- a/wally-registry-frontend/src/app/package/[packageScope]/[packageName]/page.tsx
+++ b/wally-registry-frontend/src/app/package/[packageScope]/[packageName]/page.tsx
@@ -176,10 +176,10 @@ const MetaItem = ({
 }
 
 const DependencyLink = ({ packageInfo }: { packageInfo: string }) => {
-  let packageMatch = packageInfo.match(/(.+\/.+)@[^\d]+([\d.]+)/)
+  const packageMatch = packageInfo.match(/(.+\/.+)@[^\d]+([\d.]+)/)
   if (packageMatch != null) {
-    let name = packageMatch[1]
-    let version = packageMatch[2]
+    const name = packageMatch[1]
+    const version = packageMatch[2]
     return (
       <DependencyLinkWrapper>
         <DependencyLinkItem href={`/package/${name}?version=${version}`}>
@@ -305,6 +305,7 @@ export default function Package() {
 
   useEffect(() => {
     loadPackageData(packageScope, packageName)
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [packageScope, packageName])
 
   if (!isLoaded) {
@@ -338,8 +339,8 @@ export default function Package() {
           <Heading>{packageName}</Heading>
 
           <Paragraph>
-            Couldn't find {capitalize(packageName)} version {packageVersion}.
-            Are you sure that's a valid version?
+            Couldn&apos;t find {capitalize(packageName)} version{" "}
+            {packageVersion}. Are you sure that&apos;s a valid version?
           </Paragraph>
 
           <Button
diff --git a/wally-registry-frontend/src/components/Header.tsx b/wally-registry-frontend/src/components/Header.tsx
index ad023ed..89f3ae4 100644
--- a/wally-registry-frontend/src/components/Header.tsx
+++ b/wally-registry-frontend/src/components/Header.tsx
@@ -188,7 +188,7 @@ const StyledNav = styled.nav`
   }
 `
 
-const StyledNavLink = styled<any>(Link)`
+const StyledNavLink = styled(Link)<{ $active: boolean }>`
   color: ${(props) => (props.$active ? "var(--wally-red)" : "inherit")};
 
   &:hover {
@@ -261,6 +261,7 @@ const MobilePushDown = styled.div`
   }
 `
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 const reactSelectSearchTheme = (theme: any) => ({
   ...theme,
   colors: {
@@ -271,6 +272,7 @@ const reactSelectSearchTheme = (theme: any) => ({
 })
 
 const reactSelectSearchStyles = {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   container: (provided: any) => ({
     ...provided,
     flexGrow: 2,
@@ -279,6 +281,7 @@ const reactSelectSearchStyles = {
       margin: "0 0.5rem 0.5rem",
     },
   }),
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   control: (provided: any) => ({
     ...provided,
     borderRadius: "var(--radius-small)",
diff --git a/wally-registry-frontend/src/components/Img.tsx b/wally-registry-frontend/src/components/Img.tsx
deleted file mode 100644
index f8b64b1..0000000
--- a/wally-registry-frontend/src/components/Img.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import styled from "styled-components"
-
-declare const process: any
-
-export default function Img({
-  src,
-  className,
-  ...rest
-}: {
-  src: string
-  className?: string
-  [index: string]: any
-}) {
-  if (src.endsWith(".png") && process.env.NODE_ENV === "production") {
-    const fileName = src.substr(0, src.length - 4)
-    return (
-      <picture>
-        <source srcSet={fileName + ".avif"} type="image/avif" />
-        <source srcSet={fileName + ".webp"} type="image/webp" />
-        <img src={src} {...rest} className={className} />
-      </picture>
-    )
-  } else {
-    return (
-      <picture>
-        <img src={src} {...rest} className={className} />
-      </picture>
-    )
-  }
-}
-
-export const BgImg = styled(Img)<{ align?: string }>`
-  pointer-events: none;
-  width: 100%;
-  height: 100%;
-  z-index: -1;
-  object-fit: cover;
-  object-position: ${(props) => props.align ?? "center"};
-  position: absolute;
-`
diff --git a/wally-registry-frontend/src/components/PackageTag.tsx b/wally-registry-frontend/src/components/PackageTag.tsx
index ed29784..fe02630 100644
--- a/wally-registry-frontend/src/components/PackageTag.tsx
+++ b/wally-registry-frontend/src/components/PackageTag.tsx
@@ -140,6 +140,7 @@ const BottomRow = styled.div`
   margin: 0.2rem 0.5rem 0.3rem 0.5rem;
 `
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const Author = styled.span`
   color: rgba(255, 255, 255, 0.7);
   font-size: 0.8rem;
@@ -156,6 +157,7 @@ export default function PackageBlip({
   children,
   title,
   version,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   uniqueId,
   className,
   linkTo,
@@ -173,6 +175,7 @@ export default function PackageBlip({
   linkTo?: string
   inset?: boolean
 }) {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const Component: React.FC<any> = linkTo ? LinkBlip : StyledBlip
 
   return (
diff --git a/wally-registry-frontend/src/lib/registry.tsx b/wally-registry-frontend/src/lib/registry.tsx
index 9ab1bee..1f2b9ce 100644
--- a/wally-registry-frontend/src/lib/registry.tsx
+++ b/wally-registry-frontend/src/lib/registry.tsx
@@ -1,20 +1,9 @@
 "use client"
 
-import isPropValid from "@emotion/is-prop-valid"
 import { useServerInsertedHTML } from "next/navigation"
 import React, { useState } from "react"
 import { ServerStyleSheet, StyleSheetManager } from "styled-components"
 
-// This implements the default behavior from styled-components v5
-function shouldForwardProp(propName: string, target: any) {
-  if (typeof target === "string") {
-    // For HTML elements, forward the prop if it is a valid HTML attribute
-    return isPropValid(propName)
-  }
-  // For other elements, forward all props
-  return true
-}
-
 export default function StyledComponentsRegistry({
   children,
 }: {
@@ -35,7 +24,8 @@ export default function StyledComponentsRegistry({
   return (
     <StyleSheetManager
       sheet={styledComponentsStyleSheet.instance}
-      //   shouldForwardProp={shouldForwardProp}
+      //   shouldForwardProp={shouldForwardProp} If there are many styled-components collision issues, a shouldForwardProp function can be added to solve some v5 migration problems.
+      // https://styled-components.com/docs/api#shouldforwardprop
     >
       {children}
     </StyleSheetManager>
diff --git a/wally-registry-frontend/src/services/wally.api.ts b/wally-registry-frontend/src/services/wally.api.ts
index 3539676..f5264d3 100644
--- a/wally-registry-frontend/src/services/wally.api.ts
+++ b/wally-registry-frontend/src/services/wally.api.ts
@@ -1,5 +1,3 @@
-import { WallyPackageBrief, WallyPackageMetadata } from "../types/wally"
-
 const wallyApiBaseUrl = `${process.env.NEXT_PUBLIC_WALLY_API_URL}/v1`
 // API/v1/package-search?query=<query>
 const wallyApiSearchUrl = `${wallyApiBaseUrl}/package-search`
@@ -28,7 +26,10 @@ export async function getWallyPackages(searchQuery: string | null) {
         return response.json()
       })
       .then((data) => data)
-      .catch((error) => {})
+      .catch((error) => {
+        // eslint-disable-next-line no-console
+        console.error(error)
+      })
   } else {
     return []
   }
@@ -52,7 +53,10 @@ export async function getWallyPackageMetadata(
       return response.json()
     })
     .then((data) => data)
-    .catch((error) => {})
+    .catch((error) => {
+      // eslint-disable-next-line no-console
+      console.error(error)
+    })
 }
 
 /**