Merge branch 'master' of github.com:nkowaokwu/igbo_api into ec/eng2igbo

migrations/20241116014146-add-bit-rate-audio-pronunciation.js

@@ -0,0 +1,23 @@
+module.exports = {
+  async up(db) {
+    const collections = ['audiopronunciations'];
+    return collections.map((collection) =>
+      db.collection(collection).updateMany({}, [
+        {
+          $addFields: { bitRate: 30000 },
+        },
+      ])
+    );
+  },
+
+  async down(db) {
+    const collections = ['audiopronunciations'];
+    return collections.map((collection) =>
+      db.collection(collection).updateMany({}, [
+        {
+          $unset: 'bitRate',
+        },
+      ])
+    );
+  },
+};

src/pages/App.tsx

@@ -1,4 +1,5 @@
 import { Box, Heading, Text, VStack } from '@chakra-ui/react';
+import CallToAction from './components/CallToAction';
 import Demo from './components/Demo';
 import Donate from './components/Donate';
 import FadeIn from './components/FadeIn';
@@ -16,9 +17,10 @@ const App = ({ searchWord }: { searchWord: string }) => (
       className="overflow-x-hidden flex flex-col items-center"
       id="homepage-container"
       width="full"
-      pt={24}
+      pt={20}
       pb={24}
     >
+      <CallToAction />
       <VStack width="full" gap={24}>
         <Box
           className="relative flex flex-col justify-center items-center 

src/pages/components/CallToAction/CallToAction.tsx

@@ -0,0 +1,32 @@
+import { Button, HStack, Link, Text } from '@chakra-ui/react';
+import { LuArrowRight } from 'react-icons/lu';
+import { VOLUNTEER_PAGE_URL } from 'src/siteConstants';
+
+const CallToAction = () => (
+  <HStack
+    width="full"
+    justifyContent="center"
+    gap={6}
+    backgroundColor="blue.900"
+    p={4}
+    flexDirection={{ base: 'column', lg: 'row' }}
+  >
+    <Text color="white" fontWeight="medium" fontSize="md" textAlign="center">
+      Join our team of Igbo audio recorders and translators to help advance Igbo NLP technology 🎙️
+    </Text>
+    <Link href={VOLUNTEER_PAGE_URL} target="_blank">
+      <Button
+        backgroundColor="white"
+        color="black"
+        fontWeight="bold"
+        fontFamily="heading"
+        rightIcon={<LuArrowRight />}
+        fontSize="md"
+      >
+        Join here
+      </Button>
+    </Link>
+  </HStack>
+);
+
+export default CallToAction;

src/pages/components/CallToAction/index.ts

@@ -0,0 +1,3 @@
+import CallToAction from './CallToAction';
+
+export default CallToAction;

src/pages/components/Footer/Footer.tsx

@@ -97,7 +97,7 @@ const Footer = () => (
     backgroundColor="blue.900"
     gap={12}
   >
-    <footer className="w-11/12 grid grid-cols-1 lg:grid-cols-4 space-y-8 lg:space-y-0">
+    <footer className="w-11/12 gap-4 grid grid-cols-1 lg:grid-cols-4 space-y-8 lg:space-y-0">
       <VStack alignItems="start">
         <Link href="/">
           <Image src={nkowaokwuLogoWhite} alt="Nkọwa okwu logo" height={30} />

src/pages/components/Navbar/Navbar.tsx

@@ -1,8 +1,6 @@
 import { Box, Button, Link as ChakraLink, Heading, Show } from '@chakra-ui/react';
-import Image from 'next/image';
 import { useRouter } from 'next/router';
 import { Link } from 'react-scroll';
-import NkowaokwuLogo from '../../assets/nkowaokwu.svg';
 import NavigationMenu from './NavigationMenu';
 import NavigationOptions from './NavigationOptions';
 
@@ -16,15 +14,24 @@ const Navbar = ({ to = '/' }: { to?: string }) => {
       p={4}
     >
       <Box className="flex items-center justify-between w-11/12" style={{ zIndex: 2 }}>
-        <Box className="flex flex-row items-center">
+        <Box className="flex flex-row items-center" flex={1}>
           <Heading
             as="h1"
             className="transition-element text-3xl font-extrabold hover:text-gray-700 text-gray-900"
             pb="0"
+            color="black"
+            fontSize={{ base: '2xl', md: '3xl' }}
           >
             {to ? (
-              <ChakraLink href={to}>
-                <Image alt="Nkọwa okwu logo" src={NkowaokwuLogo} height={40} width={150} />
+              <ChakraLink
+                href={to}
+                color="black"
+                textDecoration="none"
+                _hover={{ textDecoration: 'none' }}
+                _active={{ textDecoration: 'none' }}
+                _focus={{ textDecoration: 'none' }}
+              >
+                Igbo API
               </ChakraLink>
             ) : (
               <Link
@@ -34,7 +41,7 @@ const Navbar = ({ to = '/' }: { to?: string }) => {
                 offset={-100}
                 duration={600}
               >
-                <Image alt="Nkọwa okwu logo" src={NkowaokwuLogo} height={40} width={150} />
+                Igbo API
               </Link>
             )}
           </Heading>
@@ -43,9 +50,11 @@ const Navbar = ({ to = '/' }: { to?: string }) => {
           </Show>
         </Box>
         <Show above="md">
-          <NavigationOptions />
+          <Box flex={4}>
+            <NavigationOptions />
+          </Box>
         </Show>
-        <Box display="flex" flexDirection="row" className="space-x-3">
+        <Box display="flex" flexDirection="row" className="space-x-3" flex={1}>
           <Button
             className="transition-all duration-200"
             backgroundColor="white"

src/pages/components/Navbar/NavigationOptions.tsx

@@ -16,6 +16,7 @@ import { navigationLinks, NavigationType } from '../../../shared/constants/navig
 const NavigationOptions = () => (
   <UnorderedList
     className="w-full flex flex-row justify-center items-center space-x-6"
+    ml={0}
     data-test="sub-menu"
   >
     {navigationLinks.map(({ href, label, type, options }) => (

src/siteConstants.ts

@@ -4,6 +4,7 @@ export const API_FROM_EMAIL = '[email protected]';
 export const APP_URL = 'https://igboapi.com';
 export const API_ROUTE = APP_URL;
 export const DICTIONARY_APP_URL = 'https://nkowaokwu.com';
+export const VOLUNTEER_PAGE_URL = 'https://nkowaokwu.com/volunteer';
 export const SPEECH_TO_TEXT_APP_URL = 'https://speech.igboapi.com';
 export const GITHUB_REPO = 'https://github.com/nkowaokwu/igbo_api';
 export const GITHUB_CONTRIBUTORS = 'https://api.github.com/repos/nkowaokwu/igbo_api/contributors';