@scrabble-solver/scrabble-solver 2.11.3 → 2.11.5

package/src/state/slices/rackInitialState.ts

@@ -1,5 +1,11 @@
-export type RackState = (string | null)[];
+import { Rack } from 'types';
 
-const rackInitialState: RackState = [null, null, null, null, null, null, null];
+import localStorage from '../localStorage';
+
+export type RackState = Rack;
+
+export const rackDefaultState: RackState = [null, null, null, null, null, null, null];
+
+const rackInitialState: RackState = localStorage.getRack() || rackDefaultState;
 
 export default rackInitialState;

package/src/state/slices/rackSlice.ts

@@ -1,9 +1,10 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import { Tile } from '@scrabble-solver/types';
 
-import { createNullMovingComparator, inverseDirection, zipCharactersAndTiles } from 'lib';
+import { arrayEquals, createNullMovingComparator, inverseDirection, zipCharactersAndTiles } from 'lib';
+import { AutoGroupTiles, Rack } from 'types';
 
-import rackInitialState from './rackInitialState';
+import rackInitialState, { rackDefaultState } from './rackInitialState';
 
 const rackSlice = createSlice({
   initialState: rackInitialState,
@@ -14,28 +15,30 @@ const rackSlice = createSlice({
       return [...state.slice(0, index), character, ...state.slice(index + 1)];
     },
 
-    changeCharacters: (state, action: PayloadAction<{ characters: (string | null)[]; index: number }>) => {
+    changeCharacters: (state, action: PayloadAction<{ characters: Rack; index: number }>) => {
       const { characters, index } = action.payload;
+
+      if (characters.length === 0) {
+        return state;
+      }
+
       const expectedRackLength = state.length;
       const rack = [...state.slice(0, index), ...characters, ...state.slice(index + characters.length)];
       return rack.slice(0, expectedRackLength);
     },
 
-    groupTiles: (state, action: PayloadAction<'left' | 'right' | null>) => {
-      const direction = action.payload;
-
-      if (direction === null) {
+    groupTiles: (state, action: PayloadAction<AutoGroupTiles>) => {
+      if (action.payload === null) {
         return state;
       }
 
-      const nullMovingComparator = createNullMovingComparator(inverseDirection(direction));
+      const nullMovingComparator = createNullMovingComparator(inverseDirection(action.payload));
       const sortedTiles = [...state].sort(nullMovingComparator);
-      return sortedTiles;
+      return arrayEquals(state, sortedTiles) ? state : sortedTiles;
     },
 
-    init: (_state, action: PayloadAction<(string | null)[]>) => {
-      const rack = action.payload;
-      return rack;
+    init: (state, action: PayloadAction<Rack>) => {
+      return arrayEquals(state, action.payload) ? state : action.payload;
     },
 
     removeTiles: (state, action: PayloadAction<Tile[]>) => {
@@ -45,7 +48,7 @@ const rackSlice = createSlice({
       return charactersWithoutMatchingTiles;
     },
 
-    reset: () => rackInitialState,
+    reset: () => rackDefaultState,
   },
 });
 

package/src/state/slices/settingsInitialState.ts

@@ -2,17 +2,22 @@ import { literaki, scrabble } from '@scrabble-solver/configs';
 import { Locale } from '@scrabble-solver/types';
 
 import { guessLocale } from 'lib';
+import { AutoGroupTiles } from 'types';
+
+import localStorage from '../localStorage';
 
 export interface SettingsState {
-  autoGroupTiles: 'left' | 'right' | null;
+  autoGroupTiles: AutoGroupTiles;
   configId: typeof literaki.id | typeof scrabble.id;
   locale: Locale;
 }
 
+const localStorageAutoGroupTiles = localStorage.getAutoGroupTiles();
+
 const settingsInitialState: SettingsState = {
-  autoGroupTiles: 'left',
-  configId: scrabble.id,
-  locale: guessLocale(),
+  autoGroupTiles: typeof localStorageAutoGroupTiles === 'undefined' ? 'left' : localStorageAutoGroupTiles,
+  configId: localStorage.getConfigId() || scrabble.id,
+  locale: localStorage.getLocale() || guessLocale(),
 };
 
 export default settingsInitialState;

package/src/state/slices/settingsSlice.ts

@@ -1,13 +1,15 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit';
 import { Locale } from '@scrabble-solver/types';
 
+import { AutoGroupTiles } from 'types';
+
 import settingsInitialState from './settingsInitialState';
 
 const settingsSlice = createSlice({
   initialState: settingsInitialState,
   name: 'settings',
   reducers: {
-    changeAutoGroupTiles: (state, action: PayloadAction<'left' | 'right' | null>) => {
+    changeAutoGroupTiles: (state, action: PayloadAction<AutoGroupTiles>) => {
       const autoGroupTiles = action.payload;
       return { ...state, autoGroupTiles };
     },

package/src/styles/animations.scss

@@ -18,16 +18,6 @@
   }
 }
 
-@keyframes progress {
-  0% {
-    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
-  }
-
-  100% {
-    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
-  }
-}
-
 @keyframes rotate {
   0% {
     transform: rotate(0deg);
@@ -38,16 +28,6 @@
   }
 }
 
-@keyframes pulse {
-  0% {
-    transform: scale(1);
-  }
-
-  100% {
-    transform: scale(1.2);
-  }
-}
-
 @keyframes wave {
   $offset: 6px;
 

package/src/styles/global.scss

@@ -23,13 +23,6 @@ body {
   font-family: var(--font--family);
   font-size: var(--font--size--m);
   line-height: var(--line-height);
-  overflow: hidden;
-}
-
-html,
-body,
-#__next {
-  height: 100%;
 }
 
 a {

package/src/styles/mixins.scss

@@ -110,62 +110,3 @@ $media-expressions: (
   text-shadow: $size 0 $color, (-$size) 0 $color, 0 $size $color, 0 (-$size) $color, (-$size) (-$size) $color,
     (-$size) $size $color, $size (-$size) $color, $size $size $color;
 }
-
-@mixin lighthouse-input-size-hack {
-  // Hack for this Lighthouse warning:
-  // > Interactive elements like buttons and links should be large enough (48x48px), and have
-  // > enough space around them, to be easy enough to tap without overlapping onto other elements.
-
-  input {
-    position: absolute;
-    top: -100%;
-    right: -100%;
-    left: -100%;
-    bottom: -100%;
-    width: 300%;
-    height: 300%;
-    clip-path: inset((100% / 3));
-  }
-
-  [dir='ltr'] & {
-    &:nth-child(1),
-    &:nth-child(2),
-    &:nth-child(3) {
-      input {
-        left: 0;
-        clip-path: polygon(0 (100% / 3), (100% / 3) (100% / 3), (100% / 3) (200% / 3), 0 (200% / 3));
-      }
-    }
-
-    &:nth-last-child(1),
-    &:nth-last-child(2),
-    &:nth-last-child(3) {
-      input {
-        left: -200%;
-        clip-path: polygon((200% / 3) (100% / 3), 100% (100% / 3), 100% (200% / 3), (200% / 3) (200% / 3));
-      }
-    }
-  }
-
-  [dir='rtl'] & {
-    &:nth-child(1),
-    &:nth-child(2),
-    &:nth-child(3) {
-      input {
-        left: -200%;
-        right: 0;
-        clip-path: polygon((200% / 3) (100% / 3), 100% (100% / 3), 100% (200% / 3), (200% / 3) (200% / 3));
-      }
-    }
-
-    &:nth-last-child(1),
-    &:nth-last-child(2),
-    &:nth-last-child(3) {
-      input {
-        left: 0;
-        right: -200%;
-        clip-path: polygon(0 (100% / 3), (100% / 3) (100% / 3), (100% / 3) (200% / 3), 0 (200% / 3));
-      }
-    }
-  }
-}

package/src/styles/variables.scss

@@ -108,13 +108,24 @@ $easeOutSine: cubic-bezier(0.61, 1, 0.88, 1);
 
   --button--icon--size: 24px;
   --dictionary--height: 260px;
+  --dictionary--height--mobile: 110px;
+  --logo--aspect-ratio: 682 / 166;
+  --logo--height: 60px;
   --modal--width: 370px;
+  --nav--height: calc(var(--logo--height) + var(--nav--padding));
+  --nav--padding: var(--spacing--l);
   --solver-column--width: 580px;
   --square-button--size: 32px;
   --text-input--height: 40px;
 
+  @include media('<l') {
+    --dictionary--height: var(--dictionary--height--mobile);
+    --logo--height: 48px;
+  }
+
   @include media('<s') {
     --box-shadow--blur: 5px;
+    --modal--width: 100%;
   }
 
   @include media('<xs') {

package/src/types/index.ts

@@ -1,5 +1,7 @@
 export type Comparator<T> = (a: T, B: T) => number;
 
+export type AutoGroupTiles = 'left' | 'right' | null;
+
 export type Direction = 'horizontal' | 'vertical';
 
 export interface Point {
@@ -7,6 +9,8 @@ export interface Point {
   y: number;
 }
 
+export type Rack = (string | null)[];
+
 export interface Sort {
   column: ResultColumn;
   direction: SortDirection;

package/.next/static/USLkKOoHbITebIEHkMGX_/_buildManifest.js

@@ -1 +0,0 @@
-self.__BUILD_MANIFEST={__rewrites:{beforeFiles:[],afterFiles:[],fallback:[]},"/":["static/css/885da289cec275b3.css","static/chunks/pages/index-0858deea02b2a417.js"],"/404":["static/chunks/pages/404-448ba28510855455.js"],"/_error":["static/chunks/pages/_error-54de1933a164a1ff.js"],sortedPages:["/","/404","/_app","/_error"]},self.__BUILD_MANIFEST_CB&&self.__BUILD_MANIFEST_CB();