Remove remote images

Author: Tibowl

next.config.js

@@ -3,7 +3,6 @@
 module.exports = {
   reactStrictMode: true,
   images: {
-    domains: ["cdn.discordapp.com", "discord.com", "i.imgur.com"],
     minimumCacheTTL: 3600
   },
   poweredByHeader: false,

pages/characters/[char].tsx

@@ -12,7 +12,7 @@ import { MaterialCost, MaterialImage } from "../../components/Material"
 import YouTube from "../../components/YouTube"
 import { CharacterCurves, CostTemplates, getCharacterCurves, getCharacters, getCostTemplates } from "../../utils/data-cache"
 import { Character, CharacterFull, Constellation, CostTemplate, CurveEnum, Meta, Passive, Skill, Skills, TalentTable, TalentValue } from "../../utils/types"
-import { elements, ElementType, getCharStatsAt, getCostsFromTemplate, getGuidesFor, getLinkToGuide, getStarColor, image, isFullCharacter, isValueTable, stat, urlify, weapons } from "../../utils/utils"
+import { elements, ElementType, getCharStatsAt, getCostsFromTemplate, getGuidesFor, getLinkToGuide, getStarColor, isFullCharacter, isValueTable, stat, urlify, weapons } from "../../utils/utils"
 import styles from "../style.module.css"
 
 interface Props {
@@ -52,12 +52,12 @@ export default function CharacterWebpage({ char, location, characterCurves, cost
         {char.ascensionCosts && costTemplates && <TOC href="#ascensions" title="Ascensions" />}
         {char.meta && <TOC href="#meta" title="Meta" />}
         {char.media.videos && <TOC href="#videos" title={Object.keys(char.media.videos).length > 1 ? "Videos" : "Video"} />}
-        {char.skills && char.skills.map((s, i) => (<>
+        {char.skills && char.skills.map((s, i) => (<span key={i}>
           {multiskill && <div>{s.ult?.type ?? `Skillset #${i}`}</div>}
           {s.talents && <TOC depth={multiskill ? 1 : 0} href={`#talents${i > 0 ? `-${i}` : ""}`} title="Talents" />}
           {s.passive && <TOC depth={multiskill ? 1 : 0} href={`#passive${i > 0 ? `-${i}` : ""}`} title="Passives" />}
           {s.constellations && <TOC depth={multiskill ? 1 : 0} href={`#const${i > 0 ? `-${i}` : ""}`} title="Constellations" />}
-        </>))}
+        </span>))}
       </div>
 
       <div className="grid grid-flow-col justify-start">

pages/reminders.tsx

@@ -1,11 +1,10 @@
 import { GetServerSideProps } from "next"
-import { DiscordUser, Reminder } from "../utils/types"
-import { parseUser } from "../utils/parse-user"
-import Main from "../components/Main"
 import Head from "next/head"
+import { Component } from "react"
+import Main from "../components/Main"
 import { config } from "../utils/config"
-import { Component, useState } from "react"
-import Image from "next/image"
+import { parseUser } from "../utils/parse-user"
+import { DiscordUser, Reminder } from "../utils/types"
 
 interface Props {
   user: DiscordUser
@@ -64,7 +63,8 @@ function ReminderCard({ r, onDelete }: { r: Reminder, onDelete: () => void }) {
 }
 
 function DiscordAvatar({ user }: { user: DiscordUser }) {
-  return <Image
+  // eslint-disable-next-line @next/next/no-img-element
+  return <img
     src={user.avatar ? `https://cdn.discordapp.com/avatars/${user.id}/${user.avatar}.webp?size=16` : "https://discord.com/assets/1f0bfc0865d324c2587920a7d80c609b.png"}
     alt="Discord avatar"
     width={16}