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)

1 files changed, 0 insertions, 66 deletions

diff --git a/src/components/organisms/layout/posts-list.module.scss b/src/components/organisms/layout/posts-list.module.scss
deleted file mode 100644
index cc5acda..0000000
--- a/src/components/organisms/layout/posts-list.module.scss
+++ /dev/null
@@ -1,66 +0,0 @@
-@use "../../../styles/abstracts/functions" as fun;
-@use "../../../styles/abstracts/mixins" as mix;
-@use "../../../styles/abstracts/placeholders";
-
-.section {
-  &:not(:last-of-type) {
-    margin-bottom: var(--spacing-md);
-  }
-
-  @include mix.media("screen") {
-    @include mix.dimensions("md") {
-      display: grid;
-      grid-template-columns: fun.convert-px(150) minmax(0, 1fr);
-      align-items: first baseline;
-      margin-left: fun.convert-px(-150);
-    }
-  }
-}
-
-.list {
-  .item {
-    border-bottom: fun.convert-px(1) solid var(--color-border);
-  }
-}
-
-.year {
-  margin-bottom: var(--spacing-md);
-  padding-bottom: fun.convert-px(3);
-  background: linear-gradient(
-      to top,
-      var(--color-primary-dark) 0.3rem,
-      transparent 0.3rem
-    )
-    0 0 / 3rem 100% no-repeat;
-  font-size: var(--font-size-2xl);
-  font-weight: 500;
-  text-shadow: fun.convert-px(1) fun.convert-px(1) 0 var(--color-shadow-light);
-
-  @include mix.media("screen") {
-    @include mix.dimensions("md") {
-      grid-column: 1;
-      justify-self: end;
-      padding-right: var(--spacing-lg);
-      position: sticky;
-      top: var(--spacing-xs);
-    }
-
-    @include mix.dimensions("lg") {
-      padding-right: var(--spacing-xl);
-    }
-  }
-}
-
-.btn {
-  display: flex;
-  margin: auto;
-}
-
-.progress {
-  margin-block: var(--spacing-md);
-}
-
-.pagination {
-  margin-inline: auto;
-  margin-block-end: var(--spacing-lg);
-}