diff --git a/app/routes/analyzer.tsx b/app/routes/analyzer.tsx
index 363b55b9f..b0e482e9d 100644
--- a/app/routes/analyzer.tsx
+++ b/app/routes/analyzer.tsx
@@ -8,7 +8,12 @@ import { Main } from "~/components/Main";
import { useSetTitle } from "~/hooks/useSetTitle";
import type { AnalyzedBuild, Stat } from "~/modules/analyzer";
import { useAnalyzeBuild } from "~/modules/analyzer";
-import type { MainWeaponId, SubWeaponId } from "~/modules/in-game-lists";
+import type { AbilityPoints } from "~/modules/analyzer/types";
+import {
+ abilities,
+ type MainWeaponId,
+ type SubWeaponId,
+} from "~/modules/in-game-lists";
import styles from "~/styles/analyzer.css";
import { makeTitle } from "~/utils/strings";
import { specialWeaponImageUrl, subWeaponImageUrl } from "~/utils/urls";
@@ -32,7 +37,8 @@ export const handle = {
export default function BuildAnalyzerPage() {
const { t } = useTranslation(["analyzer", "common"]);
useSetTitle(t("common:pages.buildAnalyzer"));
- const { build, mainWeaponId, handleChange, analyzed } = useAnalyzeBuild();
+ const { build, mainWeaponId, handleChange, analyzed, abilityPoints } =
+ useAnalyzeBuild();
// xxx: remove before prod
if (process.env.NODE_ENV === "production") return Coming soon :);
@@ -62,6 +68,7 @@ export default function BuildAnalyzerPage() {
selectedAbilities={build}
onChange={(newBuild) => handleChange({ newBuild })}
/>
+
{t("analyzer:patch")} {CURRENT_PATCH}
@@ -226,6 +233,35 @@ function WeaponInfoBadges({ analyzed }: { analyzed: AnalyzedBuild }) {
);
}
+function AbilityPointsDetails({
+ abilityPoints,
+}: {
+ abilityPoints: AbilityPoints;
+}) {
+ const { t } = useTranslation("analyzer");
+
+ return (
+
+ {t("abilityPoints")}
+
+ {abilities
+ .filter((a) => (abilityPoints.get(a.name) ?? 0) > 0)
+ .sort((a, b) => {
+ return abilityPoints.get(b.name)! - abilityPoints.get(a.name)!;
+ })
+ .map((a) => (
+
+
+
+ {abilityPoints.get(a.name)}
+
+
+ ))}
+
+
+ );
+}
+
function StatCategory({
title,
children,
diff --git a/app/styles/analyzer.css b/app/styles/analyzer.css
index 6ada04825..f8179d1ad 100644
--- a/app/styles/analyzer.css
+++ b/app/styles/analyzer.css
@@ -34,6 +34,22 @@
padding-inline: var(--s-1-5);
}
+.analyzer__ap-summary {
+ background-color: var(--bg-lighter);
+ border-radius: var(--rounded);
+ font-size: var(--fonts-xxs);
+ font-weight: var(--semi-bold);
+ width: 100%;
+ padding-block: var(--s-1);
+ padding-inline: var(--s-2);
+}
+
+.analyzer__ap-text {
+ font-size: var(--fonts-xxs);
+ color: var(--text-lighter);
+ font-weight: var(--semi-bold);
+}
+
.analyzer__summary {
background-color: var(--bg-lighter);
border-radius: var(--rounded);
diff --git a/public/locales/en/analyzer.json b/public/locales/en/analyzer.json
index 1caf1cb89..a8e9c8880 100644
--- a/public/locales/en/analyzer.json
+++ b/public/locales/en/analyzer.json
@@ -53,5 +53,6 @@
"value": "Value",
"build": "Build",
"patch": "Patch:",
+ "abilityPoints": "Ability points",
"consumptionExplanation": "This chart shows the amount of actions left to perform with main weapon after using sub 0-{{maxSubsToUse}} times. Max amount of consecutive subs to use with full ink tank is {{maxSubsToUse}}."
}