From 7a58cb2fcbaec0ba314bf030ffdc121a021e3bf9 Mon Sep 17 00:00:00 2001
From: George Sproston <gsproston@scottlogic.com>
Date: Tue, 8 Aug 2023 10:42:15 +0100
Subject: [PATCH] TypeScript AttackBox

---
 .../components/AttackBox/{AttackBox.jsx => AttackBox.tsx}  | 0
 .../AttackBox/{AttackMechanism.jsx => AttackMechanism.tsx} | 7 ++++---
 2 files changed, 4 insertions(+), 3 deletions(-)
 rename frontend/src/components/AttackBox/{AttackBox.jsx => AttackBox.tsx} (100%)
 rename frontend/src/components/AttackBox/{AttackMechanism.jsx => AttackMechanism.tsx} (75%)

diff --git a/frontend/src/components/AttackBox/AttackBox.jsx b/frontend/src/components/AttackBox/AttackBox.tsx
similarity index 100%
rename from frontend/src/components/AttackBox/AttackBox.jsx
rename to frontend/src/components/AttackBox/AttackBox.tsx
diff --git a/frontend/src/components/AttackBox/AttackMechanism.jsx b/frontend/src/components/AttackBox/AttackMechanism.tsx
similarity index 75%
rename from frontend/src/components/AttackBox/AttackMechanism.jsx
rename to frontend/src/components/AttackBox/AttackMechanism.tsx
index 2fc8b12ce..5cba1e7a6 100644
--- a/frontend/src/components/AttackBox/AttackMechanism.jsx
+++ b/frontend/src/components/AttackBox/AttackMechanism.tsx
@@ -1,14 +1,15 @@
+import { AttackInfo } from "../../models/attack";
 import "../StrategyBox/StrategyMechanism.css";
 import React from "react";
 
-function DefenceMechanism(props) {
+function DefenceMechanism({ attack }: { attack: AttackInfo }) {
   const [isInfoBoxVisible, setIsInfoBoxVisible] = React.useState(false);
 
   return (
     <span>
       <div className="strategy-mechanism">
         <div className="strategy-mechanism-header">
-          <span>{props.attack.name}</span>
+          <span>{attack.name}</span>
           <span
             className="strategy-mechanism-info"
             onMouseOver={() => {
@@ -22,7 +23,7 @@ function DefenceMechanism(props) {
           </span>
         </div>
         {isInfoBoxVisible ? (
-          <div className="strategy-mechanism-info-box">{props.attack.info}</div>
+          <div className="strategy-mechanism-info-box">{attack.info}</div>
         ) : null}
       </div>
     </span>