@scrabble-solver/scrabble-solver 2.8.6 → 2.8.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scrabble-solver/scrabble-solver",
-  "version": "2.8.6",
+  "version": "2.8.7",
   "description": "Scrabble Solver 2 - App",
   "engines": {
     "node": ">=16"
@@ -30,13 +30,13 @@
   "dependencies": {
     "@popperjs/core": "^2.11.6",
     "@reduxjs/toolkit": "^1.8.5",
-    "@scrabble-solver/configs": "^2.8.6",
-    "@scrabble-solver/constants": "^2.8.6",
-    "@scrabble-solver/dictionaries": "^2.8.6",
-    "@scrabble-solver/logger": "^2.8.6",
-    "@scrabble-solver/solver": "^2.8.6",
-    "@scrabble-solver/types": "^2.8.6",
-    "@scrabble-solver/word-definitions": "^2.8.6",
+    "@scrabble-solver/configs": "^2.8.7",
+    "@scrabble-solver/constants": "^2.8.7",
+    "@scrabble-solver/dictionaries": "^2.8.7",
+    "@scrabble-solver/logger": "^2.8.7",
+    "@scrabble-solver/solver": "^2.8.7",
+    "@scrabble-solver/types": "^2.8.7",
+    "@scrabble-solver/word-definitions": "^2.8.7",
     "classnames": "^2.3.2",
     "next": "^12.3.1",
     "normalize.css": "^8.0.1",
@@ -68,5 +68,5 @@
     "env-cmd": "^10.1.0",
     "sass": "^1.55.0"
   },
-  "gitHead": "ec130aa77ac64b91ab82e79f130eb69ac561fffa"
+  "gitHead": "879bf9b68f27fa3d530d0582fd8fbbcd5c8b150b"
 }

package/src/api/index.ts

@@ -1,10 +1,4 @@
 export { default as getServerLoggingData } from './getServerLoggingData';
-export { default as validateBoard } from './validateBoard';
-export { default as validateCell } from './validateCell';
-export { default as validateCharacter } from './validateCharacter';
-export { default as validateCharacters } from './validateCharacters';
-export { default as validateConfigId } from './validateConfigId';
-export { default as validateLocale } from './validateLocale';
-export { default as validateRow } from './validateRow';
-export { default as validateTile } from './validateTile';
-export { default as validateWord } from './validateWord';
+export { default as isBoardValid } from './isBoardValid';
+export { default as isCellValid } from './isCellValid';
+export { default as isRowValid } from './isRowValid';

package/src/api/isBoardValid.ts

@@ -0,0 +1,43 @@
+import { BoardJson, CellJson, Config } from '@scrabble-solver/types';
+
+import isRowValid from './isRowValid';
+
+const isBoardValid = (board: BoardJson, config: Config): boolean => {
+  if (board.length !== config.boardHeight) {
+    return false;
+  }
+
+  for (const row of board) {
+    if (!isRowValid(row, config)) {
+      return false;
+    }
+  }
+
+  return areTwoCharacterTilesValid(board, config);
+};
+
+const areTwoCharacterTilesValid = (board: CellJson[][], config: Config): boolean => {
+  const cells: CellJson[] = board
+    .flat()
+    .filter((cell) => cell && cell.tile && config.isTwoCharacterTilePrefix(cell.tile.character));
+
+  for (const cell of cells) {
+    for (const characters of config.twoCharacterTiles) {
+      const canCheckDown = cell.y + 1 < board.length;
+      const canCheckRight = cell.x + 1 < board[0].length;
+      const cellDown = board[cell.y + 1][cell.x];
+      const cellRight = board[cell.y][cell.x + 1];
+      const collidesDown = canCheckDown && cellDown.tile && cellDown.tile.character === characters[1];
+      const collidesRight = canCheckRight && cellRight.tile && cellRight.tile.character === characters[1];
+      const collides = collidesDown || collidesRight;
+
+      if (cell.tile && characters.startsWith(cell.tile.character) && collides) {
+        return false;
+      }
+    }
+  }
+
+  return true;
+};
+
+export default isBoardValid;

