import { format } from "date-fns"; import Head from "next/head"; import React, { useEffect } from "react"; import useSWRImmutable from "swr/immutable"; import CellList from "./CellList"; import styles from "../styles/ModData.module.css"; import { jsonFetcher } from "../lib/api"; export interface CellCoord { x: number; y: number; } export interface Mod { id: number; name: string; nexus_mod_id: number; author_name: string; author_id: number; category_name: string; category_id: number; description: string; thumbnail_link: string; game_id: number; is_translation: boolean; updated_at: string; created_at: string; last_update_at: string; first_upload_at: string; last_updated_files_at: string; cells: CellCoord[]; } export const NEXUS_MODS_URL = "https://www.nexusmods.com/skyrimspecialedition"; type Props = { selectedMod: number; counts: Record | null; setSelectedCells: (cells: { x: number; y: number }[] | null) => void; }; const ModData: React.FC = ({ selectedMod, counts, setSelectedCells, }) => { const { data, error } = useSWRImmutable( `https://mods.modmapper.com/${selectedMod}.json`, (_) => jsonFetcher(_) ); useEffect(() => { if (data) setSelectedCells(data.cells); }, [data, setSelectedCells]); if (error && error.status === 404) { return
Mod could not be found.
; } else if (error) { return
{`Error loading mod data: ${error.message}`}
; } if (data === undefined) return
Loading...
; if (data === null) return
Mod could not be found.
; let numberFmt = new Intl.NumberFormat("en-US"); const modCounts = counts && counts[data.nexus_mod_id]; const total_downloads = modCounts ? modCounts[0] : 0; const unique_downloads = modCounts ? modCounts[1] : 0; const views = modCounts ? modCounts[2] : 0; if (selectedMod && data) { return ( <> {`Modmapper - ${data.name}`}

{data.name}

Category:  {data.category_name} {data.is_translation &&  (translation)}
Author:  {data.author_name}
Uploaded:{" "} {format(new Date(data.first_upload_at), "d MMM y")}
Last Update:{" "} {format(new Date(data.last_update_at), "d MMM y")}
Total Downloads: {numberFmt.format(total_downloads)}
Unique Downloads:{" "} {numberFmt.format(unique_downloads)}
); } return null; }; export default ModData;