How to add Translation in Front Pages

To add translation in front pages, you need to follow these steps:

1. Move the whole src/app/front-pages folder inside the [lang]/(blank-layout-pages) folder

2. After moving the front-pages folder inside the [lang]/(blank-layout-pages) folder, you need to update the src/app/[lang]/(blank-layout-pages)/front-pages/layout.tsx file. Copy the following code and paste it inside this file:

   // Component Imports
   import FrontLayout from '@components/layout/front-pages'
   
   // Context Imports
   import { IntersectionProvider } from '@/contexts/intersectionContext'
   
   // Type Imports
   import type { ChildrenType } from '@core/types'
   
   const Layout = ({ children }: ChildrenType) => {
     return (
       <IntersectionProvider>
         <FrontLayout>{children}</FrontLayout>
       </IntersectionProvider>
     )
   }
   
   export default Layout

3. Now It is important to update the URL throughout the front-pages folder, to make the translation work for navigating to the front pages.

   For example lets update links of src/components/layout/front-pages/DropdownMenu.tsx file:

   - import { usePathname } from 'next/navigation'
   + import { usePathname, useParams } from 'next/navigation'
   
   + import type { Locale } from '@configs/i18n'
   + import { getLocalizedUrl } from '@/utils/i18n'
   
   + const { lang: locale } = useParams() // inside the main component

   Change the following code from:

   <Link
     href={'/front-pages' + page.href}
     ...
   >
     ...
   </Link>

   To:

   <Link
     href={getLocalizedUrl('/front-pages' + page.href, locale as Locale)}
     ...
   >
     ...
   </Link>

   Now this need to be implenented in all the files inside the src/components/layout/front-pages and src/views/front-pages folders for the translation to work.

That's it! Now the front pages are Translation ready.