feat: added comparator diff in Collapsable

Author: KoolTheba

src/components/Collapsable.tsx

@@ -1,19 +1,30 @@
+import { ComparatorDiff } from "./ComparatorDiff";
 import "../styles/Collapsable.css";
 
-const Collapsible = ({ details }: any) => {
+const Collapsible = (props: any) => {
   return (
     <>
       <details>
         <summary>Details</summary>
         <div className="details__wrapper content">
           <ul>
-            {details.map((el: string, i: number) => (
-              <li key={i}>{el}</li>
-            ))}
+            {props.details.map((el: string, i: number) =>
+              props.prevDetails && props.prevDetails[i] ? (
+                <li key={i}>
+                  <ComparatorDiff
+                    previous={props.prevDetails[i]}
+                    current={el}
+                  />
+                </li>
+              ) : (
+                <li key={i}>{el}</li>
+              ),
+            )}
           </ul>
         </div>
       </details>
     </>
   );
 };
+
 export default Collapsible;