import React, { useState } from 'react';
import { useQuery, gql } from '@apollo/client';
import { Link, Redirect } from 'react-router-dom';
import { url_for } from './Details';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faChevronRight } from '@fortawesome/free-solid-svg-icons';
const matchers = {
'raider.io': /raider\.io\/guilds\/(?<regionSlug>[^\/]+)\/(?<serverSlug>[^\/]+)\/(?<guild>[^\/]+)/,
'wowprogress': /wowprogress\.com\/guild\/(?<regionSlug>[^\/]+)\/(?<serverSlug>[^\/]+)\/(?<guild>[^\/]+)/,
'armory': /worldofwarcraft\.com\/[^\/]+\/guild\/(?<regionSlug>[^\/]+)\/(?<serverSlug>[^\/]+)\/(?<guild>[^\/]+)/,
'wcl-calendar': /warcraftlogs\.com\/guild\/(?<regionSlug>[^\/]+)\/(?<serverSlug>[^\/]+)\/(?<guild>[^\/]+)/,
};
interface GuildQuery {
regionSlug: string;
serverSlug: string;
guild: string;
kind: string;
}
function decodeGuildName(kind: string, guild: string): string {
switch(kind) {
case "wowprogress":
return guild.replace(/\+/, ' ');
case 'armory':
return guild.replace(/-/, ' ');
default:
return decodeURIComponent(guild);
}
}
function match(url: string | undefined): GuildQuery | undefined {
if(!url) {
return;
}
for (const [kind, matcher] of Object.entries(matchers)) {
const match = matcher.exec(url);
if (match) {
const [ , regionSlug, serverSlug, rawGuild] = match;
const guild = decodeGuildName(kind, rawGuild);
return {
kind, regionSlug, serverSlug, guild,
}
}
}
}
interface GuildRef {
id: number;
name: string;
isTag: boolean;
}
const Q_TAGS = gql`
query GuildTags($serverSlug: String!, $regionSlug: String!, $guild: String) {
guildId(serverSlug: $serverSlug, regionSlug: $regionSlug, guild: $guild) {
id, name, isTag
}
}
`;
function url(tag: GuildRef, queryData: GuildQuery, guild_tag: GuildRef): string {
const data: any = {
guild: { ...queryData, name: queryData.guild, id: guild_tag.id },
};
if(tag.isTag) {
data.team = {
id: tag.id,
tagName: tag.name,
};
}
return url_for(data, '26-castle-nathria');
}
function Tag({ tag, queryData, guild }: { tag: GuildRef; queryData: GuildQuery; guild: GuildRef }) {
return (
<Link to={url(tag, queryData, guild)} className="flex hover:underline items-center justify-between">
<span className="mr-5 flex-initial whitespace-nowrap">{tag.isTag ? tag.name : `${guild.name} (Untagged Logs)`}</span>
<FontAwesomeIcon icon={faChevronRight} />
</Link>
)
}
function Sample({ children, onClick }: React.PropsWithChildren<{ onClick: (s: string) => void }>) {
return (
<pre className="hover:underline cursor-pointer" onClick={() => onClick(children as string)}>{children}</pre>
);
}
const samples: { [s: string]: string } = {
'wowprogress': 'https://www.wowprogress.com/guild/us/turalyon/Occasional+Excellence',
'raider.io': 'https://raider.io/guilds/us/turalyon/Occasional%20Excellence',
'worldofwarcraft': 'https://worldofwarcraft.com/en-us/guild/us/turalyon/occasional-excellence',
'wcl-calendar': 'https://www.warcraftlogs.com/guild/us/turalyon/Occasional%20Excellence',
}
function Samples({ kind, onClick }: { kind?: string; onClick: (s: string) => void }) {
if(kind) {
return <Sample onClick={onClick}>{samples[kind]}</Sample>;
} else {
return (
<div>
{Object.entries(samples).map(([kind, sample]) => <Sample onClick={onClick} key={kind}>{sample}</Sample>)}
</div>
);
}
}
function TagList({ tags, queryData, onClick }: { tags: GuildRef[] | null; queryData: GuildQuery; onClick: (s: string) => void; }) {
if (tags === null) {
return <div>Guild not found. Make sure you're using a valid URL. For example: <Samples kind={queryData.kind} onClick={onClick} /></div>
} else if (tags.length === 1) {
return <Redirect to={url(tags[0], queryData, tags[0])} />;
} else {
return (
<div className="text-3xl mt-5 w-min">
{tags.map(tag => <Tag tag={tag} key={tag.id} queryData={queryData} guild={tags[0]} />)}
</div>
);
}
}