scrabble-solver 2.18.10-alpha.0 → 2.18.10-alpha.2

package/packages/scrabble-solver/src/pages/api/verify.ts

@@ -0,0 +1,78 @@
+import { getConfig, hasConfig } from '@scrabble-solver/configs';
+import { dictionaries } from '@scrabble-solver/dictionaries';
+import { logEvent } from '@scrabble-solver/logger';
+import { type Config, type Game, type Locale, Board, isBoardJson, isGame, isLocale } from '@scrabble-solver/types';
+import { type NextApiRequest, type NextApiResponse } from 'next';
+
+import { type ApiContext, BadRequestError, isBoardValid, withApiLog } from '@/api';
+import { type VerifiedWord } from '@/types';
+
+interface RequestData {
+  board: Board;
+  config: Config;
+  game: Game;
+  locale: Locale;
+}
+
+export default withApiLog('verify', verify);
+
+async function verify(request: NextApiRequest, response: NextApiResponse, { ip, getElapsedMs }: ApiContext) {
+  const { board, game, locale } = parseRequest(request);
+  const gaddag = await dictionaries.get(locale);
+  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.word)) {
+      validWords.push({ ...word, isValid: true });
+    } else {
+      invalidWords.push({ ...word, isValid: false });
+    }
+  }
+
+  response.status(200).send({ invalidWords, validWords });
+
+  logEvent({
+    type: 'verify',
+    ip,
+    ms: getElapsedMs(),
+    locale,
+    game,
+    tiles: board.getTilesCount(),
+    blanks: board.getBlanksCount(),
+    valid: validWords.length,
+    invalid: invalidWords.length,
+  });
+}
+
+function parseRequest(request: NextApiRequest): RequestData {
+  const { board: boardJson, game, locale } = request.body;
+
+  if (!isLocale(locale)) {
+    throw new BadRequestError('Invalid "locale" parameter');
+  }
+
+  if (!isGame(game)) {
+    throw new BadRequestError('Invalid "game" parameter');
+  }
+
+  if (!hasConfig(game, locale)) {
+    throw new BadRequestError(`No game "${game}" in "${locale}"`);
+  }
+
+  const config = getConfig(game, locale);
+
+  if (!isBoardJson(boardJson) || !isBoardValid(boardJson, config)) {
+    throw new BadRequestError('Invalid "board" parameter');
+  }
+
+  const board = Board.fromJson(boardJson);
+
+  return {
+    board,
+    config,
+    game,
+    locale,
+  };
+}

package/packages/scrabble-solver/src/pages/api/visit.ts

@@ -0,0 +1,44 @@
+import { logEvent } from '@scrabble-solver/logger';
+import { isGame, isLocale, isObject } from '@scrabble-solver/types';
+import { type NextApiRequest, type NextApiResponse } from 'next';
+
+import { type ApiContext, withApiLog } from '@/api';
+
+interface RequestData {
+  game: string | undefined;
+  locale: string | undefined;
+  referrer: string | undefined;
+  url: string | undefined;
+}
+
+const URL_MAX_LENGTH = 256;
+
+export default withApiLog('visit', visit);
+
+function visit(request: NextApiRequest, response: NextApiResponse, { ip, ua }: ApiContext) {
+  const { game, locale, referrer, url } = parseRequest(request);
+  response.status(200).send(true);
+  logEvent({ type: 'visit', ip, ua, referrer, locale, game, url });
+}
+
+// A visit is only a ping - unexpected fields are ignored, never rejected.
+function parseRequest(request: NextApiRequest): RequestData {
+  const body: unknown = request.body;
+
+  if (!isObject(body)) {
+    return { game: undefined, locale: undefined, referrer: undefined, url: undefined };
+  }
+
+  const { game, locale, referrer, url } = body;
+
+  return {
+    game: isGame(game) ? game : undefined,
+    locale: isLocale(locale) ? locale : undefined,
+    referrer: parseUrl(referrer),
+    url: parseUrl(url),
+  };
+}
+
+function parseUrl(value: unknown): string | undefined {
+  return typeof value === 'string' && value.length > 0 ? value.slice(0, URL_MAX_LENGTH) : undefined;
+}

package/packages/scrabble-solver/src/pages/index.module.scss

