fix(website): fix routing pages

.github/workflows/integration.yml

@@ -40,5 +40,5 @@ jobs:
       run: yarn test:build
     - name: Test API
       run: yarn jest
-    # - name: Test API Homepage
-    #   run: yarn cypress:ci
+    - name: Test API Homepage
+      run: yarn cypress:ci

__tests__/cypress/integration/client.test.js

@@ -21,6 +21,16 @@ describe('Igbo API Homepage', () => {
       cy.contains('Email:');
     });
 
+    it('render the Privacy page', () => {
+      cy.findByText('Privacy').click();
+      cy.findByText('Privacy Policy').should('exist');
+    });
+
+    it('render the Terms or Service page', () => {
+      cy.findByText('Terms of Service').click();
+      cy.findByText('Terms and Conditions').should('exist');
+    });
+
     describe('Try it Out', () => {
       it('enter a word and select flag', () => {
         cy.visit('/');

src/pages/_app.js

@@ -7,6 +7,7 @@ import i18n from 'i18next';
 import { initReactI18next } from 'react-i18next';
 import { appWithTranslation } from 'next-i18next';
 import Head from 'next/head';
+import ChakraTheme from '../shared/constants/ChakraTheme';
 import en from '../public/locales/en';
 import ig from '../public/locales/ig';
 import * as gtag from '../lib/gtag';
@@ -49,7 +50,7 @@ const MainApp = ({ Component, pageProps, ...rest }) => {
         <title>Igbo API - The First African Language API</title>
       </Head>
       <>
-        <ChakraProvider>
+        <ChakraProvider theme={ChakraTheme}>
           <Component {...pageProps} {...rest} />
         </ChakraProvider>
         {/* Global Site Tag (gtag.js) - Google Analytics */}

src/pages/about.js

@@ -41,7 +41,7 @@ const About = () => {
               <a className="link" href={DICTIONARY_APP_URL}>
                 Nkọwa okwu
               </a>
-              {' , our official online Igbo-English dictionary app.'}
+              , our official online Igbo-English dictionary app.
             </p>
           ) : (
             <p dangerouslySetInnerHTML={{

src/pages/components/Footer/Footer.js

@@ -74,7 +74,7 @@ const Footer = () => {
                   </li>
                   <li>
                     <a href="/terms" className="font-normal border-b border-b-gray-500">
-                      Terms of service
+                      Terms of Service
                     </a>
                   </li>
                   <li>

src/pages/privacy.js

@@ -1,4 +1,3 @@
-/* eslint-disable max-len */
 import React from 'react';
 import {
   Box,

src/routers/siteRouter.js

@@ -8,8 +8,6 @@ const handle = nextApp.getRequestHandler();
 
 const routes = compact([
   /^\/$/,
-  /^\/about/,
-  process.env.NODE_ENV !== 'production' ? /^\/signup/ : null,
 ]);
 
 const siteRouter = express.Router();

src/shared/constants/ChakraTheme.js

@@ -0,0 +1,8 @@
+import { extendTheme } from '@chakra-ui/react';
+
+export default extendTheme({
+  fonts: {
+    heading: 'Silka',
+    body: 'Silka,Noto Sans,Inter,-apple-system,BlinkMacSystemFont,Noto Sans,Arial',
+  },
+});

src/styles.css

@@ -25,6 +25,7 @@
 .link {
   @apply transition-element;
   @apply text-green-400;
+  @apply inline;
 }
 
 .link:hover {