From 1e982fb02a9967e0efdc76c93a44798a9f2dcb43 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Tue, 24 May 2022 16:44:29 +0200
Subject: chore: add a search form when posts list prints no results

---
 src/components/organisms/layout/no-results.tsx | 38 ++++++++++++++++++++++++++
 1 file changed, 38 insertions(+)
 create mode 100644 src/components/organisms/layout/no-results.tsx

(limited to 'src/components/organisms/layout/no-results.tsx')

diff --git a/src/components/organisms/layout/no-results.tsx b/src/components/organisms/layout/no-results.tsx
new file mode 100644
index 0000000..2245dbf
--- /dev/null
+++ b/src/components/organisms/layout/no-results.tsx
@@ -0,0 +1,38 @@
+import SearchForm, {
+  type SearchFormProps,
+} from '@components/organisms/forms/search-form';
+import { FC } from 'react';
+import { useIntl } from 'react-intl';
+
+export type NoResultsProps = Pick<SearchFormProps, 'searchPage'>;
+
+/**
+ * NoResults component
+ *
+ * Renders a no results text with a search form.
+ */
+const NoResults: FC<NoResultsProps> = ({ searchPage }) => {
+  const intl = useIntl();
+
+  return (
+    <>
+      <p>
+        {intl.formatMessage({
+          defaultMessage: 'No results found.',
+          description: 'NoResults: no results',
+          id: '5O2vpy',
+        })}
+      </p>
+      <p>
+        {intl.formatMessage({
+          defaultMessage: 'Would you like to try a new search?',
+          description: 'NoResults: try a new search message',
+          id: 'DVBwfu',
+        })}
+      </p>
+      <SearchForm hideLabel={true} searchPage={searchPage} />
+    </>
+  );
+};
+
+export default NoResults;
-- 
cgit v1.2.3