@@ -0,0 +1,31 @@
+.nav {
+  position: relative;
+  z-index: 1;
+  flex: 0 0 auto;
+}
+
+.navContent {
+  width: 100%;
+  display: flex;
+  align-items: flex-start;
+  padding: var(--nav--padding);
+}
+
+.navLogo {
+  display: flex;
+  flex: 1;
+}
+
+.logoContainer {
+  display: flex;
+}
+
+.logo {
+  height: var(--logo--height);
+  width: auto;
+  user-select: none;
+}
+
+.solver {
+  flex: 1;
+}

package/packages/scrabble-solver/src/pages/index.module.scss.d.ts

@@ -0,0 +1,11 @@
+// Generated by scripts/generate-scss-types.ts - do not edit.
+declare const styles: {
+  readonly logo: string;
+  readonly logoContainer: string;
+  readonly nav: string;
+  readonly navContent: string;
+  readonly navLogo: string;
+  readonly solver: string;
+};
+
+export default styles;

package/packages/scrabble-solver/src/pages/index.tsx

@@ -0,0 +1,274 @@
+/* eslint-disable max-lines, max-statements */
+
+import { games } from '@scrabble-solver/configs';
+import { isObject } from '@scrabble-solver/types';
+import { execSync } from 'child_process';
+import fs from 'fs';
+import dynamic from 'next/dynamic';
+import path from 'path';
+import { type FunctionComponent, useCallback, useEffect, useRef, useState } from 'react';
+import { useDispatch } from 'react-redux';
+
+import { Logo } from '@/components/Logo';
+import { NavButtons } from '@/components/NavButtons';
+import { Solver } from '@/components/Solver';
+import { useDirection } from '@/hooks/useDirection';
+import { useEffectOnce } from '@/hooks/useEffectOnce';
+import { useLanguage } from '@/hooks/useLanguage';
+import { useLocalStorage } from '@/hooks/useLocalStorage';
+import { useMediaQuery } from '@/hooks/useMediaQuery';
+import { LOCALE_FEATURES } from '@/i18n/constants';
+import { schedulePreloadModals } from '@/modals/preload';
+import { CONFIG_PENDING_CLASS, GITHUB_PROJECT_URL, NPM_PACKAGE_URL, SITE_DESCRIPTION, SITE_URL } from '@/parameters';
+import { registerServiceWorker } from '@/serviceWorkerManager';
+import {
+  hoveredWordSlice,
+  initialize,
+  reset,
+  resultsSlice,
+  selectConfig,
+  selectIsHydrated,
+  selectLocale,
+  useTypedSelector,
+} from '@/state';
+
+import styles from './index.module.scss';
+
+const DictionaryModal = dynamic(() => import('@/modals/DictionaryModal').then((module) => module.DictionaryModal), {
+  ssr: false,
+});
+const KeyMapModal = dynamic(() => import('@/modals/KeyMapModal').then((module) => module.KeyMapModal), {
+  ssr: false,
+});
+const MenuModal = dynamic(() => import('@/modals/MenuModal').then((module) => module.MenuModal), {
+  ssr: false,
+});
+const RemainingTilesModal = dynamic(
+  () => import('@/modals/RemainingTilesModal').then((module) => module.RemainingTilesModal),
+  {
+    ssr: false,
+  },
+);
+const ResultsModal = dynamic(() => import('@/modals/ResultsModal').then((module) => module.ResultsModal), {
+  ssr: false,
+});
+const SettingsModal = dynamic(() => import('@/modals/SettingsModal').then((module) => module.SettingsModal), {
+  ssr: false,
+});
+const WordsModal = dynamic(() => import('@/modals/WordsModal').then((module) => module.WordsModal), {
+  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, Kelimelik, Wyrazy, and Wordfeud',
+    '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;
+}
+
+type Modal = 'dictionary' | 'keyMap' | 'menu' | 'remainingTiles' | 'results' | 'settings' | 'words';
+
+const Index: FunctionComponent<Props> = ({ version }) => {
+  const dispatch = useDispatch();
+  const config = useTypedSelector(selectConfig);
+  const locale = useTypedSelector(selectLocale);
+  const isHydrated = useTypedSelector(selectIsHydrated);
+  const isCompactLayout = useMediaQuery('<l');
+  const previousIsCompactLayout = useRef(isCompactLayout);
+  const [modals, setModals] = useState<Record<Modal, boolean>>({
+    dictionary: false,
+    keyMap: false,
+    menu: false,
+    remainingTiles: false,
+    results: false,
+    settings: false,
+    words: false,
+  });
+  const [mountedModals, setMountedModals] = useState<Partial<Record<Modal, boolean>>>({});
+
+  const patchModals = useCallback((patch: Partial<Record<Modal, boolean>>) => {
+    setModals((current) => ({ ...current, ...patch }));
+    setMountedModals((current) => {
+      const newModals = Object.keys(patch) as Modal[];
+      const newOpenedModals = newModals.filter((modal) => patch[modal] && !current[modal]);
+
+      if (newOpenedModals.length === 0) {
+        return current;
+      }
+
+      const mounted = { ...current };
+
+      for (const modal of newOpenedModals) {
+        mounted[modal] = true;
+      }
+
+      return mounted;
+    });
+  }, []);
+
+  const handleClear = useCallback(() => dispatch(reset()), [dispatch]);
+
+  const handleShowDictionary = useCallback(() => patchModals({ dictionary: true }), [patchModals]);
+  const handleShowKeyMap = useCallback(() => patchModals({ keyMap: true }), [patchModals]);
+  const handleShowMenu = useCallback(() => patchModals({ menu: true }), [patchModals]);
+  const handleShowRemainingTiles = useCallback(() => patchModals({ remainingTiles: true }), [patchModals]);
+  const handleShowResults = useCallback(() => patchModals({ results: true }), [patchModals]);
+  const handleShowSettings = useCallback(() => patchModals({ settings: true }), [patchModals]);
+  const handleShowWords = useCallback(() => patchModals({ words: true }), [patchModals]);
+  const handleCloseDictionary = useCallback(() => patchModals({ dictionary: false }), [patchModals]);
+  const handleCloseKeyMap = useCallback(() => patchModals({ keyMap: false }), [patchModals]);
+  const handleCloseMenu = useCallback(() => patchModals({ menu: false }), [patchModals]);
+  const handleCloseRemainingTiles = useCallback(() => patchModals({ remainingTiles: false }), [patchModals]);
+  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);
+  useLocalStorage();
+
+  useEffect(() => {
+    const root = document.documentElement;
+    const variables = [
+      { name: '--board-cols', value: config.boardWidth, defaultValue: games.scrabble.boardWidth },
+      { name: '--board-rows', value: config.boardHeight, defaultValue: games.scrabble.boardHeight },
+      { name: '--rack-size', value: config.rackSize, defaultValue: games.scrabble.rackSize },
+    ];
+
+    for (const { name, value, defaultValue } of variables) {
+      const current = root.style.getPropertyValue(name) || String(defaultValue);
+
+      if (current !== String(value)) {
+        root.style.setProperty(name, String(value));
+      }
+    }
+  }, [config.boardHeight, config.boardWidth, config.rackSize]);
+
+  useEffect(() => {
+    if (isHydrated) {
+      document.documentElement.classList.remove(CONFIG_PENDING_CLASS);
+    }
+  }, [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
+      registerServiceWorker();
+    }
+
+    dispatch(initialize({ version }));
+    schedulePreloadModals();
+  });
+
+  return (
+    <>
+      <nav className={styles.nav}>
+        <div className={styles.navContent}>
+          <h1 className={styles.navLogo}>
+            <a className={styles.logoContainer} href="/" title={version}>
+              <Logo className={styles.logo} />
+            </a>
+          </h1>
+
+          <NavButtons
+            onClear={handleClear}
+            onShowKeyMap={handleShowKeyMap}
+            onShowMenu={handleShowMenu}
+            onShowRemainingTiles={handleShowRemainingTiles}
+            onShowSettings={handleShowSettings}
+            onShowWords={handleShowWords}
+          />
+        </div>
+      </nav>
+
+      <main>
+        <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}
+          onClose={handleCloseMenu}
+          onShowDictionary={handleShowDictionary}
+          onShowRemainingTiles={handleShowRemainingTiles}
+          onShowSettings={handleShowSettings}
+          onShowWords={handleShowWords}
+        />
+      )}
+
+      {mountedModals.settings && <SettingsModal isOpen={modals.settings} onClose={handleCloseSettings} />}
+
+      {mountedModals.keyMap && <KeyMapModal isOpen={modals.keyMap} onClose={handleCloseKeyMap} />}
+
+      {mountedModals.words && (
+        <WordsModal isOpen={modals.words} onClose={handleCloseWords} onPreview={handlePreviewWord} />
+      )}
+
+      {config.supportsRemainingTiles && mountedModals.remainingTiles && (
+        <RemainingTilesModal isOpen={modals.remainingTiles} onClose={handleCloseRemainingTiles} />
+      )}
+
+      {mountedModals.results && <ResultsModal isOpen={modals.results} onClose={handleCloseResults} />}
+
+      {mountedModals.dictionary && <DictionaryModal isOpen={modals.dictionary} onClose={handleCloseDictionary} />}
+    </>
+  );
+};
+
+export const getStaticProps = async () => {
+  const version = await readVersion();
+  // Inlined into __NEXT_DATA__ so the page-data hash (which feeds Next.js's SSG ETag)
+  // changes per build, letting browsers cache HTML and 304 within a build but pull
+  // fresh markup after a deploy. Not consumed by the component.
+  const buildSha = execSync('git rev-parse HEAD').toString().trim();
+  return { props: { version, buildSha } };
+};
+
+const readVersion = async (): Promise<string> => {
+  const packageJsonFilepath = path.resolve(process.cwd(), 'package.json');
+  const data = await fs.promises.readFile(packageJsonFilepath, 'utf-8');
+  const packageJson = JSON.parse(data);
+
+  if (!isObject(packageJson) || !('version' in packageJson) || typeof packageJson.version !== 'string') {
+    throw new Error('Invalid package.json');
+  }
+
+  return `v${packageJson.version}`;
+};
+
+export default Index;

