@scrabble-solver/scrabble-solver 2.18.0 → 2.18.2

package/src/pages/_app.tsx

@@ -4,85 +4,49 @@ import Head from 'next/head';
 import { type FunctionComponent } from 'react';
 import { Provider } from 'react-redux';
 
-import { SeoMessage } from '@/components/SeoMessage';
+import { SITE_DESCRIPTION, SITE_URL } from '@/parameters';
 import { store } from '@/state';
 
 import '../styles/global.scss';
 
-const DESCRIPTION =
-  'Scrabble Solver 2 - Free and open-source analysis tool for Scrabble, Scrabble Duel, Super Scrabble, Letter League, Crossplay, Literaki and Kelimelik. Quickly find top scoring words using given letters and board state. Available in English, French, German, Persian, Polish, Romanian, Spanish, and Turkish.';
-
-const KEYWORDS = [
-  'Scrabble Solver',
-  'Scrabble',
-  'Scrabble Duel',
-  'Solver',
-  'Super Scrabble',
-  'Kelimelik',
-  'Letter League',
-  'Crossplay',
-  'NYT Crossplay',
-  'Literaki',
-  'Board',
-  'Open-source',
-  'Open',
-  'Source',
-  'Word',
-  'Finder',
-  'Cheating',
-  'Word',
-  'English',
-  'Français',
-  'French',
-  'Deutsch',
-  'German',
-  'Polski',
-  'Polish',
-  'فارسی',
-  'Farsi',
-  'Español',
-  'Spanish',
-  'Română',
-  'Romanian',
-  'Türkçe',
-  'Turkish',
-  'SOWPODS',
-  'TWL06',
-  'SJP',
-  'FISE-2017',
-  'FISE-2',
-  'CNRTL',
-  'Kamil Mielnik',
-].join(',');
-
-const App: FunctionComponent<AppProps> = ({ Component, pageProps }) => (
-  <>
-    <Head>
-      <title>Scrabble Solver 2</title>
-      <meta charSet="utf-8" />
-      <meta name="author" content="Kamil Mielnik" />
-      <meta name="description" content={DESCRIPTION} />
-      <meta name="keywords" content={KEYWORDS} />
-      <meta name="robots" content="index, follow, notranslate, noimageindex" />
-      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-      <meta property="og:title" content={DESCRIPTION} />
-      <meta property="og:type" content="website" />
-      <meta property="og:url" content="https://scrabble-solver.org" />
-      <meta property="og:image" content="https://scrabble-solver.org/og.png" />
-      <meta property="og:image:type" content="image/png" />
-      <meta property="og:image:width" content="1200" />
-      <meta property="og:image:height" content="630" />
-      <meta property="og:image:alt" content={DESCRIPTION} />
-    </Head>
-
-    <Provider store={store}>
-      <SeoMessage />
-
-      <FloatingDelayGroup delay={0}>
-        <Component {...pageProps} />
-      </FloatingDelayGroup>
-    </Provider>
-  </>
-);
+const TITLE = 'Scrabble Solver 2 - Board Solver & Word Finder';
+
+const App: FunctionComponent<AppProps> = ({ Component, pageProps, router }) => {
+  const isIndexable = router.pathname === '/';
+
+  return (
+    <>
+      <Head>
+        <title>{TITLE}</title>
+        <meta charSet="utf-8" />
+        <meta name="author" content="Kamil Mielnik" />
+        <meta name="description" content={SITE_DESCRIPTION} />
+        {isIndexable ? <link rel="canonical" href={`${SITE_URL}/`} /> : <meta name="robots" content="noindex" />}
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <meta property="og:site_name" content="Scrabble Solver" />
+        <meta property="og:title" content={TITLE} />
+        <meta property="og:description" content={SITE_DESCRIPTION} />
+        <meta property="og:type" content="website" />
+        <meta property="og:url" content={`${SITE_URL}/`} />
+        <meta property="og:locale" content="en_US" />
+        <meta property="og:image" content={`${SITE_URL}/og.png`} />
+        <meta property="og:image:type" content="image/png" />
+        <meta property="og:image:width" content="1200" />
+        <meta property="og:image:height" content="630" />
+        <meta property="og:image:alt" content="Scrabble tiles spelling out Scrabble Solver 2" />
+        <meta name="twitter:card" content="summary_large_image" />
+        <meta name="twitter:title" content={TITLE} />
+        <meta name="twitter:description" content={SITE_DESCRIPTION} />
+        <meta name="twitter:image" content={`${SITE_URL}/og.png`} />
+      </Head>
+
+      <Provider store={store}>
+        <FloatingDelayGroup delay={0}>
+          <Component {...pageProps} />
+        </FloatingDelayGroup>
+      </Provider>
+    </>
+  );
+};
 
 export default App;

