From f6058015551d19dbd4b0652be7668ddb2f58b9ee Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com> Date: Wed, 6 Mar 2024 09:52:09 -0600 Subject: [PATCH] feat: better titlebar --- src/commands/breakdown.tsx | 14 ++-- src/commands/evolution.tsx | 8 +- src/commands/fullStats.tsx | 8 +- src/commands/inactive.tsx | 8 +- src/commands/link.tsx | 6 +- src/commands/ownedTanks.tsx | 8 +- src/commands/ratings.tsx | 8 +- src/commands/stats.tsx | 8 +- .../{Wrapper.tsx => CommandWrapper.tsx} | 12 +-- src/components/TitleBar.tsx | 73 +++++++------------ 10 files changed, 63 insertions(+), 90 deletions(-) rename src/components/{Wrapper.tsx => CommandWrapper.tsx} (60%) diff --git a/src/commands/breakdown.tsx b/src/commands/breakdown.tsx index c81ac1f6a..6e7c3a90e 100644 --- a/src/commands/breakdown.tsx +++ b/src/commands/breakdown.tsx @@ -1,8 +1,8 @@ import { chunk } from 'lodash'; import * as Breakdown from '../components/Breakdown'; +import CommandWrapper from '../components/CommandWrapper'; import NoData, { NoDataType } from '../components/NoData'; import TitleBar from '../components/TitleBar'; -import Wrapper from '../components/Wrapper'; import { AllStats, getAccountInfo } from '../core/blitz/getAccountInfo'; import { getClanAccountInfo } from '../core/blitz/getClanAccountInfo'; import getTankStats from '../core/blitz/getTankStats'; @@ -254,10 +254,10 @@ export async function renderBreakdown( if (filteredOrder.length > 0) { return pages .map((page, index) => ( - + {index === 0 && ( {page} - + )) .reverse(); } else { return [ - + - , + , ]; } } diff --git a/src/commands/evolution.tsx b/src/commands/evolution.tsx index 9a6983402..e2bb7bd99 100644 --- a/src/commands/evolution.tsx +++ b/src/commands/evolution.tsx @@ -2,10 +2,10 @@ import { SlashCommandBuilder, SlashCommandSubcommandGroupBuilder, } from 'discord.js'; +import CommandWrapper from '../components/CommandWrapper'; import * as Graph from '../components/Graph'; import NoData, { NoDataType } from '../components/NoData'; import TitleBar from '../components/TitleBar'; -import Wrapper from '../components/Wrapper'; import { getAccountInfo } from '../core/blitz/getAccountInfo'; import { getClanAccountInfo } from '../core/blitz/getClanAccountInfo'; import resolveTankId from '../core/blitz/resolveTankId'; @@ -74,8 +74,8 @@ async function render( const minX = Math.min(...xs); return ( - - + + {plot.length > 0 && ( } - + ); } diff --git a/src/commands/fullStats.tsx b/src/commands/fullStats.tsx index 01ca868a8..fce3f7205 100644 --- a/src/commands/fullStats.tsx +++ b/src/commands/fullStats.tsx @@ -1,9 +1,9 @@ import { SlashCommandBuilder } from 'discord.js'; +import CommandWrapper from '../components/CommandWrapper'; import GenericAllStats from '../components/GenericAllStats'; import NoData, { NoDataType } from '../components/NoData'; import TierWeights from '../components/TierWeights'; import TitleBar from '../components/TitleBar'; -import Wrapper from '../components/Wrapper'; import { getAccountInfo } from '../core/blitz/getAccountInfo'; import { getClanAccountInfo } from '../core/blitz/getClanAccountInfo'; import { emblemIdToURL } from '../core/blitzkrieg/emblemIdToURL'; @@ -48,9 +48,9 @@ async function render( const tierWeights = await getTierWeights(diffedTankStats.diff, filteredOrder); return ( - + @@ -60,7 +60,7 @@ async function render( {stats.battles > 0 && ( )} - + ); } diff --git a/src/commands/inactive.tsx b/src/commands/inactive.tsx index aabc824aa..762ff3515 100644 --- a/src/commands/inactive.tsx +++ b/src/commands/inactive.tsx @@ -1,8 +1,8 @@ import { SlashCommandBuilder } from 'discord.js'; +import CommandWrapper from '../components/CommandWrapper'; import GenericStats from '../components/GenericStats'; import NoData, { NoDataType } from '../components/NoData'; import TitleBar from '../components/TitleBar'; -import Wrapper from '../components/Wrapper'; import { getAccountInfo } from '../core/blitz/getAccountInfo'; import { getClanInfo } from '../core/blitz/getClanInfo'; import addClanChoices from '../core/discord/addClanChoices'; @@ -52,16 +52,16 @@ export const inactiveCommand: CommandRegistry = { const hasInactiveMembers = inactive.length > 0; return ( - + {!hasInactiveMembers && } {hasInactiveMembers && } - + ); }, diff --git a/src/commands/link.tsx b/src/commands/link.tsx index 46110c6ed..a7a7ea8c6 100644 --- a/src/commands/link.tsx +++ b/src/commands/link.tsx @@ -3,7 +3,7 @@ import { GuildMemberRoleManager, SlashCommandBuilder } from 'discord.js'; import markdownEscape from 'markdown-escape'; import discord from '../../discord.json' assert { type: 'json' }; import { Glow } from '../components/AllStatsOverview/components/WN8Display/components/Glow'; -import Wrapper from '../components/Wrapper'; +import CommandWrapper from '../components/CommandWrapper'; import { REGION_NAMES } from '../constants/regions'; import { getAccountInfo } from '../core/blitz/getAccountInfo'; import { getClanAccountInfo } from '../core/blitz/getClanAccountInfo'; @@ -50,7 +50,7 @@ export const verifyCommand: CommandRegistry = { } return [ - +
- , + , embedInfo( 'Incorrect account?', diff --git a/src/commands/ownedTanks.tsx b/src/commands/ownedTanks.tsx index 8842c9ff0..0e61e4f31 100644 --- a/src/commands/ownedTanks.tsx +++ b/src/commands/ownedTanks.tsx @@ -1,8 +1,8 @@ import { SlashCommandBuilder } from 'discord.js'; +import CommandWrapper from '../components/CommandWrapper'; import NoData, { NoDataType } from '../components/NoData'; import * as Tanks from '../components/Tanks'; import TitleBar from '../components/TitleBar'; -import Wrapper from '../components/Wrapper'; import { encyclopediaInfo } from '../core/blitz/encyclopediaInfo'; import { getAccountInfo } from '../core/blitz/getAccountInfo'; import { getClanAccountInfo } from '../core/blitz/getClanAccountInfo'; @@ -61,9 +61,9 @@ export const ownedTanksCommand: CommandRegistry = { nations.sort(); return ( - + + ); }, diff --git a/src/commands/ratings.tsx b/src/commands/ratings.tsx index 479583f0d..91dc7d817 100644 --- a/src/commands/ratings.tsx +++ b/src/commands/ratings.tsx @@ -6,9 +6,9 @@ import { import { range } from 'lodash'; import markdownEscape from 'markdown-escape'; import { BlitzkriegRatingsLeaderboard } from '../../scripts/buildRatingsLeaderboard'; +import CommandWrapper from '../components/CommandWrapper'; import * as Leaderboard from '../components/Leaderboard'; import TitleBar from '../components/TitleBar'; -import Wrapper from '../components/Wrapper'; import { LEAGUES } from '../constants/leagues'; import { FIRST_ARCHIVED_RATINGS_SEASON } from '../constants/ratings'; import { REGION_NAMES_SHORT, Region } from '../constants/regions'; @@ -423,9 +423,9 @@ export const ratingsCommand = new Promise( }); return ( - + @@ -445,7 +445,7 @@ export const ratingsCommand = new Promise( )} )} - + ); }, diff --git a/src/commands/stats.tsx b/src/commands/stats.tsx index bf6146259..27ca249c3 100644 --- a/src/commands/stats.tsx +++ b/src/commands/stats.tsx @@ -1,8 +1,8 @@ import { SlashCommandBuilder } from 'discord.js'; import AllStatsOverview from '../components/AllStatsOverview'; +import CommandWrapper from '../components/CommandWrapper'; import NoData, { NoDataType } from '../components/NoData'; import TitleBar from '../components/TitleBar'; -import Wrapper from '../components/Wrapper'; import { getAccountInfo } from '../core/blitz/getAccountInfo'; import { getClanAccountInfo } from '../core/blitz/getClanAccountInfo'; import { emblemIdToURL } from '../core/blitzkrieg/emblemIdToURL'; @@ -42,9 +42,9 @@ async function render( const filterDescriptions = await filtersToDescription(filters); return ( - + @@ -53,7 +53,7 @@ async function render( {stats.battles > 0 && ( )} - + ); } diff --git a/src/components/Wrapper.tsx b/src/components/CommandWrapper.tsx similarity index 60% rename from src/components/Wrapper.tsx rename to src/components/CommandWrapper.tsx index 0af54719e..bf9b99f49 100644 --- a/src/components/Wrapper.tsx +++ b/src/components/CommandWrapper.tsx @@ -1,26 +1,22 @@ import { ReactNode } from 'react'; import { theme } from '../stitches.config'; -export interface WrapperProps { +interface CommandWrapperProps { children: ReactNode; - naked?: boolean; fat?: boolean; } -export default function Wrapper({ children, naked, fat }: WrapperProps) { +export default function CommandWrapper({ children, fat }: CommandWrapperProps) { return (
{children} diff --git a/src/components/TitleBar.tsx b/src/components/TitleBar.tsx index 7449da129..ef5b284cc 100644 --- a/src/components/TitleBar.tsx +++ b/src/components/TitleBar.tsx @@ -1,75 +1,52 @@ import { theme } from '../stitches.config'; export interface TitleBarProps { - name: string; + title: string; image?: string; description?: string; } -export default function TitleBar({ name, image, description }: TitleBarProps) { +export default function TitleBar({ title, image, description }: TitleBarProps) { return (
-
+
{image && ( )} -
-
- - {name} - -
- -
- - {description} - -
-
+ {title} +
+ + + {description} +
); }