import Head from "next/head"; import React from "react"; import useSWRImmutable from "swr/immutable"; import styles from "../styles/CellData.module.css"; import CellModList from "./CellModList"; import PluginList from "./PluginsList"; 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; updated_at: string; created_at: string; last_update_at: string; first_upload_at: string; last_updated_files_at: string; } export interface Cell { form_id: number; x: number; y: number; is_persistent: boolean; mods_count: number; files_count: number; plugins_count: number; mods: Mod[]; } const jsonFetcher = async (url: string): Promise => { const res = await fetch(url); if (!res.ok) { if (res.status === 404) { return null; } const error = new Error("An error occurred while fetching the data."); throw error; } return res.json(); }; type Props = { selectedCell: { x: number; y: number }; counts: Record | null; }; const CellData: React.FC = ({ selectedCell, counts }) => { const { data, error } = useSWRImmutable( `https://cells.modmapper.com/${selectedCell.x}/${selectedCell.y}.json`, jsonFetcher ); if (error && error.status === 404) { return
Cell has no mod edits.
; } else if (error) { return
{`Error loading cell data: ${error.message}`}
; } if (data === undefined) return
Loading...
; if (data === null) return
Cell has no edits.
; return ( selectedCell && ( <> {`Modmapper - Cell ${data.x}, ${data.y}`}
  • Form ID:{" "} {data.form_id.toString(16).padStart(8, "0")}
  • Mods that edit: {data.mods_count}
  • Files that edit: {data.files_count}
  • Plugins that edit:{" "} {data.plugins_count}

Loaded Plugins

) ); }; export default CellData;