feat: initial prototype — core game systems (#30)

## Summary This PR represents the full v1 prototype, implementing the core game systems for Elysium. - Full idle/clicker RPG loop: resource collection, crafting, boss fights, exploration, and quests - Adventurer hiring with batch size selector and progressive tier cost scaling - Prestige, transcendence, and apotheosis systems with auto-prestige support - Character sheet, titles, leaderboards, companion system, and daily login bonuses - Auto-quest and auto-boss toggles - Discord webhook notifications on prestige/transcendence/apotheosis - Discord role awarded on apotheosis - Responsive design and overarching story/lore system - In-game sound effects and browser notifications for key events - Support link button in the resource bar - Full test coverage (100% on `apps/api` and `packages/types`) - CI pipeline: lint → build → test ## Closes Closes #1 Closes #2 Closes #3 Closes #4 Closes #5 Closes #6 Closes #7 Closes #8 Closes #9 Closes #10 Closes #11 Closes #12 Closes #13 Closes #14 Closes #16 Closes #19 Closes #20 Closes #21 Closes #22 Closes #23 Closes #24 Closes #25 Closes #26 Closes #27 Closes #29 ✨ This issue was created with help from Hikari~ 🌸 Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com> Reviewed-on: #30 Co-authored-by: Hikari <hikari@nhcarrigan.com> Co-committed-by: Hikari <hikari@nhcarrigan.com>
2026-03-08 15:53:39 -07:00
parent c69e155de3
commit 29c817230d
172 changed files with 50706 additions and 0 deletions
@@ -0,0 +1,76 @@
+/**
+ * @file Story toast notification component for new chapter unlocks.
+ * @copyright nhcarrigan
+ * @license Naomi's Public License
+ * @author Naomi Carrigan
+ */
+/* eslint-disable react/no-multi-comp -- Sub-component is tightly coupled to the toast container */
+import { STORY_CHAPTERS } from "@elysium/types";
+import { type JSX, useEffect } from "react";
+import { useGame } from "../../context/gameContext.js";
+
+interface StoryToastItemProperties {
+  readonly chapterId: string;
+}
+
+/**
+ * Renders a single story chapter toast notification.
+ * @param props - The toast item properties.
+ * @param props.chapterId - The chapter ID to display.
+ * @returns The JSX element or null if chapter is not found.
+ */
+const StoryToastItem = ({
+  chapterId,
+}: StoryToastItemProperties): JSX.Element | null => {
+  const { dismissStoryChapter } = useGame();
+  const chapter = STORY_CHAPTERS.find((storyChapter) => {
+    return storyChapter.id === chapterId;
+  });
+
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      dismissStoryChapter(chapterId);
+    }, 4000);
+    return (): void => {
+      clearTimeout(timer);
+    };
+  }, [ chapterId, dismissStoryChapter ]);
+
+  if (chapter === undefined) {
+    return null;
+  }
+
+  function handleClick(): void {
+    dismissStoryChapter(chapterId);
+  }
+
+  return (
+    <button className="achievement-toast" onClick={handleClick} type="button">
+      <span className="achievement-toast-icon">{"📖"}</span>
+      <div className="achievement-toast-content">
+        <span className="achievement-toast-label">{"✨ New Chapter!"}</span>
+        <span className="achievement-toast-name">{chapter.title}</span>
+      </div>
+    </button>
+  );
+};
+
+/**
+ * Renders the story toast container with pending chapter notifications.
+ * @returns The JSX element or null if there are no pending chapters.
+ */
+const StoryToast = (): JSX.Element | null => {
+  const { unlockedStoryChapterIds: pendingChapterIds } = useGame();
+  if (pendingChapterIds.length === 0) {
+    return null;
+  }
+  return (
+    <div className="achievement-toast-container">
+      {pendingChapterIds.map((id) => {
+        return <StoryToastItem chapterId={id} key={id} />;
+      })}
+    </div>
+  );
+};
+
+export { StoryToast };