From 6527c6d5f73fe843362bcc2a1913b8a51ae8a532 Mon Sep 17 00:00:00 2001
From: Tyler Hallada <tyler@hallada.net>
Date: Fri, 18 Mar 2022 23:41:06 -0400
Subject: [PATCH] Display parse errors on PluginDetail page

---
 components/PluginDetail.tsx    | 7 ++++++-
 styles/PluginDetail.module.css | 4 ++++
 2 files changed, 10 insertions(+), 1 deletion(-)
 create mode 100644 styles/PluginDetail.module.css

diff --git a/components/PluginDetail.tsx b/components/PluginDetail.tsx
index e773584..1498a04 100644
--- a/components/PluginDetail.tsx
+++ b/components/PluginDetail.tsx
@@ -11,7 +11,7 @@ import ModList from "./ModList";
 import CellList from "./CellList";
 import type { CellCoord } from "./ModData";
 import PluginData, { Plugin as PluginProps } from "./PluginData";
-import styles from "../styles/PluginData.module.css";
+import styles from "../styles/PluginDetail.module.css";
 import { jsonFetcher } from "../lib/api";
 
 const buildPluginProps = (
@@ -79,6 +79,11 @@ const PluginDetail: React.FC<Props> = ({ hash, counts }) => {
     <>
       <PluginData plugin={buildPluginProps(data, plugin)} counts={counts} />
       {data && <ModList mods={data.mods} files={data.files} counts={counts} />}
+      {plugin?.parseError && (
+        <div className={styles.error}>
+          {`Error parsing plugin: ${plugin.parseError}`}
+        </div>
+      )}
       <CellList
         cells={
           (plugin?.parsed?.cells.filter(
diff --git a/styles/PluginDetail.module.css b/styles/PluginDetail.module.css
new file mode 100644
index 0000000..eb3f380
--- /dev/null
+++ b/styles/PluginDetail.module.css
@@ -0,0 +1,4 @@
+.error {
+  color: red;
+  margin-top: 12px;
+}