package/packages/scrabble-solver/src/pages/not-found.tsx

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

package/packages/scrabble-solver/src/parameters/index.ts

@@ -0,0 +1,83 @@
+import variables from '@/styles/variables.module.scss';
+
+export const BREAKPOINTS = {
+  xs: Number(variables.breakpointXs),
+  s: Number(variables.breakpointS),
+  m: Number(variables.breakpointM),
+  l: Number(variables.breakpointL),
+  xl: Number(variables.breakpointXl),
+};
+
+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';
+
+export const TRANSITION_DURATION_LONG = Number(variables.transitionDurationLong);
+
+export const COLOR_BLUE = 'var(--color--blue)';
+export const COLOR_GREEN = 'var(--color--green)';
+export const COLOR_RED = 'var(--color--red)';
+export const COLOR_YELLOW = 'var(--color--yellow)';
+
+export const COLOR_BACKGROUND = variables.colorBackground;
+export const COLOR_BONUS_START = variables.colorVioletLight;
+
+export const COLOR_BONUS_CHARACTER: Record<number, string> = {
+  1: variables.colorYellowLight,
+  2: variables.colorGreenLight,
+  3: variables.colorBlueLight,
+  5: variables.colorRedLight,
+};
+
+export const COLOR_BONUS_CHARACTER_MULTIPLIER: Record<number, string> = {
+  2: variables.colorBonusCharacterMultiplier2,
+  3: variables.colorBonusCharacterMultiplier3,
+  4: variables.colorBonusCharacterMultiplier4,
+};
+
+export const COLOR_BONUS_WORD: Record<number, string> = {
+  2: variables.colorBonusWordMultiplier2,
+  3: variables.colorBonusWordMultiplier3,
+  4: variables.colorBonusWordMultiplier4,
+};
+
+export const BOARD_CELL_ACTIONS_OFFSET = 3;
+
+export const BORDER_COLOR_LIGHT = variables.borderColorLight;
+export const BORDER_WIDTH = Number(variables.borderWidth);
+
+export const LOGO_HEIGHT = 166;
+export const LOGO_SRC = '/logo.svg';
+export const LOGO_WIDTH = 682;
+
+export const TOOLTIP_DURATION = Number(variables.transitionDuration);
+
+export const PLAIN_TILES_COLOR_DEFAULT = COLOR_GREEN;
+export const PLAIN_TILES_POINTS_COLORS: Record<number, string> = {
+  1: COLOR_YELLOW,
+  2: COLOR_GREEN,
+  3: COLOR_BLUE,
+  4: COLOR_RED,
+  5: COLOR_RED,
+  6: COLOR_RED,
+  7: COLOR_RED,
+  8: COLOR_RED,
+  9: COLOR_RED,
+  10: COLOR_RED,
+};
+export const PLAIN_TILES_TILE_MARGIN = 6;
+export const PLAIN_TILES_TILE_SIZE = 80;
+
+export const RESULTS_ITEM_HEIGHT = Number(variables.resultsItemHeight);
+
+export const RESULTS_OVERSCAN_COUNT = 10;
+
+export const LOADING_DELAY = 100;

