fix: show ship name if the hull image can't be loaded (#144)

EVEShipFit · Jun 8, 2024 · 03ac963 · 03ac963
1 parent b94f722
commit 03ac963
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/src/components/ShipFit/Hull.tsx b/src/components/ShipFit/Hull.tsx
@@ -1,6 +1,7 @@
 import React from "react";
 
 import { useCurrentFit } from "@/providers/CurrentFitProvider";
+import { useEveData } from "@/providers/EveDataProvider";
 
 import styles from "./ShipFit.module.css";
 
@@ -9,8 +10,10 @@ export interface ShipFitProps {
 }
 
 export const Hull = () => {
+  const eveData = useEveData();
   const currentFit = useCurrentFit();
-  if (currentFit.currentFit === null) {
+
+  if (currentFit.currentFit === null || eveData === null) {
     return <></>;
   }
 
@@ -21,7 +24,10 @@ export const Hull = () => {
 
   return (
     <div className={styles.hull}>
-      <img src={`https://images.evetech.net/types/${shipTypeId}/render?size=1024`} />
+      <img
+        src={`https://images.evetech.net/types/${shipTypeId}/render?size=1024`}
+        alt={eveData.typeIDs[shipTypeId].name}
+      />
     </div>
   );
 };
diff --git a/src/components/ShipFit/ShipFit.module.css b/src/components/ShipFit/ShipFit.module.css
@@ -34,8 +34,11 @@
 }
 
 .hull > img {
+  align-items: center;
   border-radius: 50%;
+  display: flex;
   height: calc(100% - 2 * 3%);
+  justify-content: space-evenly;
   left: 3%;
   opacity: 0.8;
   position: relative;