<|start_filename|>docs/src/pages/articles.js<|end_filename|>
/**********************************************************************************
 * MIT License                                                                    *
 *                                                                                *
 * Copyright (c) 2021 Hyperjump Technology                                        *
 *                                                                                *
 * Permission is hereby granted, free of charge, to any person obtaining a copy   *
 * of this software and associated documentation files (the "Software"), to deal  *
 * in the Software without restriction, including without limitation the rights   *
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell      *
 * copies of the Software, and to permit persons to whom the Software is          *
 * furnished to do so, subject to the following conditions:                       *
 *                                                                                *
 * The above copyright notice and this permission notice shall be included in all *
 * copies or substantial portions of the Software.                                *
 *                                                                                *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR     *
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,       *
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE    *
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER         *
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,  *
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE  *
 * SOFTWARE.                                                                      *
 **********************************************************************************/

import React from 'react'
import axios from 'axios'
import { LayoutDocs } from '../components/LayoutDocs'
import { XMLParser } from 'fast-xml-parser'

export default function ArticlesPage({ articles }) {
  return (
    <LayoutDocs meta={{}}>
      <h1>Articles</h1>
      {articles.length > 0 ? (
        articles.map(({ title, pubDate, link }) => {
          return (
            <div key={title} className="flex flex-col mb-4">
              <div className="flex">
                <a href={link} rel="noopener noreferrer" target="_blank">
                  <h2>
                    <b>{title}</b>
                  </h2>
                </a>
              </div>
              <div className="flex">
                <span>Published at {pubDate}</span>
              </div>
            </div>
          )
        })
      ) : (
        <p>There are no articles available at the moment.</p>
      )}
      <div className="flex articles-center justify-end">
        <a
          href="https://medium.com/hyperjump-tech"
          target="_blank"
          rel="noopener noreferrer"
          className="cursor-pointer text-purple-monika hover:underline"
        >
          RSS Feed from Medium.com
        </a>
      </div>
    </LayoutDocs>
  )
}

export async function getStaticProps() {
  try {
    const { data } = await axios({
      method: 'GET',
      url: 'https://medium.com/feed/hyperjump-tech',
      headers: {
        'Access-Control-Allow-Origin': '*',
        'Content-Type': 'application/rss+xml',
      },
    })

    if (!data) {
      throw new Error('Failed to fetch RSS Feed.')
    }

    const parser = new XMLParser()
    const parsed = parser.parse(data)
    const { rss } = parsed
    const { channel } = rss
    const { item: articles } = channel

    return {
      props: {
        articles,
      },
    }
  } catch (e) {
    return {
      props: {
        articles: [],
      },
    }
  }
}


<|start_filename|>docs/src/pages/_app.js<|end_filename|>
/**********************************************************************************
 * MIT License                                                                    *
 *                                                                                *
 * Copyright (c) 2021 Hyperjump Technology                                        *
 *                                                                                *
 * Permission is hereby granted, free of charge, to any person obtaining a copy   *
 * of this software and associated documentation files (the "Software"), to deal  *
 * in the Software without restriction, including without limitation the rights   *
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell      *
 * copies of the Software, and to permit persons to whom the Software is          *
 * furnished to do so, subject to the following conditions:                       *
 *                                                                                *
 * The above copyright notice and this permission notice shall be included in all *
 * copies or substantial portions of the Software.                                *
 *                                                                                *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR     *
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,       *
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE    *
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER         *
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,  *
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE  *
 * SOFTWARE.                                                                      *
 **********************************************************************************/

import React, { useEffect } from 'react'
import '@docsearch/react/dist/style.css'
import '../styles/index.css'
import Head from 'next/head'
import { QueryClient, QueryClientProvider } from 'react-query'
import { SearchProvider } from 'components/useSearch'
import CookieConsent, { getCookieConsentValue } from 'react-cookie-consent'
import { useRouter } from 'next/router'
import * as gtag from '../lib/gtag'

function loadScript(src, attrs = {}) {
  if (typeof document !== 'undefined') {
    const script = document.createElement('script')
    script.async = true
    script.defer = true
    Object.keys(attrs).forEach((attr) => script.setAttribute(attr, attrs[attr]))
    script.src = src
    document.body.appendChild(script)
  }
}

function MyApp({ Component, pageProps }) {
  const queryClient = new QueryClient()
  React.useEffect(() => {
    loadScript('https://buttons.github.io/buttons.js')
  }, [])

  const router = useRouter()
  useEffect(() => {
    const handleRouteChange = (url) => {
      if (getCookieConsentValue() === 'true') {
        //isConsentAllowed
        gtag.pageview(url)
      }
    }

    router.events.on('routeChangeComplete', handleRouteChange)
    return () => {
      router.events.off('routeChangeComplete', handleRouteChange)
    }
  }, [router.events])

  return (
    <>
      <Head>
        <link rel="preconnect" href="https://fonts.gstatic.com" />
        <link
          href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
          rel="stylesheet"
        />
        <link
          href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap"
          rel="stylesheet"
        />
        <style
          dangerouslySetInnerHTML={{
            __html: `
        @media (max-width: 390px) {
            .formkit-slide-in {
              display: none;
            }
          }
          @media (max-height: 740px) {
            .formkit-slide-in {
              display: none;
            }
          }
          `,
          }}
        />
      </Head>
      <QueryClientProvider client={queryClient}>
        <SearchProvider>
          <CookieConsent enableDeclineButton>
            This website uses cookies to enhance the user experience.
          </CookieConsent>
          <Component {...pageProps} />
        </SearchProvider>
      </QueryClientProvider>
    </>
  )
}

export default MyApp
