refactor(components): rewrite PostsList component

* remove NoResults component and move logic to Search page
* add a usePostsList hook
* remove Pagination from PostsList (it is only used if javascript is
disabled and not on every posts list)
* replace `byYear` prop with `sortByYear`
* replace `loadMore` prop with `onLoadMore`
* remove `showLoadMoreBtn` (we can use `loadMore` prop instead to
determine if we need to display the button)
* replace `titleLevel` prop with `headingLvl`
* add `firstNewResult` prop to handle focus on the new results when
loading more article (we should not focus a useless span but the item
directly)

2 files changed, 16 insertions, 1 deletions

diff --git a/src/components/organisms/nav/pagination/pagination.module.scss b/src/components/organisms/nav/pagination/pagination.module.scss
index 13970d3..eeb9ca6 100644
--- a/src/components/organisms/nav/pagination/pagination.module.scss
+++ b/src/components/organisms/nav/pagination/pagination.module.scss
@@ -4,6 +4,10 @@
   gap: var(--spacing-sm);
   align-items: center;
   width: fit-content;
+
+  &--centered {
+    margin-inline: auto;
+  }
 }
 
 .list {
diff --git a/src/components/organisms/nav/pagination/pagination.tsx b/src/components/organisms/nav/pagination/pagination.tsx
index 8e95122..006663b 100644
--- a/src/components/organisms/nav/pagination/pagination.tsx
+++ b/src/components/organisms/nav/pagination/pagination.tsx
@@ -32,6 +32,12 @@ export type PaginationProps = Omit<NavProps, 'children'> & {
    */
   current: number;
   /**
+   * Should the pagination be centered?
+   *
+   * @default false
+   */
+  isCentered?: boolean;
+  /**
    * Function used to provide an accessible label to pagination items.
    */
   renderItemAriaLabel: RenderPaginationItemAriaLabel;
@@ -83,6 +89,7 @@ const PaginationWithRef: ForwardRefRenderFunction<
   {
     className = '',
     current,
+    isCentered = false,
     renderItemAriaLabel,
     renderLink,
     siblings = 1,
@@ -91,7 +98,11 @@ const PaginationWithRef: ForwardRefRenderFunction<
   },
   ref
 ) => {
-  const paginationClass = `${styles.wrapper} ${className}`;
+  const paginationClass = [
+    styles.wrapper,
+    styles[isCentered ? 'wrapper--centered' : ''],
+    className,
+  ].join(' ');
   const displayRange =
     current === 1 || current === total ? siblings + 1 : siblings;
   const hasPreviousPage = current > 1;