From 3cbee63efff0eeff167be2944b4f2484ebf85372 Mon Sep 17 00:00:00 2001
From: frzyc <frzyc@users.noreply.github.com>
Date: Wed, 12 Feb 2025 15:56:28 -0500
Subject: [PATCH] ZO Add a roadmap to home page

---
 .github/workflows/build-frontend.yml    |   1 +
 .github/workflows/build-new-release.yml |   1 +
 apps/zzz-frontend/.env                  |   2 +-
 libs/zzz/page-home/src/Roadmap.tsx      | 180 ++++++++++++++++++++++++
 libs/zzz/page-home/src/index.tsx        |  41 ++----
 5 files changed, 193 insertions(+), 32 deletions(-)
 create mode 100644 libs/zzz/page-home/src/Roadmap.tsx

diff --git a/.github/workflows/build-frontend.yml b/.github/workflows/build-frontend.yml
index cbf3e053c8..316464b648 100644
--- a/.github/workflows/build-frontend.yml
+++ b/.github/workflows/build-frontend.yml
@@ -60,6 +60,7 @@ jobs:
       - name: Setup .env
         run: |
           printf '%s' "$ENVFILE" > apps/frontend/.env.local
+          printf '%s' "$ENVFILE" > apps/zzz-frontend/.env.local
         env:
           ENVFILE: ${{ vars.ENVFILE }}
       - name: Build frontend
diff --git a/.github/workflows/build-new-release.yml b/.github/workflows/build-new-release.yml
index 7d89398040..822cd47f72 100644
--- a/.github/workflows/build-new-release.yml
+++ b/.github/workflows/build-new-release.yml
@@ -39,6 +39,7 @@ jobs:
       - name: Setup .env
         run: |
           printf '%s' "$ENVFILE" > apps/frontend/.env.local
+          printf '%s' "$ENVFILE" > apps/zzz-frontend/.env.local
         env:
           ENVFILE: ${{ vars.ENVFILE }}
       - name: Build genshin-optimizer
diff --git a/apps/zzz-frontend/.env b/apps/zzz-frontend/.env
index bbf1022e1c..840918facb 100644
--- a/apps/zzz-frontend/.env
+++ b/apps/zzz-frontend/.env
@@ -1,2 +1,2 @@
-NX_URL_GITHUB_API_ZZZ_RELEASES=https://api.github.com/repos///releases/tags/
+NX_URL_GITHUB_API_GO_RELEASES=https://api.github.com/repos///releases/tags/
 NX_URL_GITHUB_GO_CURRENT_VERSION=