package/src/pages/_document.tsx

@@ -70,27 +70,29 @@ export default class MyDocument extends Document {
         <InlineCssHead>
           {/* eslint-disable-next-line react/no-danger */}
           <script dangerouslySetInnerHTML={{ __html: preHydrationScript }} />
-          <link rel="apple-touch-icon-precomposed" sizes="57x57" href="icons/apple-touch-icon-57x57.png" />
-          <link rel="apple-touch-icon-precomposed" sizes="114x114" href="icons/apple-touch-icon-114x114.png" />
-          <link rel="apple-touch-icon-precomposed" sizes="72x72" href="icons/apple-touch-icon-72x72.png" />
-          <link rel="apple-touch-icon-precomposed" sizes="144x144" href="icons/apple-touch-icon-144x144.png" />
-          <link rel="apple-touch-icon-precomposed" sizes="60x60" href="icons/apple-touch-icon-60x60.png" />
-          <link rel="apple-touch-icon-precomposed" sizes="120x120" href="icons/apple-touch-icon-120x120.png" />
-          <link rel="apple-touch-icon-precomposed" sizes="76x76" href="icons/apple-touch-icon-76x76.png" />
-          <link rel="apple-touch-icon-precomposed" sizes="152x152" href="icons/apple-touch-icon-152x152.png" />
-          <link rel="icon" type="image/png" href="icons/favicon-196x196.png" sizes="196x196" />
-          <link rel="icon" type="image/png" href="icons/favicon-96x96.png" sizes="96x96" />
-          <link rel="icon" type="image/png" href="icons/favicon-32x32.png" sizes="32x32" />
-          <link rel="icon" type="image/png" href="icons/favicon-16x16.png" sizes="16x16" />
-          <link rel="icon" type="image/png" href="icons/favicon-128.png" sizes="128x128" />
-          <link rel="icon" href="icons/favicon.svg" />
+          <link rel="apple-touch-icon-precomposed" sizes="57x57" href="/icons/apple-touch-icon-57x57.png" />
+          <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/icons/apple-touch-icon-114x114.png" />
+          <link rel="apple-touch-icon-precomposed" sizes="72x72" href="/icons/apple-touch-icon-72x72.png" />
+          <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/icons/apple-touch-icon-144x144.png" />
+          <link rel="apple-touch-icon-precomposed" sizes="60x60" href="/icons/apple-touch-icon-60x60.png" />
+          <link rel="apple-touch-icon-precomposed" sizes="120x120" href="/icons/apple-touch-icon-120x120.png" />
+          <link rel="apple-touch-icon-precomposed" sizes="76x76" href="/icons/apple-touch-icon-76x76.png" />
+          <link rel="apple-touch-icon-precomposed" sizes="152x152" href="/icons/apple-touch-icon-152x152.png" />
+          <link rel="icon" type="image/png" href="/icons/favicon-196x196.png" sizes="196x196" />
+          <link rel="icon" type="image/png" href="/icons/favicon-96x96.png" sizes="96x96" />
+          <link rel="icon" type="image/png" href="/icons/favicon-32x32.png" sizes="32x32" />
+          <link rel="icon" type="image/png" href="/icons/favicon-16x16.png" sizes="16x16" />
+          <link rel="icon" type="image/png" href="/icons/favicon-128.png" sizes="128x128" />
+          <link rel="icon" href="/icons/favicon.svg" />
+          <link rel="manifest" href="/site.webmanifest" />
           <meta name="application-name" content="Scrabble Solver" />
+          <meta name="theme-color" content="#EFE3AE" />
           <meta name="msapplication-TileColor" content="#EFE3AE" />
-          <meta name="msapplication-TileImage" content="icons/mstile-144x144.png" />
-          <meta name="msapplication-square70x70logo" content="icons/mstile-70x70.png" />
-          <meta name="msapplication-square150x150logo" content="icons/mstile-150x150.png" />
-          <meta name="msapplication-wide310x150logo" content="icons/mstile-310x150.png" />
-          <meta name="msapplication-square310x310logo" content="icons/mstile-310x310.png" />
+          <meta name="msapplication-TileImage" content="/icons/mstile-144x144.png" />
+          <meta name="msapplication-square70x70logo" content="/icons/mstile-70x70.png" />
+          <meta name="msapplication-square150x150logo" content="/icons/mstile-150x150.png" />
+          <meta name="msapplication-wide310x150logo" content="/icons/mstile-310x150.png" />
+          <meta name="msapplication-square310x310logo" content="/icons/mstile-310x310.png" />
         </InlineCssHead>
 
         <body>

package/src/pages/api/verify.ts

@@ -5,6 +5,7 @@ import { Board, type Config, type Game, type Locale, isBoardJson, isGame, isLoca
 import { type NextApiRequest, type NextApiResponse } from 'next';
 
 import { getServerLoggingData, isBoardValid } from '@/api';
+import { type VerifiedWord } from '@/types';
 
 interface RequestData {
   board: Board;
@@ -31,15 +32,15 @@ const verify = async (request: NextApiRequest, response: NextApiResponse): Promi
     });
 
     const gaddag = await dictionaries.get(locale);
-    const words = board.getWords().sort((a, b) => a.localeCompare(b, locale));
-    const invalidWords: string[] = [];
-    const validWords: string[] = [];
+    const words = board.getWords().sort((a, b) => a.word.localeCompare(b.word, locale));
+    const invalidWords: VerifiedWord[] = [];
+    const validWords: VerifiedWord[] = [];
 
     for (const word of words) {
-      if (gaddag.has(word)) {
-        validWords.push(word);
+      if (gaddag.has(word.word)) {
+        validWords.push({ ...word, isValid: true });
       } else {
-        invalidWords.push(word);
+        invalidWords.push({ ...word, isValid: false });
       }
     }
 

package/src/pages/index.tsx

@@ -6,7 +6,7 @@ import { execSync } from 'child_process';
 import fs from 'fs';
 import dynamic from 'next/dynamic';
 import path from 'path';
-import { type FunctionComponent, useCallback, useEffect, useState } from 'react';
+import { type FunctionComponent, useCallback, useEffect, useRef, useState } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { Logo } from '@/components/Logo';
@@ -14,13 +14,23 @@ import { NavButtons } from '@/components/NavButtons';
 import { Solver } from '@/components/Solver';
 import { useDirection } from '@/hooks/useDirection';
 import { useEffectOnce } from '@/hooks/useEffectOnce';
+import { useIsCompactLayout } from '@/hooks/useIsCompactLayout';
 import { useLanguage } from '@/hooks/useLanguage';
 import { useLocalStorage } from '@/hooks/useLocalStorage';
 import { LOCALE_FEATURES } from '@/i18n/constants';
 import { schedulePreloadModals } from '@/modals/preload';
-import { CONFIG_PENDING_CLASS } from '@/parameters';
+import { CONFIG_PENDING_CLASS, GITHUB_PROJECT_URL, NPM_PACKAGE_URL, SITE_DESCRIPTION, SITE_URL } from '@/parameters';
 import { registerServiceWorker } from '@/serviceWorkerManager';
-import { initialize, reset, selectConfig, selectIsHydrated, selectLocale, useTypedSelector } from '@/state';
+import {
+  hoveredWordSlice,
+  initialize,
+  reset,
+  resultsSlice,
+  selectConfig,
+  selectIsHydrated,
+  selectLocale,
+  useTypedSelector,
+} from '@/state';
 
 import styles from './index.module.scss';
 
@@ -49,6 +59,30 @@ const WordsModal = dynamic(() => import('@/modals/WordsModal').then((module) =>
   ssr: false,
 });
 
+const WEB_APPLICATION_JSON_LD = JSON.stringify({
+  '@context': 'https://schema.org',
+  '@type': 'WebApplication',
+  name: 'Scrabble Solver',
+  alternateName: 'Scrabble Solver 2',
+  url: `${SITE_URL}/`,
+  description: SITE_DESCRIPTION,
+  applicationCategory: 'GameApplication',
+  operatingSystem: 'Any',
+  browserRequirements: 'Requires JavaScript',
+  image: `${SITE_URL}/og.png`,
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'USD' },
+  inLanguage: ['en-US', 'en-GB', 'de-DE', 'es-ES', 'fa-IR', 'fr-FR', 'pl-PL', 'ro-RO', 'tr-TR'],
+  featureList: [
+    'Finds the highest-scoring words for a given board and rack',
+    'Supports Scrabble, Super Scrabble, Scrabble Duel, Letter League, Crossplay, Literaki, and Kelimelik',
+    'Dictionaries and word definitions in 8 languages',
+    'Works offline once a dictionary is cached',
+    'Free, open source, no ads, no sign-up',
+  ],
+  sameAs: [GITHUB_PROJECT_URL, NPM_PACKAGE_URL],
+  author: { '@type': 'Person', name: 'Kamil Mielnik', url: 'https://kamilmielnik.com' },
+});
+
 interface Props {
   version: string;
 }
@@ -60,6 +94,8 @@ const Index: FunctionComponent<Props> = ({ version }) => {
   const config = useTypedSelector(selectConfig);
   const locale = useTypedSelector(selectLocale);
   const isHydrated = useTypedSelector(selectIsHydrated);
+  const isCompactLayout = useIsCompactLayout();
+  const previousIsCompactLayout = useRef(isCompactLayout);
   const [modals, setModals] = useState<Record<Modal, boolean>>({
     dictionary: false,
     keyMap: false,
@@ -107,6 +143,7 @@ const Index: FunctionComponent<Props> = ({ version }) => {
   const handleCloseResults = useCallback(() => patchModals({ results: false }), [patchModals]);
   const handleCloseSettings = useCallback(() => patchModals({ settings: false }), [patchModals]);
   const handleCloseWords = useCallback(() => patchModals({ words: false }), [patchModals]);
+  const handlePreviewWord = useCallback(() => patchModals({ menu: false, words: false }), [patchModals]);
 
   useDirection(LOCALE_FEATURES[locale].direction);
   useLanguage(locale);
@@ -135,6 +172,16 @@ const Index: FunctionComponent<Props> = ({ version }) => {
     }
   }, [isHydrated]);
 
+  useEffect(() => {
+    if (previousIsCompactLayout.current === isCompactLayout) {
+      return;
+    }
+
+    previousIsCompactLayout.current = isCompactLayout;
+    dispatch(resultsSlice.actions.changeResultCandidate(null));
+    dispatch(hoveredWordSlice.actions.clear());
+  }, [dispatch, isCompactLayout]);
+
   useEffectOnce(() => {
     if (process.env.NODE_ENV === 'production') {
       // eslint-disable-next-line @typescript-eslint/no-floating-promises
@@ -149,11 +196,11 @@ const Index: FunctionComponent<Props> = ({ version }) => {
     <>
       <nav className={styles.nav}>
         <div className={styles.navContent}>
-          <div className={styles.navLogo}>
+          <h1 className={styles.navLogo}>
             <a className={styles.logoContainer} href="/" title={version}>
               <Logo className={styles.logo} />
             </a>
-          </div>
+          </h1>
 
           <NavButtons
             onClear={handleClear}
@@ -170,6 +217,9 @@ const Index: FunctionComponent<Props> = ({ version }) => {
         <Solver className={styles.solver} onShowResults={handleShowResults} />
       </main>
 
+      {/* eslint-disable-next-line react/no-danger */}
+      <script dangerouslySetInnerHTML={{ __html: WEB_APPLICATION_JSON_LD }} type="application/ld+json" />
+
       {mountedModals.menu && (
         <MenuModal
           isOpen={modals.menu}
@@ -185,7 +235,9 @@ const Index: FunctionComponent<Props> = ({ version }) => {
 
       {mountedModals.keyMap && <KeyMapModal isOpen={modals.keyMap} onClose={handleCloseKeyMap} />}
 
-      {mountedModals.words && <WordsModal isOpen={modals.words} onClose={handleCloseWords} />}
+      {mountedModals.words && (
+        <WordsModal isOpen={modals.words} onClose={handleCloseWords} onPreview={handlePreviewWord} />
+      )}
 
       {config.supportsRemainingTiles && mountedModals.remainingTiles && (
         <RemainingTilesModal isOpen={modals.remainingTiles} onClose={handleCloseRemainingTiles} />

package/src/pages/not-found.tsx

@@ -1,5 +1,16 @@
-'use-client';
+import Head from 'next/head';
+import { type FunctionComponent } from 'react';
 
 import { NotFound } from '@/components/NotFound';
 
-export default NotFound;
+const NotFoundPage: FunctionComponent = () => (
+  <>
+    <Head>
+      <title>Page not found - Scrabble Solver</title>
+    </Head>
+
+    <NotFound />
+  </>
+);
+
+export default NotFoundPage;

package/src/parameters/index.ts

@@ -8,8 +8,17 @@ export const BREAKPOINTS = {
   xl: Number(variables.breakpointXl),
 };
 
+export const BREAKPOINT_HEIGHT_L = Number(variables.breakpointHeightL);
+
 export const GITHUB_PROJECT_URL = 'https://github.com/kamilmielnik/scrabble-solver';
 
+export const NPM_PACKAGE_URL = 'https://www.npmjs.com/package/scrabble-solver';
+
+export const SITE_URL = 'https://scrabble-solver.org';
+
+export const SITE_DESCRIPTION =
+  'Free, open-source board solver and word finder for Scrabble, Letter League, and Literaki. Enter your letters and board to get the highest-scoring words.';
+
 // Must match the class name in global.scss
 export const CONFIG_PENDING_CLASS = 'config-pending';
 

package/src/sdk/verify.ts

@@ -1,6 +1,7 @@
 import { type BoardJson, type Game, type Locale } from '@scrabble-solver/types';
 
 import { verifyLocally } from '@/solver-worker';
+import { type VerifiedWord } from '@/types';
 
 import { fetchJson } from './fetchJson';
 
@@ -11,8 +12,8 @@ interface Payload {
 }
 
 interface Response {
-  invalidWords: string[];
-  validWords: string[];
+  invalidWords: VerifiedWord[];
+  validWords: VerifiedWord[];
 }
 
 export const verify = async ({ board, game, locale }: Payload): Promise<Response> => {

package/src/solver-worker/client.test.ts

@@ -2,7 +2,7 @@ import { type ResultJson } from '@scrabble-solver/types';
 import { afterAll, beforeEach, describe, expect, it } from 'bun:test';
 
 import type * as clientModule from './client';
-import { type SolverWorkerRequest, type SolverWorkerResponse } from './messages';
+import { type SolverWorkerRequest, type SolverWorkerResponse, type VerifyResult } from './messages';
 
 type Listener = (event: { data: SolverWorkerResponse }) => void;
 
@@ -102,9 +102,9 @@ describe('solver worker client', () => {
 
   it('resolves a verify with the worker words', async () => {
     const verify = verifyLocally(verifyPayload);
-    respond({ data: { invalidWords: ['zz'], validWords: ['ab'] }, id: lastRequestId(), outcome: 'answered' });
+    respond({ data: createVerifyResult(), id: lastRequestId(), outcome: 'answered' });
 
-    expect(await verify).toEqual({ invalidWords: ['zz'], validWords: ['ab'] });
+    expect(await verify).toEqual(createVerifyResult());
   });
 
   it('does not wait for a prefetch to answer', () => {
@@ -149,3 +149,10 @@ function lastRequestId(): number {
 function createResults(word: string): ResultJson[] {
   return [{ blankIndices: [], id: 0, isHorizontal: true, points: 1, tiles: word.split(''), x: 0, y: 0 }];
 }
+
+function createVerifyResult(): VerifyResult {
+  return {
+    invalidWords: [{ direction: 'horizontal', isValid: false, word: 'zz', x: 0, y: 0 }],
+    validWords: [{ direction: 'vertical', isValid: true, word: 'ab', x: 3, y: 5 }],
+  };
+}

package/src/solver-worker/index.worker.ts

@@ -5,7 +5,7 @@ import { BLANK } from '@scrabble-solver/constants';
 import { solve } from '@scrabble-solver/solver';
 import { Board, type Locale, Tile } from '@scrabble-solver/types';
 
-import { type SolveRequestPayload, type VerifyRequestPayload } from '@/types';
+import { type SolveRequestPayload, type VerifiedWord, type VerifyRequestPayload } from '@/types';
 
 import { revalidateDictionary } from './dictionaries';
 import { getGaddag } from './getGaddag';
@@ -64,15 +64,15 @@ async function handleVerify(
   }
 
   const board = Board.fromJson(boardJson);
-  const words = board.getWords().sort((a, b) => a.localeCompare(b, locale));
-  const invalidWords: string[] = [];
-  const validWords: string[] = [];
+  const words = board.getWords().sort((a, b) => a.word.localeCompare(b.word, locale));
+  const invalidWords: VerifiedWord[] = [];
+  const validWords: VerifiedWord[] = [];
 
   for (const word of words) {
-    if (gaddag.has(word)) {
-      validWords.push(word);
+    if (gaddag.has(word.word)) {
+      validWords.push({ ...word, isValid: true });
     } else {
-      invalidWords.push(word);
+      invalidWords.push({ ...word, isValid: false });
     }
   }
 

package/src/solver-worker/messages.ts

@@ -1,10 +1,10 @@
 import { type Locale, type ResultJson } from '@scrabble-solver/types';
 
-import { type SolveRequestPayload, type VerifyRequestPayload } from '@/types';
+import { type SolveRequestPayload, type VerifiedWord, type VerifyRequestPayload } from '@/types';
 
 export interface VerifyResult {
-  invalidWords: string[];
-  validWords: string[];
+  invalidWords: VerifiedWord[];
+  validWords: VerifiedWord[];
 }
 
 export type SolverWorkerRequest =

package/src/state/hoveredWord/index.ts

@@ -0,0 +1,4 @@
+export * from './initialState';
+export * from './selectors';
+export * from './slice';
+export * from './types';

package/src/state/hoveredWord/initialState.ts

@@ -0,0 +1,5 @@
+import type { HoveredWordState } from './types';
+
+export const hoveredWordInitialState: HoveredWordState = {
+  word: null,
+};

package/src/state/hoveredWord/selectors.ts

@@ -0,0 +1,5 @@
+import type { VerifiedWord } from '@/types';
+
+import type { RootState } from '../types';
+
+export const selectHoveredWord = (state: RootState): VerifiedWord | null => state.hoveredWord.word;

package/src/state/hoveredWord/slice.ts

@@ -0,0 +1,18 @@
+import { createSlice, type PayloadAction } from '@reduxjs/toolkit';
+
+import { type VerifiedWord } from '@/types';
+
+import { hoveredWordInitialState } from './initialState';
+
+export const hoveredWordSlice = createSlice({
+  initialState: hoveredWordInitialState,
+  name: 'hoveredWord',
+  reducers: {
+    set: (state, action: PayloadAction<VerifiedWord>) => {
+      state.word = action.payload;
+    },
+    clear: (state) => {
+      state.word = null;
+    },
+  },
+});

package/src/state/hoveredWord/types.ts

@@ -0,0 +1,5 @@
+import type { VerifiedWord } from '@/types';
+
+export interface HoveredWordState {
+  word: VerifiedWord | null;
+}

package/src/state/index.ts

@@ -4,6 +4,7 @@ export * from './board';
 export * from './cellFilters';
 export * from './dictionary';
 export * from './hoveredTile';
+export * from './hoveredWord';
 export * from './i18n';
 export * from './localStorage';
 export * from './rack';

package/src/state/localStorage.ts

@@ -1,7 +1,8 @@
 import { Board, type BoardJson, isObject, type Locale } from '@scrabble-solver/types';
 import store2 from 'store2';
 
-import type { Rack, Translations } from '@/types';
+import { englishTranslations } from '@/i18n/i18n';
+import type { Rack, TranslationKey, Translations } from '@/types';
 
 import type { SettingsState } from './settings/types';
 
@@ -80,7 +81,13 @@ export const localStorage = {
       return undefined;
     }
 
-    if (!isObject(stored) || stored.locale !== locale || stored.version !== version || !isObject(stored.translations)) {
+    if (
+      !isObject(stored) ||
+      stored.locale !== locale ||
+      stored.version !== version ||
+      !isObject(stored.translations) ||
+      !hasEveryTranslation(stored.translations)
+    ) {
       store.remove(TRANSLATIONS);
       return undefined;
     }
@@ -93,6 +100,10 @@ export const localStorage = {
   },
 };
 
+function hasEveryTranslation(translations: Translations): boolean {
+  return (Object.keys(englishTranslations) as TranslationKey[]).every((key) => typeof translations[key] === 'string');
+}
+
 /**
  * Introduced in 2.15.26 on 2026/04/27.
  * Life expectancy: 1y.

package/src/state/results/lib.ts

@@ -1,25 +1,15 @@
 import { type Result, type ShowCoordinates } from '@scrabble-solver/types';
 
+import { createCoordinatesComparator } from '@/lib/createCoordinatesComparator';
 import { createKeyComparator } from '@/lib/createKeyComparator';
 import { createRegExp } from '@/lib/createRegExp';
-import { createStringComparator } from '@/lib/createStringComparator';
-import { getCoordinate } from '@/lib/getCoordinate';
-import { reverseComparator } from '@/lib/reverseComparator';
-import {
-  type CellFilter,
-  type Comparator,
-  type GroupedResults,
-  ResultColumnId,
-  type Sort,
-  SortDirection,
-} from '@/types';
+import { createSortComparator } from '@/lib/createSortComparator';
+import { getCoordinates as getPointCoordinates } from '@/lib/getCoordinates';
+import { type CellFilter, type ComparatorFactory, type GroupedResults, ResultColumnId, type Sort } from '@/types';
 
 export const getCoordinates = (result: Result, showCoordinates: ShowCoordinates): string => {
   const firstCell = result.cells[0];
-  const x = getCoordinate(firstCell.x, showCoordinates === 'original' ? 'letter' : 'number');
-  const y = getCoordinate(firstCell.y, showCoordinates === 'original' ? 'number' : 'letter');
-
-  return result.isHorizontal() ? `${y}${x}` : `${x}${y}`;
+  return getPointCoordinates({ isHorizontal: result.isHorizontal(), x: firstCell.x, y: firstCell.y }, showCoordinates);
 };
 
 export const groupResults = (
@@ -69,14 +59,11 @@ export const resultMatchesCellFilter = (result: Result, cellFilters: CellFilter[
   return matchesExcludeFilters && matchesIncludeFilters;
 };
 
-const comparators: Record<ResultColumnId, (locale: string, showCoordinates: ShowCoordinates) => Comparator<Result>> = {
+const comparators: Record<ResultColumnId, ComparatorFactory<Result>> = {
   [ResultColumnId.BlanksCount]: (locale: string) => createKeyComparator('blanksCount', locale),
   [ResultColumnId.ConsonantsCount]: (locale: string) => createKeyComparator('consonantsCount', locale),
-  [ResultColumnId.Coordinates]: (locale: string, showCoordinates: ShowCoordinates) => (a, b) => {
-    const stringComparator = createStringComparator(locale);
-    const aValue = getCoordinates(a, showCoordinates);
-    const bValue = getCoordinates(b, showCoordinates);
-    return stringComparator(aValue, bValue);
+  [ResultColumnId.Coordinates]: (locale: string, showCoordinates: ShowCoordinates) => {
+    return createCoordinatesComparator({ getItemCoordinates: getCoordinates, locale, showCoordinates });
   },
   [ResultColumnId.Points]: (locale: string) => createKeyComparator('points', locale),
   [ResultColumnId.TilesCount]: (locale: string) => createKeyComparator('tilesCount', locale),
@@ -95,9 +82,5 @@ export const sortResults = (
     return undefined;
   }
 
-  const createComparator = comparators[sort.column];
-  const comparator = createComparator(locale, showCoordinates);
-  const finalComparator = sort.direction === SortDirection.Descending ? reverseComparator(comparator) : comparator;
-  const sortedResults = [...results].sort(finalComparator);
-  return sortedResults;
+  return [...results].sort(createSortComparator({ comparators, locale, showCoordinates, sort }));
 };