diff --git a/typescript/client/src/app/pages/dashboard/games/_game/_playtype/GPTChartPage.tsx b/typescript/client/src/app/pages/dashboard/games/_game/_playtype/GPTChartPage.tsx index c13adb59b..3e80e98c9 100644 --- a/typescript/client/src/app/pages/dashboard/games/_game/_playtype/GPTChartPage.tsx +++ b/typescript/client/src/app/pages/dashboard/games/_game/_playtype/GPTChartPage.tsx @@ -36,7 +36,7 @@ import { useQuery } from "react-query"; import { Link, Route, Switch } from "react-router-dom"; import { type ChartDocument, - FormatDifficulty, + FormatDifficultyLong, GameToGameGroup, GetGameGroupConfig, type integer, @@ -54,7 +54,7 @@ export default function GPTChartPage({ song: SongDocument; } & GamePT) { const formatSongTitle = `${song.artist} - ${song.title}`; - const formatDiff = chart ? FormatDifficulty(chart) : "Loading..."; + const formatDiff = chart ? FormatDifficultyLong(chart) : "Loading..."; useSetSubheader( [ diff --git a/typescript/client/src/app/pages/dashboard/users/games/_game/_playtype/folders/EvolutionMilestoneFeedRow.tsx b/typescript/client/src/app/pages/dashboard/users/games/_game/_playtype/folders/EvolutionMilestoneFeedRow.tsx index 6ec4653e1..532dcd4c2 100644 --- a/typescript/client/src/app/pages/dashboard/users/games/_game/_playtype/folders/EvolutionMilestoneFeedRow.tsx +++ b/typescript/client/src/app/pages/dashboard/users/games/_game/_playtype/folders/EvolutionMilestoneFeedRow.tsx @@ -54,7 +54,9 @@ export default function EvolutionMilestoneFeedRow({ > ) : chart ? ( <> - Unknown chart + + Unknown chart + ({FormatDifficultyShort(chart)}) diff --git a/typescript/client/src/app/pages/dashboard/users/games/_game/_playtype/folders/FolderEnumDistributionBreakdown.tsx b/typescript/client/src/app/pages/dashboard/users/games/_game/_playtype/folders/FolderEnumDistributionBreakdown.tsx index 036b21793..d81c4b22c 100644 --- a/typescript/client/src/app/pages/dashboard/users/games/_game/_playtype/folders/FolderEnumDistributionBreakdown.tsx +++ b/typescript/client/src/app/pages/dashboard/users/games/_game/_playtype/folders/FolderEnumDistributionBreakdown.tsx @@ -14,17 +14,12 @@ function distributionRowChrome(enumColour: string | undefined): { fillStrong: string | undefined; trackBg: string; } { - const fallbackTrack = - "color-mix(in srgb, var(--bs-secondary) 14%, transparent)"; - const fallbackFillStrong = - "color-mix(in srgb, var(--bs-secondary) 42%, transparent)"; + const fallbackTrack = "color-mix(in srgb, var(--bs-secondary) 14%, transparent)"; + const fallbackFillStrong = "color-mix(in srgb, var(--bs-secondary) 42%, transparent)"; const borderLeftColor = enumColour ?? "var(--bs-secondary)"; - if ( - enumColour && - (enumColour.startsWith("#") || enumColour.startsWith("rgb")) - ) { + if (enumColour && (enumColour.startsWith("#") || enumColour.startsWith("rgb"))) { try { return { borderLeftColor: enumColour, @@ -97,8 +92,7 @@ export default function FolderEnumDistributionBreakdown({ const bucket = stats.stats[enumMetric] ?? {}; const minRelIx = conf.values.indexOf(conf.minimumRelevantValue); - const valueIndexFloor = - clipToMinimumRelevance && minRelIx !== -1 ? minRelIx : 0; + const valueIndexFloor = clipToMinimumRelevance && minRelIx !== -1 ? minRelIx : 0; if (total === 0) { return No charts in this folder.; @@ -115,13 +109,10 @@ export default function FolderEnumDistributionBreakdown({ const pct = total > 0 ? (100 * count) / total : 0; const chipFill = colours?.[label]; const chrome = distributionRowChrome(chipFill); - const pctWidth = - pct > 0 ? `${ToFixedFloor(Math.min(100, Math.max(0, pct)), 3)}%` : "0%"; + const pctWidth = pct > 0 ? `${ToFixedFloor(Math.min(100, Math.max(0, pct)), 3)}%` : "0%"; - const clickableRow = - Boolean(onEnumBreakdownRowClick && isLg && count > 0); - const rowHoverChromeClass = - clickableRow ? breakdownStyles.enumRowInteractive : ""; + const clickableRow = Boolean(onEnumBreakdownRowClick && isLg && count > 0); + const rowHoverChromeClass = clickableRow ? breakdownStyles.enumRowInteractive : ""; const rowShellStyle = { backgroundColor: chrome.trackBg, @@ -201,9 +192,19 @@ export default function FolderEnumDistributionBreakdown({ const remainderPct = total > 0 ? (100 * remainder) / total : 0; return ( -