diff --git a/libs/zzz/page-home/src/Roadmap.tsx b/libs/zzz/page-home/src/Roadmap.tsx
new file mode 100644
index 0000000000..552c7b5492
--- /dev/null
+++ b/libs/zzz/page-home/src/Roadmap.tsx
@@ -0,0 +1,180 @@
+import { SqBadge } from '@genshin-optimizer/common/ui'
+import { ZCard } from '@genshin-optimizer/zzz/ui'
+import {
+  CardContent,
+  List,
+  ListItem,
+  ListItemText,
+  Stack,
+  Typography,
+} from '@mui/material'
+
+export function Roadmap() {
+  return (
+    <ZCard>
+      <CardContent>
+        <Typography variant="h4" gutterBottom>
+          <span role="img" aria-label="rocket">
+            🚀
+          </span>{' '}
+          Roadmap to ZZZero-maxxing
+        </Typography>
+
+        <Stack spacing={2}>
+          <ZCard bgt="dark">
+            <CardContent>
+              {/* Milestone 1 */}
+              <Typography variant="h5" gutterBottom>
+                <span role="img" aria-label="target">
+                  🎯
+                </span>{' '}
+                Milestone 1: MVPish <SqBadge color="success">COMPLETED</SqBadge>
+              </Typography>
+              <Typography variant="body1" gutterBottom>
+                A real test of "What’s the absolute <strong>least</strong> I can
+                do and still call it an optimizer?" 🤡
+              </Typography>
+              <List dense>
+                <ListItem>
+                  <ListItemText primary="❌ No datamine (we rawdoggin' the stats)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🦴 Bare bones Disc inventory" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="📸 Scan discs using screenshot tech (caveman mode engaged)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="✏️ Stats editor for solver inputs (DIY optimizer experience)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🏗️ Minimal disc filter/force sets for solver" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="📜 Napkin sketch calculations (trust me bro numbers)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🎯 General damage targets (aka 'hit big numbers around this area')" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🔄 2p Disc effects (the bare minimum™)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="💪 Brute force solver" />
+                </ListItem>
+              </List>
+            </CardContent>
+          </ZCard>
+
+          <ZCard bgt="dark">
+            <CardContent>
+              {/* Milestone 2 */}
+              <Typography variant="h5" gutterBottom>
+                <span role="img" aria-label="lightbulb">
+                  💡
+                </span>{' '}
+                Milestone 2: I NEED THIS{' '}
+                <SqBadge color="success">COMPLETED</SqBadge>
+              </Typography>
+              <List>
+                <ListItem>
+                  <ListItemText primary="🧙‍♂️ Scuffed datamine via Hakushin API" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="📥 Import character & Wengine stats (No more manual typing, rejoice!)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🎭 4p Disc conditionals (because 2p ain't enough)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="📂 Disc inventory with filters (finally some organization)" />
+                </ListItem>
+              </List>
+            </CardContent>
+          </ZCard>
+
+          <ZCard bgt="dark">
+            <CardContent>
+              {/* Milestone 3 */}
+              <Typography variant="h5" gutterBottom>
+                <span role="img" aria-label="gem">
+                  💎
+                </span>{' '}
+                Milestone 3: I WANT THIS.{' '}
+                <SqBadge color="success">COMPLETED</SqBadge>
+              </Typography>
+              <Typography variant="body1" gutterBottom>
+                We’re entering <strong>premium optimizer experience</strong>{' '}
+                territory. 🛠️✨
+              </Typography>
+              <List>
+                <ListItem>
+                  <ListItemText primary="🔧 Wengine conditionals (min-maxers be eatin’ GOOD 🧠💪)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🕵️‍♂️ Advanced 2p/4p set filters (no more 💩 builds—only PEAK performance)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="❌ Auto-yeet trash builds (bad builds? Deleted. Skill issue.)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🎨 UI glow-up (no more 'made by a programmer' vibes, we fancy now 😎)" />
+                </ListItem>
+              </List>
+            </CardContent>
+          </ZCard>
+
+          <ZCard bgt="dark">
+            <CardContent>
+              {/* Milestone 4: Engine Swap */}
+              <Typography variant="h5" gutterBottom>
+                <span role="img" aria-label="gear">
+                  ⚙️
+                </span>{' '}
+                Milestone 4: ENGINE SWAP BABY 🚗💨{' '}
+                <SqBadge color="warning">IN-PROGRESS</SqBadge>
+              </Typography>
+              <List dense>
+                <ListItem>
+                  <ListItemText primary="🔥 Pando calculation engine replaces scuffed math" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🔍 Compare different builds" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="📝 Print out math formulas (show your work, nerd)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🧠 Advanced solver optimization (Pando makes the best and fastest builds, no 🧢)" />
+                </ListItem>
+              </List>
+            </CardContent>
+          </ZCard>
+
+          <ZCard bgt="dark">
+            <CardContent>
+              {/* Milestone 5 */}
+              <Typography variant="h5" gutterBottom>
+                <span role="img" aria-label="performing arts">
+                  🎭
+                </span>{' '}
+                Milestone 5: Characters ARE Built Different
+              </Typography>
+              <List>
+                <ListItem>
+                  <ListItemText primary="🏆 Adding in each character and targets" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="🎯 Add multi-target optimization (characters can't just one-shot)" />
+                </ListItem>
+                <ListItem>
+                  <ListItemText primary="👥 Add team/builds (there is no 'i' in team)" />
+                </ListItem>
+              </List>
+            </CardContent>
+          </ZCard>
+        </Stack>
+      </CardContent>
+    </ZCard>
+  )
+}
diff --git a/libs/zzz/page-home/src/index.tsx b/libs/zzz/page-home/src/index.tsx
index d421ff8b67..5a30807ce0 100644
--- a/libs/zzz/page-home/src/index.tsx
+++ b/libs/zzz/page-home/src/index.tsx
@@ -1,43 +1,22 @@
 import { CardThemed } from '@genshin-optimizer/common/ui'
+import { ZCard } from '@genshin-optimizer/zzz/ui'
 import DescriptionIcon from '@mui/icons-material/Description'
-import { CardContent, CardHeader, Divider, Typography } from '@mui/material'
-import { Box } from '@mui/system'
+import { CardContent, CardHeader, Stack, Typography } from '@mui/material'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import ReactMarkdown from 'react-markdown'
 import remarkGfm from 'remark-gfm'
+import { Roadmap } from './Roadmap'
 
 declare const __VERSION__: string
 export default function PageHome() {
   return (
-    <CardThemed sx={{ my: 1 }}>
-      <CardContent>
-        <Typography variant="h5">I know what this looks like...</Typography>
-        <Typography>
-          This is an <i>Alpha</i>(desperately unfinished) version of{' '}
-          <strong>Zenless Optimizer</strong>. You have to understand, this is
-          the result of asking,
-        </Typography>
-        <Typography variant="caption">
-          "What is the most Optimizer I can, if I was cutting corners like it's
-          crunch time at a circle factory?" — frzyc, probably
-        </Typography>
-        <Typography>
-          I know a lot of stuff isn't implemented, and the stuff that are, are
-          super ugly. This is only like{' '}
-          <Box component="span" sx={{ textDecoration: 'line-through' }}>
-            10
-          </Box>{' '}
-          20 hours of coding, cut me some slack.
-        </Typography>
-        <Typography sx={{ my: 1 }}>Have an optimal day,</Typography>
-        <Typography>
-          <strong>frzyc</strong>
-        </Typography>
-      </CardContent>
-      <Divider />
-      <PatchNotesCard />
-    </CardThemed>
+    <Stack spacing={1} sx={{ my: 1 }}>
+      <Roadmap />
+      <ZCard>
+        <PatchNotesCard />
+      </ZCard>
+    </Stack>
   )
 }
 
@@ -47,7 +26,7 @@ function PatchNotesCard() {
   useEffect(() => {
     const regex = /^(\d+)\.(\d+)\.(\d+)$/
     const minorVersion = __VERSION__.replace(regex, `$1.$2.${0}`)
-    fetch(process.env['NX_URL_GITHUB_API_ZZZ_RELEASES'] + minorVersion)
+    fetch(process.env['NX_URL_GITHUB_API_GO_RELEASES'] + minorVersion)
       .then((res) => res.arrayBuffer())
       .then((buffer) => {
         const decoder = new TextDecoder('utf-8')