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,83 @@
+/**
+ * @file Codex toast notification component for new lore discoveries.
+ * @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 { type JSX, useEffect } from "react";
+import { useGame } from "../../context/gameContext.js";
+import { CODEX_ENTRIES } from "../../data/codex.js";
+
+interface CodexToastItemProperties {
+  readonly entryId:   string;
+  readonly onDismiss: (id: string)=> void;
+}
+
+/**
+ * Renders a single codex lore toast notification.
+ * @param props - The toast item properties.
+ * @param props.entryId - The codex entry ID to display.
+ * @param props.onDismiss - Callback to dismiss the toast.
+ * @returns The JSX element or null if entry is not found.
+ */
+const CodexToastItem = ({
+  entryId,
+  onDismiss,
+}: CodexToastItemProperties): JSX.Element | null => {
+  const entry = CODEX_ENTRIES.find((codexEntry) => {
+    return codexEntry.id === entryId;
+  });
+
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      onDismiss(entryId);
+    }, 4000);
+    return (): void => {
+      clearTimeout(timer);
+    };
+  }, [ entryId, onDismiss ]);
+
+  if (entry === undefined) {
+    return null;
+  }
+
+  function handleClick(): void {
+    onDismiss(entryId);
+  }
+
+  return (
+    <div className="codex-toast" onClick={handleClick}>
+      <span className="toast-icon">{"📖"}</span>
+      <div className="toast-content">
+        <span className="toast-label">{"✨ Lore Unlocked!"}</span>
+        <span className="toast-name">{entry.title}</span>
+      </div>
+    </div>
+  );
+};
+
+/**
+ * Renders the codex toast container with pending lore notifications.
+ * @returns The JSX element or null if there are no pending entries.
+ */
+const CodexToast = (): JSX.Element | null => {
+  const { unlockedCodexEntryIds: pendingEntryIds, dismissCodexEntry }
+    = useGame();
+
+  if (pendingEntryIds.length === 0) {
+    return null;
+  }
+
+  return (
+    <div className="achievement-toast-container">
+      {pendingEntryIds.map((id) => {
+        return (
+          <CodexToastItem entryId={id} key={id} onDismiss={dismissCodexEntry} />
+        );
+      })}
+    </div>
+  );
+};
+
+export { CodexToast };