package/src/api/isCellValid.ts

@@ -0,0 +1,26 @@
+import { BLANK } from '@scrabble-solver/constants';
+import { CellJson, Config } from '@scrabble-solver/types';
+
+const isCellValid = (cell: CellJson, config: Config): boolean => {
+  const { isEmpty, tile, x, y } = cell;
+
+  if (x < 0 || x >= config.boardWidth) {
+    return false;
+  }
+
+  if (y < 0 || y >= config.boardHeight) {
+    return false;
+  }
+
+  if (isEmpty && tile !== null) {
+    return false;
+  }
+
+  if (tile !== null && !config.hasCharacter(tile.character) && tile.character !== BLANK) {
+    return false;
+  }
+
+  return true;
+};
+
+export default isCellValid;

package/src/api/isRowValid.ts

@@ -0,0 +1,19 @@
+import { CellJson, Config } from '@scrabble-solver/types';
+
+import isCellValid from './isCellValid';
+
+const isRowValid = (row: CellJson[], config: Config): boolean => {
+  if (row.length !== config.boardWidth) {
+    return false;
+  }
+
+  for (const cell of row) {
+    if (!isCellValid(cell, config)) {
+      return false;
+    }
+  }
+
+  return true;
+};
+
+export default isRowValid;

package/src/components/Dictionary/Dictionary.module.scss

@@ -7,6 +7,26 @@
   font-size: var(--font--size--s);
 }
 
+.result {
+  transition: var(--transition);
+
+  &.isAllowed {
+    & + & {
+      .content {
+        padding-top: 0;
+      }
+    }
+  }
+
+  &.isNotAllowed {
+    & + & {
+      .content {
+        padding-top: 0;
+      }
+    }
+  }
+}
+
 .content {
   padding: var(--spacing--l);
 }

package/src/components/Dictionary/Dictionary.tsx