package/packages/scrabble-solver/src/sdk/fetch.ts

@@ -0,0 +1,28 @@
+import { isError } from '@scrabble-solver/types';
+
+export const fetch = async (input: RequestInfo | URL, init?: RequestInit): Promise<Response> => {
+  let response: Response;
+
+  try {
+    response = await window.fetch(input, init);
+  } catch (error) {
+    const message = isError(error) ? error.message : 'Unknown error';
+    throw new Error(`Network error: ${message}`);
+  }
+
+  if (response.ok) {
+    return response;
+  }
+
+  try {
+    const json = await response.json();
+
+    if (isError(json)) {
+      throw new Error(json.message);
+    }
+  } finally {
+    // do nothing
+  }
+
+  throw new Error(`HTTP ${response.status}: ${response.statusText}`);
+};

package/packages/scrabble-solver/src/sdk/fetchJson.ts

@@ -0,0 +1,9 @@
+import { fetch } from './fetch';
+
+export const fetchJson = async <T>(input: RequestInfo | URL, init?: RequestInit): Promise<T> => {
+  const headers = new Headers(init?.headers);
+  headers.set('Content-Type', 'application/json');
+
+  const response = await fetch(input, { ...init, headers });
+  return response.json();
+};

package/packages/scrabble-solver/src/sdk/findWordDefinitions.ts

