From 5eb598babb013462a7fc20719d82037574282de2 Mon Sep 17 00:00:00 2001
From: Camila Belo <camilaibs@gmail.com>
Date: Fri, 7 Oct 2022 17:38:42 +0200
Subject: [PATCH] refactor(search-react): restrict range of valid options type

Signed-off-by: Camila Belo <camilaibs@gmail.com>
---
 plugins/search-react/api-report.md            | 10 ++++++++-
 .../SearchResultLimiter.tsx                   | 22 +++++++++++--------
 2 files changed, 22 insertions(+), 10 deletions(-)

diff --git a/plugins/search-react/api-report.md b/plugins/search-react/api-report.md
index 744f45065f..24b70240a0 100644
--- a/plugins/search-react/api-report.md
+++ b/plugins/search-react/api-report.md
@@ -335,11 +335,19 @@ export type SearchResultLimiterBaseProps = {
   id?: string;
   className?: string;
   label?: ReactNode;
-  options?: number[];
+  options?: SearchResultLimiterOption[];
   value?: number;
   onChange?: (value: number) => void;
 };
 
+// @public
+export type SearchResultLimiterOption<
+  Current extends number = 101,
+  Accumulator extends number[] = [],
+> = Accumulator['length'] extends Current
+  ? Accumulator[number]
+  : SearchResultLimiterOption<Current, [...Accumulator, Accumulator['length']]>;
+
 // @public
 export type SearchResultLimiterProps = Omit<
   SearchResultLimiterBaseProps,
diff --git a/plugins/search-react/src/components/SearchResultLimiter/SearchResultLimiter.tsx b/plugins/search-react/src/components/SearchResultLimiter/SearchResultLimiter.tsx
index 0d4b8381dd..7f2d1ffc58 100644
--- a/plugins/search-react/src/components/SearchResultLimiter/SearchResultLimiter.tsx
+++ b/plugins/search-react/src/components/SearchResultLimiter/SearchResultLimiter.tsx
@@ -25,6 +25,17 @@ import {
 } from '@material-ui/core';
 import { useSearch } from '../../context';
 
+/**
+ * A page limit option, this value must not be greater than 100.
+ * @public
+ */
+export type SearchResultLimiterOption<
+  Current extends number = 101,
+  Accumulator extends number[] = [],
+> = Accumulator['length'] extends Current
+  ? Accumulator[number]
+  : SearchResultLimiterOption<Current, [...Accumulator, Accumulator['length']]>;
+
 /**
  * Props for {@link SearchResultLimiterBase}.
  * @public
@@ -39,7 +50,7 @@ export type SearchResultLimiterBaseProps = {
   /**
    * The combobox labels, defaults to 10, 25, 50 and 100.
    */
-  options?: number[];
+  options?: SearchResultLimiterOption[];
   /**
    * Combobox selected option, defaults to 25;
    */
@@ -129,18 +140,11 @@ export type SearchResultLimiterProps = Omit<
 export const SearchResultLimiter = (props: SearchResultLimiterProps) => {
   const { pageLimit, setPageLimit } = useSearch();
 
-  const handleChange = useCallback(
-    (newPageLimit: number) => {
-      setPageLimit(newPageLimit);
-    },
-    [setPageLimit],
-  );
-
   return (
     <SearchResultLimiterBase
       {...props}
       value={pageLimit}
-      onChange={handleChange}
+      onChange={setPageLimit}
     />
   );
 };