@@ -14,44 +14,55 @@ interface Props {
 
 const Dictionary: FunctionComponent<Props> = ({ className }) => {
   const translate = useTranslate();
-  const { definitions, isAllowed, isLoading, word } = useTypedSelector(selectDictionary);
+  const { results, isLoading } = useTypedSelector(selectDictionary);
+  const isFirstAllowed = results.length > 0 ? results[0].isAllowed : undefined;
 
   return (
     <div
       className={classNames(styles.dictionary, className, {
-        [styles.isAllowed]: isAllowed === true,
-        [styles.isNotAllowed]: isAllowed === false,
+        [styles.isAllowed]: isFirstAllowed === true,
+        [styles.isNotAllowed]: isFirstAllowed === false,
       })}
     >
-      {typeof word === 'undefined' && (
-        <EmptyState type="info">{translate('dictionary.empty-state.uninitialized')}</EmptyState>
-      )}
-
-      {typeof word !== 'undefined' && (
-        <div className={styles.content}>
-          {word && <h2 className={styles.word}>{word}</h2>}
-
-          {isAllowed === false && <div>{translate('dictionary.empty-state.not-allowed')}</div>}
-
-          {isAllowed === true && (
-            <>
-              {definitions.length === 0 && <div>{translate('dictionary.empty-state.no-definitions')}</div>}
-
-              {definitions.length > 0 && (
-                <ul className={styles.definitions}>
-                  {definitions.map((result, index) => (
-                    <li key={index} className={styles.definition}>
-                      {result}
-                    </li>
-                  ))}
-                </ul>
-              )}
-            </>
+      {results.map(({ definitions, isAllowed, word }) => (
+        <div
+          className={classNames(styles.result, {
+            [styles.isAllowed]: isAllowed === true,
+            [styles.isNotAllowed]: isAllowed === false,
+          })}
+          key={word}
+        >
+          {typeof word === 'undefined' && (
+            <EmptyState type="info">{translate('dictionary.empty-state.uninitialized')}</EmptyState>
           )}
 
-          {!isLoading && isAllowed === null && <div>{translate('dictionary.empty-state.no-results')}</div>}
+          {typeof word !== 'undefined' && (
+            <div className={styles.content}>
+              {word && <h2 className={styles.word}>{word}</h2>}
+
+              {isAllowed === false && <div>{translate('dictionary.empty-state.not-allowed')}</div>}
+
+              {isAllowed === true && (
+                <>
+                  {definitions.length === 0 && <div>{translate('dictionary.empty-state.no-definitions')}</div>}
+
+                  {definitions.length > 0 && (
+                    <ul className={styles.definitions}>
+                      {definitions.map((result, index) => (
+                        <li key={index} className={styles.definition}>
+                          {result}
+                        </li>
+                      ))}
+                    </ul>
+                  )}
+                </>
+              )}
+
+              {!isLoading && isAllowed === null && <div>{translate('dictionary.empty-state.no-results')}</div>}
+            </div>
+          )}
         </div>
-      )}
+      ))}
 
       {isLoading && <Loading />}
     </div>

package/src/components/Results/Cell.tsx

@@ -11,12 +11,13 @@ import styles from './Results.module.scss';
 interface Props {
   className?: string;
   translationKey: TranslationKey;
+  tooltip?: string | number;
   value: string | number;
 }
 
-const Cell: FunctionComponent<Props> = ({ className, translationKey, value }) => {
+const Cell: FunctionComponent<Props> = ({ className, translationKey, tooltip, value }) => {
   const translate = useTranslate();
-  const triggerProps = useTooltip(`${translate(translationKey)}: ${value}`);
+  const triggerProps = useTooltip(`${translate(translationKey)}: ${tooltip || value}`);
 
   return (
     <span className={classNames(styles.cell, className)} {...triggerProps}>

package/src/components/Results/Result.tsx

@@ -16,6 +16,7 @@ const Result = ({ index, style }: Props): ReactElement => {
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const results = useTypedSelector(selectSortedFilteredResults)!;
   const result = results[index];
+  const otherWords = result.words.slice(1).join(' / ').toLocaleUpperCase();
 
   const handleClick = () => {
     dispatch(resultsSlice.actions.applyResult(result));
@@ -49,12 +50,21 @@ const Result = ({ index, style }: Props): ReactElement => {
       onMouseLeave={handleMouseLeave}
     >
       <span className={styles.resultContent}>
-        <Cell className={styles.word} translationKey="common.word" value={result.word} />
-        <Cell className={styles.stat} translationKey="common.tiles" value={result.numberOfTiles} />
-        <Cell className={styles.stat} translationKey="common.consonants" value={result.numberOfConsonants} />
-        <Cell className={styles.stat} translationKey="common.vowels" value={result.numberOfVowels} />
-        <Cell className={styles.stat} translationKey="common.blanks" value={result.numberOfBlanks} />
-        <Cell className={styles.stat} translationKey="common.words" value={result.numberOfWords} />
+        <Cell
+          className={styles.word}
+          translationKey="common.word"
+          value={`${result.word.toLocaleUpperCase()}${otherWords.length > 0 ? ` (${otherWords})` : ''}`}
+        />
+        <Cell className={styles.stat} translationKey="common.tiles" value={result.tilesCount} />
+        <Cell className={styles.stat} translationKey="common.consonants" value={result.consonantsCount} />
+        <Cell className={styles.stat} translationKey="common.vowels" value={result.vowelsCount} />
+        <Cell className={styles.stat} translationKey="common.blanks" value={result.blanksCount} />
+        <Cell
+          className={styles.stat}
+          translationKey="common.words"
+          tooltip={`${result.wordsCount} (${result.words.join(' / ').toLocaleUpperCase()})`}
+          value={result.wordsCount}
+        />
         <Cell className={styles.points} translationKey="common.points" value={result.points} />
       </span>
     </button>

package/src/components/ResultsInput/ResultsInput.tsx

@@ -1,7 +1,8 @@
 import classNames from 'classnames';
-import { ChangeEvent, FunctionComponent } from 'react';
+import { ChangeEvent, FunctionComponent, useState } from 'react';
 import { useDispatch } from 'react-redux';
 
+import { isRegExp } from 'lib';
 import { resultsSlice, selectResultsQuery, useTranslate, useTypedSelector } from 'state';
 
 import styles from './ResultsInput.module.scss';
@@ -14,9 +15,16 @@ const ResultsInput: FunctionComponent<Props> = ({ className }) => {
   const dispatch = useDispatch();
   const translate = useTranslate();
   const value = useTypedSelector(selectResultsQuery);
+  const [localValue, setLocalValue] = useState(value);
 
   const handleChange = (event: ChangeEvent<HTMLInputElement>) => {
-    dispatch(resultsSlice.actions.changeQuery(event.target.value));
+    const newValue = event.target.value;
+
+    setLocalValue(newValue);
+
+    if (isRegExp(newValue)) {
+      dispatch(resultsSlice.actions.changeQuery(newValue));
+    }
   };
 
   return (
@@ -25,7 +33,7 @@ const ResultsInput: FunctionComponent<Props> = ({ className }) => {
         className={styles.input}
         placeholder={translate('results.input.placeholder')}
         type="text"
-        value={value}
+        value={localValue}
         onChange={handleChange}
       />
     </form>

package/src/hooks/useIsTablet.ts

@@ -1,8 +1,8 @@
 import { useMedia } from 'react-use';
 
 const useIsTablet = (): boolean => {
-  const isTabletHeight = useMedia('(max-height: 800px)');
-  const isTabletWidth = useMedia('(max-width: 1024px)');
+  const isTabletHeight = useMedia('(max-height: 800px)', false);
+  const isTabletWidth = useMedia('(max-width: 1024px)', false);
   const isTablet = isTabletHeight || isTabletWidth;
   return isTablet;
 };

package/src/lib/getRemainingTiles.ts

@@ -11,7 +11,7 @@ const getRemainingTiles = (config: Config, board: Board, characters: string[]):
   const remainingTiles = Object.fromEntries(config.tiles.map((tile) => [tile.character, { ...tile, usedCount: 0 }]));
   const blank: RemainingTile = {
     character: BLANK,
-    count: config.numberOfBlanks,
+    count: config.blanksCount,
     score: config.blankScore,
     usedCount:
       nonEmptyCells.filter((cell) => cell.tile.isBlank).length +

package/src/lib/index.ts

@@ -15,8 +15,9 @@ export { default as getTotalRemainingTilesCount } from './getTotalRemainingTiles
 export { default as getTileSizes } from './getTileSizes';
 export { default as inverseDirection } from './inverseDirection';
 export { default as isCtrl } from './isCtrl';
-export { default as isLocale } from './isLocale';
 export { default as isMac } from './isMac';
+export { default as isRegExp } from './isRegExp';
+export { default as isStringArray } from './isStringArray';
 export { default as memoize } from './memoize';
 export { default as noop } from './noop';
 export { default as numberComparator } from './numberComparator';

package/src/lib/isRegExp.ts

@@ -0,0 +1,11 @@
+const isRegExp = (value: string): boolean => {
+  try {
+    // eslint-disable-next-line no-new
+    new RegExp(value);
+    return true;
+  } catch {
+    return false;
+  }
+};
+
+export default isRegExp;

package/src/lib/isStringArray.ts

@@ -0,0 +1,5 @@
+const isStringArray = (value: unknown): value is string[] => {
+  return Array.isArray(value) && value.every((item) => typeof item === 'string');
+};
+
+export default isStringArray;

package/src/lib/sortResults.ts

@@ -6,13 +6,13 @@ import createKeyComparator from './createKeyComparator';
 import reverseComparator from './reverseComparator';
 
 const comparators: Record<ResultColumn, Comparator<Result>> = {
-  [ResultColumn.BlanksCount]: createKeyComparator('numberOfBlanks'),
-  [ResultColumn.ConsonantsCount]: createKeyComparator('numberOfConsonants'),
+  [ResultColumn.BlanksCount]: createKeyComparator('blanksCount'),
+  [ResultColumn.ConsonantsCount]: createKeyComparator('consonantsCount'),
   [ResultColumn.Points]: createKeyComparator('points'),
-  [ResultColumn.TilesCount]: createKeyComparator('numberOfTiles'),
-  [ResultColumn.VowelsCount]: createKeyComparator('numberOfVowels'),
+  [ResultColumn.TilesCount]: createKeyComparator('tilesCount'),
+  [ResultColumn.VowelsCount]: createKeyComparator('vowelsCount'),
   [ResultColumn.Word]: createKeyComparator('word'),
-  [ResultColumn.WordsCount]: createKeyComparator('numberOfWords'),
+  [ResultColumn.WordsCount]: createKeyComparator('wordsCount'),
 };
 
 const sortResults = (

package/src/pages/api/dictionary/[locale]/[word].ts

@@ -1,45 +1,69 @@
+import { scrabble } from '@scrabble-solver/configs';
 import logger from '@scrabble-solver/logger';
-import { Locale } from '@scrabble-solver/types';
+import { isLocale, Locale } from '@scrabble-solver/types';
 import { getWordDefinition } from '@scrabble-solver/word-definitions';
 import { NextApiRequest, NextApiResponse } from 'next';
 
-import { getServerLoggingData, validateLocale, validateWord } from 'api';
+import { getServerLoggingData } from 'api';
 
 interface RequestData {
   locale: Locale;
-  word: string;
+  words: string[];
 }
 
+const MAXIMUM_WORDS_COUNT = scrabble['en-US'].maximumCharactersCount;
+
 const dictionary = async (request: NextApiRequest, response: NextApiResponse): Promise<void> => {
   const meta = getServerLoggingData(request);
 
   try {
-    const { locale, word } = parseRequest(request);
+    const { locale, words } = parseRequest(request);
+
     logger.info('dictionary - request', {
       meta,
       payload: {
         locale,
-        word,
+        words,
       },
     });
-    const result = await getWordDefinition(locale, word);
-    response.status(200).send(result.toJson());
+
+    const results = await Promise.all(words.map((word) => getWordDefinition(locale, word)));
+    response.status(200).send(results.map((result) => result.toJson()));
   } catch (error) {
     const message = error instanceof Error ? error.message : 'Unknown error';
     logger.error('dictionary - error', { error, meta });
     response.status(500).send({ error: 'Server error', message });
+    throw error;
   }
 };
 
 const parseRequest = (request: NextApiRequest): RequestData => {
   const { locale, word } = request.query;
 
-  validateLocale(locale);
-  validateWord(word);
+  if (!isLocale(locale)) {
+    throw new Error('Invalid "locale" parameter');
+  }
+
+  if (typeof word !== 'string' || word.length === 0) {
+    throw new Error('Invalid "word" parameter');
+  }
+
+  const words = Array.from(
+    new Set(
+      word
+        .split(',')
+        .map((part) => part.trim())
+        .filter(Boolean),
+    ),
+  );
+
+  if (words.length > MAXIMUM_WORDS_COUNT) {
+    throw new Error('Invalid "word" parameter');
+  }
 
   return {
-    locale: locale as Locale,
-    word: word as string,
+    locale,
+    words,
   };
 };
 

package/src/pages/api/solve.ts

@@ -1,12 +1,13 @@
-import { getLocaleConfig } from '@scrabble-solver/configs';
+import { getLocaleConfig, isConfigId } from '@scrabble-solver/configs';
 import { BLANK } from '@scrabble-solver/constants';
 import { dictionaries } from '@scrabble-solver/dictionaries';
 import logger from '@scrabble-solver/logger';
 import Solver from '@scrabble-solver/solver';
-import { Board, Config, Locale, Tile } from '@scrabble-solver/types';
+import { Board, Config, isBoardJson, isLocale, Locale, Tile } from '@scrabble-solver/types';
 import { NextApiRequest, NextApiResponse } from 'next';
 
-import { getServerLoggingData, validateBoard, validateCharacters, validateConfigId, validateLocale } from 'api';
+import { getServerLoggingData, isBoardValid } from 'api';
+import { isStringArray } from 'lib';
 
 interface RequestData {
   board: Board;
@@ -20,6 +21,7 @@ const solve = async (request: NextApiRequest, response: NextApiResponse): Promis
 
   try {
     const { board, characters, config, locale } = parseRequest(request);
+
     logger.info('solve - request', {
       meta,
       payload: {
@@ -31,7 +33,7 @@ const solve = async (request: NextApiRequest, response: NextApiResponse): Promis
         locale,
       },
     });
-    validateRequest({ board, characters, config, locale });
+
     const trie = await dictionaries.get(locale);
     const tiles = characters.map((character) => new Tile({ character, isBlank: character === BLANK }));
     const solver = new Solver(config, trie);
@@ -41,33 +43,51 @@ const solve = async (request: NextApiRequest, response: NextApiResponse): Promis
     const message = error instanceof Error ? error.message : 'Unknown error';
     logger.error('solve - error', { error, meta });
     response.status(500).send({ error: 'Server error', message });
+    throw error;
   }
 };
 
 const parseRequest = (request: NextApiRequest): RequestData => {
-  const { board, characters, configId, locale } = request.body;
+  const { board: boardJson, characters, configId, locale } = request.body;
+
+  if (!isLocale(locale)) {
+    throw new Error('Invalid "locale" parameter');
+  }
+
+  if (!isConfigId(configId)) {
+    throw new Error('Invalid "configId" parameter');
+  }
 
-  validateConfigId(configId);
-  validateLocale(locale);
   const config = getLocaleConfig(configId, locale);
-  validateBoard(board, config);
-  validateCharacters(characters, config);
 
-  return {
-    board: Board.fromJson(board),
-    characters,
-    config,
-    locale,
-  };
-};
+  if (!isBoardJson(boardJson) || !isBoardValid(boardJson, config)) {
+    throw new Error('Invalid "board" parameter');
+  }
+
+  if (!isStringArray(characters) || characters.length === 0) {
+    throw new Error('Invalid "characters" parameter');
+  }
 
-const validateRequest = ({ board, characters, config }: RequestData): void => {
+  for (const character of characters) {
+    if (!config.hasCharacter(character) && character !== BLANK) {
+      throw new Error('Invalid "characters" parameter');
+    }
+  }
+
+  const board = Board.fromJson(boardJson);
   const blankTilesCount = characters.filter((character) => character === BLANK).length;
   const blanksCount = board.getBlanksCount() + blankTilesCount;
 
-  if (blanksCount > config.numberOfBlanks) {
-    throw new Error(`Too many blank tiles passed (board: ${board.getBlanksCount()}, tiles: ${blankTilesCount})`);
+  if (blanksCount > config.blanksCount) {
+    throw new Error('Too many blank tiles passed');
   }
+
+  return {
+    board,
+    characters,
+    config,
+    locale,
+  };
 };
 
 export default solve;

package/src/pages/api/visit.ts

@@ -13,6 +13,7 @@ const visit = async (request: NextApiRequest, response: NextApiResponse): Promis
     const message = error instanceof Error ? error.message : 'Unknown error';
     logger.error('visit - error', { error, meta });
     response.status(500).send({ error: 'Server error', message });
+    throw error;
   }
 };
 

package/src/pages/index.module.scss

@@ -25,11 +25,15 @@
   padding: var(--spacing--l);
 }
 
-.logoContainer {
+.navLogo {
   display: flex;
   flex: 1;
 }
 
+.logoContainer {
+  display: flex;
+}
+
 .logo {
   height: 60px;
   user-select: none;
@@ -127,13 +131,3 @@
 .submitInput {
   display: none;
 }
-
-.version {
-  position: fixed;
-  bottom: var(--spacing--m);
-  left: 0;
-  right: 0;
-  font-size: var(--font--size--xs);
-  color: var(--color--background);
-  text-align: center;
-}