@@ -0,0 +1,8 @@
+import { type Locale, type WordDefinitionJson, WordDefinition } from '@scrabble-solver/types';
+
+import { fetchJson } from './fetchJson';
+
+export const findWordDefinitions = async (locale: Locale, word: string): Promise<WordDefinition[]> => {
+  const json = await fetchJson<WordDefinitionJson[]>(`/api/dictionary/${locale}/${encodeURIComponent(word)}`);
+  return json.map(WordDefinition.fromJson);
+};

package/packages/scrabble-solver/src/sdk/index.ts

@@ -0,0 +1,4 @@
+export { findWordDefinitions } from './findWordDefinitions';
+export { solve } from './solve';
+export { verify } from './verify';
+export { visit } from './visit';

package/packages/scrabble-solver/src/sdk/solve.ts

@@ -0,0 +1,19 @@
+import { type ResultJson, Board, Result } from '@scrabble-solver/types';
+
+import { solveLocally } from '@/solver-worker';
+import { type SolveRequestPayload } from '@/types';
+
+import { fetchJson } from './fetchJson';
+
+export const solve = async ({ board, characters, game, locale }: SolveRequestPayload): Promise<Result[]> => {
+  const payload = { board, characters, game, locale };
+  const json =
+    (await solveLocally(payload)) ??
+    (await fetchJson<ResultJson[]>('/api/solve', {
+      method: 'POST',
+      body: JSON.stringify(payload),
+    }));
+
+  const decodedBoard = Board.fromJson(board);
+  return json.map((result) => Result.fromJson(result, decodedBoard));
+};

package/packages/scrabble-solver/src/sdk/verify.ts

@@ -0,0 +1,20 @@
+import { verifyLocally } from '@/solver-worker';
+import { type VerifiedWord, type VerifyRequestPayload } from '@/types';
+
+import { fetchJson } from './fetchJson';
+
+interface Response {
+  invalidWords: VerifiedWord[];
+  validWords: VerifiedWord[];
+}
+
+export const verify = async ({ board, game, locale }: VerifyRequestPayload): Promise<Response> => {
+  const payload = { board, game, locale };
+  return (
+    (await verifyLocally(payload)) ??
+    fetchJson<Response>('/api/verify', {
+      method: 'POST',
+      body: JSON.stringify(payload),
+    })
+  );
+};

package/packages/scrabble-solver/src/sdk/visit.ts

@@ -0,0 +1,10 @@
+import { type VisitRequestPayload } from '@/types';
+
+import { fetchJson } from './fetchJson';
+
+export function visit(payload: VisitRequestPayload): Promise<boolean> {
+  return fetchJson<boolean>('/api/visit', {
+    method: 'PUT',
+    body: JSON.stringify(payload),
+  });
+}