update alolan sprites, forms

generatePokemonData.ts

@@ -34,13 +34,43 @@ const getClosestCpMultiplierIndex = (value : number) => {
 const familyOrder : Array<string> = [];
 const familyEvolutionOrder : Record<string, Array<string>> = {};
 const familyEncountered : Record<string, Array<ILeaguePokemon>> = {};
+const parseNameAndForm = (monId : string, monName : string) => {
+    if (monId.indexOf('_ALOLA') > -1 ||
+        monId.indexOf('CASTFORM') > -1 ||
+        monId.indexOf('DEOXYS') > -1 ||
+        monId.indexOf('WORMADAM') > -1 ||
+        monId.indexOf('BURMY') > -1 ||
+        monId.indexOf('CHERRIM') > -1 ||
+        monId.indexOf('SHELLOS') > -1 ||
+        monId.indexOf('GASTRODON') > -1 ||
+        monId.indexOf('ROTOM') > -1 ||
+        monId.indexOf('GIRATINA') > -1 ||
+        monId.indexOf('SHAYMIN') > -1 ||
+        monId.indexOf('ARCEUS') > -1 ||
+        monId.indexOf('DEOXYS') > -1 ||
+        monId.indexOf('DEOXYS') > -1 ||
+        monId.indexOf('DEOXYS') > -1
+    ) {
+        const formTokenIndex = monId.indexOf('_');
+        return {
+            name: monName.substr(0, formTokenIndex),
+            form: monId.substr(formTokenIndex + 1),
+        };
+    }
+    return {
+        name: monName,
+        form: null,
+    };
+}
 Pokemon.forEach((mon) => {
+    const { name, form } = parseNameAndForm(mon.id, mon.name);
     const baseAtk = mon.stats.baseAttack;
     const baseDef = mon.stats.baseDefense;
     const baseHp = mon.stats.baseStamina;
     const pokemon : ILeaguePokemon = {
         id: mon.id,
-        name: mon.name,
+        name,
+        form,
         dex: mon.dex,
         types: {
             type1: mon.types[0].name.toLowerCase() as Type,

src/ts/app/components/PokemonExplorer/PokemonExplorer.tsx

@@ -169,6 +169,13 @@ export class PokemonExplorer extends React.Component<IPokemonExplorerProps, ISta
             'is-primary'
         );
 
+        const pokemonIconCss = classNames(
+            `pokemon-${dex}`,
+            {
+                alola: leaguePokemon.form === 'ALOLA'
+            }
+        );
+
         let type1 : JSX.Element | null = null;
         if (leaguePokemon.types.type1) {
             type1 = <div className={ `${pokemonType} ${leaguePokemon.types.type1}` }>{ leaguePokemon.types.type1 }</div>;
@@ -184,8 +191,11 @@ export class PokemonExplorer extends React.Component<IPokemonExplorerProps, ISta
                 <div>
                     <div className={ styles.pokemonInfoWrapper }>
                         <div className={ styles.pokemonInfoLeftColumn }>
-                            <i className={ `pokemon-${dex}` } />
+                            <i className={ pokemonIconCss } />
                             <h4>No.{ dex }</h4>
+                            { leaguePokemon.form &&
+                                <h6 className={ styles.formHeader }>{ leaguePokemon.form } Forme</h6>
+                            }
                             <div className={ styles.pokemonTypeWrapper }>
                                 { type1 }
                                 { type2 }

src/ts/app/components/PokemonExplorer/styles/PokemonExplorer.scss

@@ -30,6 +30,7 @@
 
   &:global(.nes-container) {
     padding: 0;
+    margin-bottom: 0;
     font-size: 0.7em;
     flex-basis: 50%;
   }
@@ -202,6 +203,11 @@
   }
 }
 
+.formHeader {
+  margin: 0;
+  text-transform: uppercase;
+}
+
 .pokemonBaseStats {
   display: block;
 }

src/ts/app/components/PokemonExplorer/styles/PokemonExplorer.scss.d.ts

@@ -1,6 +1,7 @@
 // This file is automatically generated.
 // Please do not change this file!
 export const fieldRow: string;
+export const formHeader: string;
 export const ivInput: string;
 export const leaguePokemonRank: string;
 export const pokemonBaseStats: string;

src/ts/app/components/PokemonSelectList/PokemonSelectList.tsx

@@ -84,6 +84,6 @@ export class PokemonSelectList extends React.Component<IPokemonSelectListProps,
             active: this.props.activePokemonIndex === index
         });
         const onClick = () => this.props.handleActivatePokemon(index);
-        return <div key={ index } style={ style } className={ css } onClick={ onClick }>{ pokemon.name }</div>;
+        return <div key={ index } style={ style } className={ css } onClick={ onClick }>{ pokemon.name + (pokemon.form ? ` (${pokemon.form})` : '') }</div>;
     }
 }

src/ts/app/models/Pokemon.ts

@@ -17,6 +17,7 @@ export type Type = 'bug' | 'dark' | 'dragon' | 'electric' | 'fairy' | 'fighting'
 export interface IPokemon {
     name : string;
     id : string;
+    form : string | null;
     family : string;
     dex : number;
     types : {