Fix pagination in the docs

Author: hasparus

packages/docs/src/components/readme-badges.js

@@ -41,12 +41,6 @@ export default function ReadmeBadges() {
           alt="Contributors"
         />
       </a>
-      <a href="https://github.com/badges/shields/pulse">
-        <img
-          src="https://img.shields.io/github/commit-activity/m/system-ui/theme-ui"
-          alt="Activity"
-        />
-      </a>
       <a href="https://badgen.net/bundlephobia/minzip/theme-ui">
         <img src="https://badgen.net/bundlephobia/minzip/theme-ui" alt="Size" />
       </a>
@@ -68,12 +62,6 @@ export default function ReadmeBadges() {
           alt="Join our Discord community"
         />
       </a>
-      <a href="https://github.com/system-ui/theme-ui/actions?query=workflow%3ACI">
-        <img
-          src="https://github.com/system-ui/theme-ui/workflows/CI/badge.svg?branch=stable"
-          alt="Build Status"
-        />
-      </a>
       <a href="https://dashboard.cypress.io/projects/fmfid1/runs">
         <img
           src="https://img.shields.io/endpoint?url=https://dashboard.cypress.io/badge/simple/fmfid1/stable&logo=cypress"

packages/docs/src/components/sidenav.tsx

@@ -341,14 +341,16 @@ export const Pagination = ({
         display: 'flex',
       }}
     >
-      {hasPagination && previous && React.isValidElement(previous) && (
+      {hasPagination && previous && (
         <PaginationLink href={previous[1]} label="Previous:">
           {previous[0]}
         </PaginationLink>
       )}
       <div sx={{ mx: 'auto' }} />
-      {hasPagination && next && React.isValidElement(next) && (
-        <PaginationLink label="Next:">{next[0]}</PaginationLink>
+      {hasPagination && next && (
+        <PaginationLink href={next[1]} label="Next:">
+          {next[0]}
+        </PaginationLink>
       )}
     </div>
   )

packages/e2e/integration/docs-navigation.ts

@@ -22,6 +22,7 @@ describe('docs navigation', () => {
         'Migrating',
         'Edit the page on GitHub',
         'Previous:Getting Started with Gatsby',
+        'Next:The sx Prop',
       ]
 
       for (const s of expectedLinkTexts) {