Merge pull request #376 from EmmaRamirez/release/1.4.7

Release/1.4.7

.gitignore

@@ -51,3 +51,5 @@ jspm_packages
 .node_repl_history
 
 imageCheck.js
+
+*.env.*

package.json

@@ -1,6 +1,6 @@
 {
   "name": "nuzlocke-generator",
-  "version": "1.4.5",
+  "version": "1.4.7",
   "description": "A tool for generating nuzlocke team pics from data",
   "main": "dist/bundle.js",
   "scripts": {

src/actions/editTrainer.ts

@@ -1,9 +1,10 @@
+import { Trainer } from 'models';
 import { Action } from './action';
 
 export type EDIT_TRAINER = 'EDIT_TRAINER';
 export const EDIT_TRAINER: EDIT_TRAINER = 'EDIT_TRAINER';
 
-export function editTrainer(edits: object): Action<EDIT_TRAINER> {
+export function editTrainer(edits: Partial<Trainer>): Action<EDIT_TRAINER, Partial<Trainer>> {
     return {
         type: EDIT_TRAINER,
         edits,

src/components/App/App.tsx

@@ -1,17 +1,17 @@
 import * as React from 'react';
 import { connect } from 'react-redux';
 
-import './app.css';
 import { State } from 'state';
 import { updateEditorHistory } from 'actions';
 import { feature } from 'utils';
-import { omit } from 'ramda';
 import { History } from 'reducers/editorHistory';
 import { ErrorBoundary } from 'components';
 import { Drawer } from '@blueprintjs/core';
+import { updaterSelector, appSelector } from 'selectors';
 
 const isEqual = require('lodash/isEqual');
 
+import './app.css';
 
 export interface AppProps {
     style: State['style'];
@@ -75,10 +75,7 @@ export class UpdaterBase extends React.Component<{
 }
 
 export const Updater = connect(
-    (state: State) => ({
-        present: omit(['editorHistory'], state),
-        lrt: state?.editorHistory?.lastRevisionType,
-    }),
+    updaterSelector,
     { updateEditorHistory },
     null,
     { pure: false },
@@ -151,8 +148,5 @@ export class AppBase extends React.PureComponent<AppProps, {result2?: boolean}>
 }
 
 export const App = connect(
-    (state: Pick<State, keyof State>) => ({
-        style: state.style,
-        view: state.view,
-    })
+    appSelector
 )(AppBase);

src/components/App/app.css

@@ -5,6 +5,9 @@
   margin: 0.5rem;
   padding: 1rem;
 }
+.release-notes ul img {
+    max-width: 100%;
+}
 .release-notes-wrapper h1 {
   font-size: 1.5rem !important;
   font-weight: bold;
@@ -43,10 +46,10 @@
 }
 .release-notes-wrapper ul {
     list-style-type: disc;
-    margin-left: 40px;
+    margin-left: 20px;
 }
 .release-notes-wrapper li > ul {
-    margin-left: 80px;
+    margin-left: 40px;
 }
 
 .bp3-dark .release-dialog h1,

src/components/GameEditor/NuzlockeGameTags.tsx

@@ -11,6 +11,8 @@ export interface NuzlockeGameTagsProps {
     data: State;
     color: string;
     isCopy: boolean;
+    /* size in kilobytes */
+    size: string;
 }
 
 export function NuzlockeGameTags({
@@ -20,6 +22,7 @@ export function NuzlockeGameTags({
     data,
     color,
     isCopy,
+    size,
 }: NuzlockeGameTagsProps) {
     return (
         <>
@@ -74,6 +77,17 @@ export function NuzlockeGameTags({
                             Copy
                         </Tag>
                     )}
+                    {size && (
+                        <Tag
+                            round
+                            style={{
+                                margin: '0 2px',
+                                background: 'rgba(0,0,0,0.1)',
+                                color: darkMode ? '#fff' : '#000',
+                            }}>
+                            {size}KB
+                        </Tag>
+                    )}
                 </div>
             </div>
         </>

src/components/GameEditor/NuzlockeSave.tsx

@@ -132,6 +132,7 @@ NuzlockeSaveControlsState
                                 data={parsedData}
                                 isCurrent={isCurrent}
                                 isCopy={isCopy}
+                                size={((data.length * 2) / 1024).toFixed(2)}
                             />
                             <DeleteAlert
                                 onConfirm={this.state.deletionFunction}

src/components/PokemonEditor/MassEditorTable.tsx

@@ -12,7 +12,7 @@ export interface MassEditorTableProps {
     editPokemon: editPokemonType;
 }
 
-const determineCell = (key: string, value: any, id, editPokemon) => {
+const determineCell = (key: keyof Pokemon, value: any, id, editPokemon) => {
     if (key === 'extraData') {
         return (
             <Cell>
@@ -23,6 +23,9 @@ const determineCell = (key: string, value: any, id, editPokemon) => {
     if (key === 'id') {
         return <Cell>{id}</Cell>;
     }
+    if (key === 'checkpoints') {
+        return <Cell><JSONFormat>{value}</JSONFormat></Cell>;
+    }
     return (
         <EditableCell
             onConfirm={(value) => {
@@ -37,18 +40,18 @@ const determineCell = (key: string, value: any, id, editPokemon) => {
     );
 };
 
-const cellRenderer: (pokemon: Pokemon[], key: string, editPokemon) => ICellRenderer = (
+const cellRenderer: (pokemon: Pokemon[], key: keyof Pokemon, editPokemon) => ICellRenderer = (
     pokemon: Pokemon[],
     key: string,
     editPokemon,
 ) => (rowIndex: number) => {
-    return determineCell(key, pokemon[rowIndex][key], pokemon[rowIndex].id, editPokemon);
+    return determineCell(key as keyof Pokemon, pokemon[rowIndex][key], pokemon[rowIndex].id, editPokemon);
 };
 
 export function renderColumns(pokemon, editPokemon) {
     return Object.keys(PokemonKeys).map((key) => {
         return (
-            <Column key={key} name={key} cellRenderer={cellRenderer(pokemon, key, editPokemon)} />
+            <Column key={key} name={key} cellRenderer={cellRenderer(pokemon, key as keyof Pokemon, editPokemon)} />
         );
     });
 }

src/components/Result/Result.tsx

@@ -26,6 +26,7 @@ import { State } from 'state';
 import isMobile from 'is-mobile';
 import { Button, Classes } from '@blueprintjs/core';
 import { editor } from 'reducers/editor';
+import { resultSelector } from 'selectors';
 
 async function load() {
     const resource = await import('@emmaramirez/dom-to-image');
@@ -476,18 +477,10 @@ export class ResultBase extends React.PureComponent<ResultProps, ResultState> {
     }
 }
 
-export const Result = connect<Partial<typeof reducers>, any, any>(
-    (state: Partial<typeof reducers>) => ({
-        pokemon: state.pokemon,
-        game: state.game,
-        trainer: state.trainer,
-        style: state.style,
-        box: state.box,
-        rules: state.rules,
-        editor: state.editor,
-    }),
+export const Result = connect(
+    resultSelector,
     {
         selectPokemon,
         toggleMobileResultView,
     },
-)(ResultBase);
+)(ResultBase as any);

src/components/Shared/Autocomplete.css

@@ -3,28 +3,45 @@
 }
 .autocomplete-items {
     list-style-type: none;
-    background: #111;
-    color: #eee;
     border-bottom-left-radius: 0.25rem;
     border-bottom-right-radius: 0.25rem;
     max-height: 200px;
     position: absolute;
     top: 2.5rem;
+    margin-top: 0;
     padding: 0;
     overflow: auto;
     width: 11.5rem;
     z-index: 11;
+    background: #ffffff;
+    color: #111;
 }
 .autocomplete-items li {
     cursor: pointer;
     padding: 3px;
 }
 .autocomplete-items li:hover {
-    background: rgba(238,238,238,0.1);
+    background: rgba(228, 228, 228, 0.267);
+}
+.autocomplete-selected {
+    color: rgb(37, 37, 223);
 }
 
 @media screen and (max-width: 720px) {
     .autocomplete-items {
         top: 2.25rem;
     }
 }
+
+.bp3-dark .autocomplete-items {
+    background: #111;
+    color: #eee;
+}
+
+.bp3-dark .autocomplete-items li:hover {
+    background: rgba(238,238,238,0.1);
+}
+
+.bp3-dark .autocomplete-selected {
+    color: rgb(37, 211, 223);
+}