From 6dc7a10c2e6f7a3d4f2728e0b89fd74057df8619 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com> Date: Tue, 10 Oct 2023 21:20:01 -0500 Subject: [PATCH] feat: completed link --- src/commands/link.ts | 98 ------- src/commands/link.tsx | 268 ++++++++++++++++++ .../components/WN8Display/components/Glow.tsx | 25 +- .../components/WN8Display/index.tsx | 6 +- src/components/Wrapper.tsx | 5 +- .../discord/normalizeInteractionReturnable.ts | 4 + src/events/interactionCreate/index.ts | 4 +- src/stitches.config.ts | 2 + 8 files changed, 294 insertions(+), 118 deletions(-) delete mode 100644 src/commands/link.ts create mode 100644 src/commands/link.tsx diff --git a/src/commands/link.ts b/src/commands/link.ts deleted file mode 100644 index e1ca47b5e..000000000 --- a/src/commands/link.ts +++ /dev/null @@ -1,98 +0,0 @@ -import { SlashCommandBuilder } from 'discord.js'; -import { Region } from '../constants/regions'; -import { linkBlitzAndDiscord } from '../core/cockroackdb/discordBlitz'; -import addUsernameChoices from '../core/discord/addUsernameChoices'; -import autocompleteUsername from '../core/discord/autocompleteUsername'; -import embedNegative from '../core/discord/embedNegative'; -import { CommandRegistry } from '../events/interactionCreate'; - -const serverAndIdPattern = /(com|eu|asia)\/[0-9]+/; - -export const verifyCommand: CommandRegistry = { - inProduction: true, - inPublic: true, - - command: new SlashCommandBuilder() - .setName('link') - .setDescription('Links your Blitz and Discord account') - .addStringOption((option) => addUsernameChoices(option).setRequired(true)), - - async handler(interaction) { - // const blitzAccount = await resolvePlayerFromCommand(interaction); - // const { id, region: server } = blitzAccount; - // const accountInfo = await getWargamingResponse( - // `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`, - // ); - // const clanData = await getWargamingResponse( - // `https://api.wotblitz.${server}/wotb/clans/accountinfo/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}&extra=clan`, - // ); - // const clan = clanData[id]?.clan; - // const clanTag = clan ? ` [${clan!.tag}]` : ''; - // const member = - // interaction.member && - // interaction.guild?.members.cache.get(interaction.member?.user.id); - - // if (!interaction.guild?.members.me?.permissions.has('ManageNicknames')) { - // return embedNegative( - // `${markdownEscape(interaction.user.username)} failed to verify`, - // "I don't have the permission to change your nickname.", - // ); - // } - // if (!interaction.member || !member) { - // return embedNegative( - // `${interaction.user.username} is not in this server`, - // "I couldn't find this person in this server. Did they leave?", - // ); - // } - - // try { - // await member.setNickname(`${accountInfo[id].nickname}${clanTag}`); - - // if (interaction.guildId === discord.sklld_guild_id) { - // if (!interaction.guild?.members.me?.permissions.has('ManageRoles')) { - // return embedNegative( - // `${markdownEscape(interaction.user.username)} failed to verify`, - // "I don't have the permission to change your manage roles.", - // ); - // } - - // await member.roles.remove(discord.sklld_verify_role); - // await member.roles.add(discord.sklld_peasant_role); - // } - - // return embedPositive( - // `${interaction.user.username} is verified`, - // `The user is now verified as ${markdownEscape( - // accountInfo[id].nickname, - // )}${markdownEscape(clanTag)}`, - // ); - // } catch (error) { - // return embedNegative( - // `${interaction.user.username} failed to verify`, - // "I can't change your nickname because you have higher permissions than me. Try setting your nickname to your Blitz username manually.", - // ); - // } - - const username = interaction.options.getString('username', true); - - if (serverAndIdPattern.test(username)) { - const [region, idString] = username.split('/'); - const id = parseInt(idString); - const discordId = parseInt(interaction.user.id); - - await linkBlitzAndDiscord(discordId, region as Region, id); - - return 'success'; - } else { - return [ - embedNegative( - 'Please select from the options', - 'Click on the user you desire after the search results show up (like the image below).', - ), - 'https://i.imgur.com/ncJyV1F.png', - ]; - } - }, - - autocomplete: autocompleteUsername, -}; diff --git a/src/commands/link.tsx b/src/commands/link.tsx new file mode 100644 index 000000000..fc773c893 --- /dev/null +++ b/src/commands/link.tsx @@ -0,0 +1,268 @@ +import { teal } from '@radix-ui/colors'; +import { AttachmentBuilder, SlashCommandBuilder } from 'discord.js'; +import { Glow } from '../components/AllStatsOverview/components/WN8Display/components/Glow'; +import Wrapper from '../components/Wrapper'; +import { REGION_NAMES_SHORT, Region } from '../constants/regions'; +import { WARGAMING_APPLICATION_ID } from '../constants/wargamingApplicationID'; +import getWargamingResponse from '../core/blitz/getWargamingResponse'; +import { linkBlitzAndDiscord } from '../core/cockroackdb/discordBlitz'; +import addUsernameChoices from '../core/discord/addUsernameChoices'; +import autocompleteUsername from '../core/discord/autocompleteUsername'; +import embedNegative from '../core/discord/embedNegative'; +import { CommandRegistry } from '../events/interactionCreate'; +import { theme } from '../stitches.config'; +import { AccountInfo } from '../types/accountInfo'; +import { PlayerClanData } from '../types/playerClanData'; + +const serverAndIdPattern = /(com|eu|asia)\/[0-9]+/; + +export const verifyCommand: CommandRegistry = { + inProduction: true, + inPublic: true, + + command: new SlashCommandBuilder() + .setName('link') + .setDescription('Links your Blitz and Discord account') + .addStringOption((option) => addUsernameChoices(option).setRequired(true)), + + async handler(interaction) { + // const blitzAccount = await resolvePlayerFromCommand(interaction); + // const { id, region: server } = blitzAccount; + // const accountInfo = await getWargamingResponse( + // `https://api.wotblitz.${server}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`, + // ); + // const clanData = await getWargamingResponse( + // `https://api.wotblitz.${server}/wotb/clans/accountinfo/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}&extra=clan`, + // ); + // const clan = clanData[id]?.clan; + // const clanTag = clan ? ` [${clan!.tag}]` : ''; + // const member = + // interaction.member && + // interaction.guild?.members.cache.get(interaction.member?.user.id); + + // if (!interaction.guild?.members.me?.permissions.has('ManageNicknames')) { + // return embedNegative( + // `${markdownEscape(interaction.user.username)} failed to verify`, + // "I don't have the permission to change your nickname.", + // ); + // } + // if (!interaction.member || !member) { + // return embedNegative( + // `${interaction.user.username} is not in this server`, + // "I couldn't find this person in this server. Did they leave?", + // ); + // } + + // try { + // await member.setNickname(`${accountInfo[id].nickname}${clanTag}`); + + // if (interaction.guildId === discord.sklld_guild_id) { + // if (!interaction.guild?.members.me?.permissions.has('ManageRoles')) { + // return embedNegative( + // `${markdownEscape(interaction.user.username)} failed to verify`, + // "I don't have the permission to change your manage roles.", + // ); + // } + + // await member.roles.remove(discord.sklld_verify_role); + // await member.roles.add(discord.sklld_peasant_role); + // } + + // return embedPositive( + // `${interaction.user.username} is verified`, + // `The user is now verified as ${markdownEscape( + // accountInfo[id].nickname, + // )}${markdownEscape(clanTag)}`, + // ); + // } catch (error) { + // return embedNegative( + // `${interaction.user.username} failed to verify`, + // "I can't change your nickname because you have higher permissions than me. Try setting your nickname to your Blitz username manually.", + // ); + // } + + const username = interaction.options.getString('username', true); + + if (serverAndIdPattern.test(username)) { + const [region, idString] = username.split('/'); + const id = parseInt(idString); + const discordId = parseInt(interaction.user.id); + // const account = ( + // await getWargamingResponse( + // `https://api.wotblitz.${region}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`, + // ) + // )[id]; + // const clan = await getWargamingResponse( + // `https://api.wotblitz.${region}/wotb/clans/accountinfo/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}&extra=clan`, + // ); + const [account, clan] = await Promise.all([ + getWargamingResponse( + `https://api.wotblitz.${region}/wotb/account/info/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}`, + ), + getWargamingResponse( + `https://api.wotblitz.${region}/wotb/clans/accountinfo/?application_id=${WARGAMING_APPLICATION_ID}&account_id=${id}&extra=clan`, + ), + ]); + + await linkBlitzAndDiscord(discordId, region as Region, id); + + return ( + +
+ + +
+
+ + +
+ + {interaction.user.displayName} + + + @{interaction.user.username} + +
+
+ +
+ + Accounts linked +
+ +
+ {clan[id]?.clan ? ( + + ) : null} +
+ + {account[id].nickname} + + + {clan[id]?.clan ? `[${clan[id]?.clan?.tag}] - ` : ''} + {REGION_NAMES_SHORT[region as Region]} + +
+
+
+ + +
+ + ); + } else { + return [ + embedNegative( + 'Please select from the options', + 'Follow the procedure like the video above. The search results may take a while to show up.', + ), + new AttachmentBuilder('https://i.imgur.com/2p6GFgC.gif'), + ]; + } + }, + + autocomplete: autocompleteUsername, +}; diff --git a/src/components/AllStatsOverview/components/WN8Display/components/Glow.tsx b/src/components/AllStatsOverview/components/WN8Display/components/Glow.tsx index 44c1c21d5..b5a524067 100644 --- a/src/components/AllStatsOverview/components/WN8Display/components/Glow.tsx +++ b/src/components/AllStatsOverview/components/WN8Display/components/Glow.tsx @@ -1,31 +1,28 @@ -import { Percentile } from '../../../../../constants/percentiles'; -import { PERCENTILE_COLORS } from '../../../../PercentileIndicator'; - -export enum GlowSide { - Top, - Bottom, -} - export interface GlowProps { - percentile: Percentile; - side: GlowSide; + color: string; + direction?: 'default' | 'reverse'; + rotation?: number; } -export function Glow({ percentile, side }: GlowProps) { - const color = PERCENTILE_COLORS[percentile]; +export function Glow({ + color, + direction = 'default', + rotation = 0, +}: GlowProps) { const color1 = color; const color2 = `${color}00`; const background = `linear-gradient(${ - side === GlowSide.Top ? 0 : 180 + direction === 'default' ? 0 : 180 }deg, ${color1} 0%, ${color2} 100%)`; return (
diff --git a/src/components/AllStatsOverview/components/WN8Display/index.tsx b/src/components/AllStatsOverview/components/WN8Display/index.tsx index 4fd0da495..513d1efdf 100644 --- a/src/components/AllStatsOverview/components/WN8Display/index.tsx +++ b/src/components/AllStatsOverview/components/WN8Display/index.tsx @@ -2,7 +2,7 @@ import { Percentile } from '../../../../constants/percentiles'; import getWN8Percentile from '../../../../core/blitz/getWN8Percentile'; import { theme } from '../../../../stitches.config'; import { PERCENTILE_COLORS } from '../../../PercentileIndicator'; -import { Glow, GlowSide } from './components/Glow'; +import { Glow } from './components/Glow'; export interface WN8DisplayProps { WN8?: number; @@ -37,7 +37,7 @@ export function WN8Display({ WN8 }: WN8DisplayProps) { gap: -16, }} > - +
- +
); } diff --git a/src/components/Wrapper.tsx b/src/components/Wrapper.tsx index ce3aad029..0af54719e 100644 --- a/src/components/Wrapper.tsx +++ b/src/components/Wrapper.tsx @@ -4,15 +4,16 @@ import { theme } from '../stitches.config'; export interface WrapperProps { children: ReactNode; naked?: boolean; + fat?: boolean; } -export default function Wrapper({ children, naked }: WrapperProps) { +export default function Wrapper({ children, naked, fat }: WrapperProps) { return (
).addComponents( item, ); + } else if (item instanceof AttachmentBuilder) { + if (!reply.files) reply.files = []; + reply.files.push(item); } else { const image = await jsxToPng(item); if (!reply.files) reply.files = []; diff --git a/src/events/interactionCreate/index.ts b/src/events/interactionCreate/index.ts index 4a7389abf..dea18f7f5 100644 --- a/src/events/interactionCreate/index.ts +++ b/src/events/interactionCreate/index.ts @@ -1,4 +1,5 @@ import { + AttachmentBuilder, AutocompleteInteraction, ButtonBuilder, ButtonInteraction, @@ -20,6 +21,7 @@ import { eligibleCommand } from '../../commands/eligible'; import { evolutionCommand } from '../../commands/evolution'; import { fullStatsCommand } from '../../commands/fullStats'; import { inactiveCommand } from '../../commands/inactive'; +import { verifyCommand } from '../../commands/link'; import { ownedTanksCommand } from '../../commands/ownedTanks'; import { pingCommand } from '../../commands/ping'; import { playerAchievementsCommand } from '../../commands/playerAchievements'; @@ -30,7 +32,6 @@ import { searchPlayersCommand } from '../../commands/searchPlayers'; import { searchTanksCommand } from '../../commands/searchTanks'; import { statsCommand } from '../../commands/stats'; import { todayCommand } from '../../commands/today'; -import { verifyCommand } from '../../commands/link'; import getClientId from '../../core/node/getClientId'; import isDev from '../../core/node/isDev'; import { secrets } from '../../core/node/secrets'; @@ -42,6 +43,7 @@ export type InteractionRawReturnable = | string | EmbedBuilder | ButtonBuilder + | AttachmentBuilder | JSX.Element; export type InteractionIterableReturnable = | InteractionRawReturnable diff --git a/src/stitches.config.ts b/src/stitches.config.ts index 1d8327ba3..f8f9a2a92 100644 --- a/src/stitches.config.ts +++ b/src/stitches.config.ts @@ -3,6 +3,7 @@ import { blueDark, slate, slateDark, + tealDark, tomatoDark, } from '@radix-ui/colors'; import { createBorderStyles, createColors, createSpaces } from 'bepaint'; @@ -18,6 +19,7 @@ export const theme = { ...createColors(amberDark, 'amber'), ...createColors(blueDark, 'blue'), ...createColors(tomatoDark, 'red'), + ...createColors(tealDark, 'teal'), }, borderStyles: {