Merge pull request #44 from nuoxoxo/23

+ 2310

src/App.tsx

@@ -19,13 +19,15 @@ import Aoc1501 from "./includes/Aoc1501";
 import Aoc2301 from "./includes/Aoc2301";
 import Aoc2302 from "./includes/Aoc2302";
 import Aoc2303 from "./includes/Aoc2303";
+import Aoc2310 from "./includes/Aoc2310";
 import DadJokes from "./includes/DadJokes";
 import "./styles/App.scss";
 
 type TargetRoute = React.FC;
 
 const routes: { [key: string]: TargetRoute } = {
   // Valid Identifiers (No quotes needed)
+  2310: Aoc2310,
   2303: Aoc2303,
   2302: Aoc2302,
   2301: Aoc2301,

src/includes/Aoc2310.tsx

@@ -0,0 +1,63 @@
+import { useState, useEffect } from "react"
+import { FetchDataWithoutTrim, /*Deepcopy2DArray*/ } from "../helpers/Helpers"
+
+const suffixes = ['in']//, 'alt']
+const choice = suffixes[Math.floor(Math.random() * suffixes.length)]
+const URL:string = "https://raw.githubusercontent.com/nuoxoxo/in/main/aoc/2310." + choice
+
+var Aoc2310 = () => {
+
+  const [lines, setLines] = useState<string[]>([])
+  const [p1] = useState<number>(0)
+  const [p2] = useState<number>(0)
+
+  const handleData = async () => {
+
+    try {
+      const raws = await FetchDataWithoutTrim(URL)
+      let i = -1
+      while (++i < raws.length) {
+        raws[i] = raws[i]
+                  .replace(/7/g, '┐')
+                  .replace(/-/g, '─')
+                  .replace(/L/g, '└')
+                  .replace(/F/g, '┌')
+                  .replace(/J/g, '┘')
+                  .replace(/\./g, ' ')
+      }
+      setLines(raws)
+    } catch (error: any) {
+      console.error("Error fetching data: ", error)
+    }
+  }
+
+  useEffect(() => {
+    handleData()
+  }, [])
+
+  return (
+    <>
+      {lines ? (
+        <>
+
+          <div className="playground">
+            <div className="field res-field res-field-1813">
+              <span>--- 2023 Day 10: Pipe Maze ---</span>
+              <span>Part 1: {p1 ? p1 : "(empty)"} </span>
+              <span>Part 2: {p2 ? p2 : "(empty)"} </span>
+            </div>
+          </div>
+
+          <div className="field data-field data-field-2310">
+            { lines ? lines.join("\n") : "No data available." }
+          </div>
+
+        </>
+      ) : (
+        <p>Loading data...</p>
+      )}
+    </>
+  )
+}
+
+export default Aoc2310

src/styles/App.scss

@@ -300,6 +300,10 @@ body {
   @include animation-rainbow-rotate;
 }
 
+.data-field-2310 {
+  font-size: 10px;
+}
+
 .data-field-1818 {
   font-size: 16px;
   color:$WATER-GREEN;