front: pull project data from JSON

1 files changed, 9 insertions, 32 deletions

diff --git a/front/src/pages/projects.tsx b/front/src/pages/projects.tsx
index 4e64704..ed68529 100644
--- a/front/src/pages/projects.tsx
+++ b/front/src/pages/projects.tsx
@@ -1,5 +1,7 @@
-import './projects.css';
-import Carousel from '../components/carousel';
+import { Project, ProjectDescriptor } from '../components/project';
+import projectsJson from '../data/projects.json';
+
+const projects: ProjectDescriptor[] = projectsJson as ProjectDescriptor[];
 
 export default function Projects() {
   return (
@@ -14,36 +16,11 @@ export default function Projects() {
       </div>
 
       <div class="projects-container">
-
-        <div class="project">
-          <div class="project-title"><a href="https://spiritmod.fandom.com/wiki/Spirit_Mod_Wiki">Spirit Mod</a></div>
-          <div class="project-info">
-            <div class="icon-row">
-              <div class="icon-text">Made using</div>
-              <div class="icon-container">
-                <img class="grow icon" src="./assets/images/csharp.png" />
-              </div>
-            </div>
-            <div class="icon-row">
-              <div class="icon-text">Available on</div>
-              <div class="icon-container">
-                <img class="grow icon" src="./assets/images/windows.png" />
-              </div>
-            </div>
-            <hr />
-            <div class="project-description">
-              The Spirit Mod is one of the largest mods for Terraria: with more than 1300 items, 8 bosses, and
-              hundreds of enemies, as well as 3 new events and 3 brand new biomes, the mod has a lot to offer.
-              <br />
-              I had the privilege of contributing some system code, mainly the "Stargoop" system.
-            </div>
-          </div>
-          <Carousel>
-            <img class="project-image-gallery-item" src="assets/projects/spirit-mod/Thumbnail.png" />
-            <img class="project-image-gallery-item" src="assets/projects/spirit-mod/Demo1.gif" />
-            <img class="project-image-gallery-item" src="assets/projects/spirit-mod/Demo2.gif" />
-          </Carousel>
-        </div>
+        {
+          projects.map((project) => (
+            Project(project)
+          ))
+        }
       </div>
     </>
   );