Skip to content

Commit

Permalink
feat(language): add language change button
Browse files Browse the repository at this point in the history
The implemented functionality added a language button with options for Spanish (ES) and English (EN).
  • Loading branch information
JE1999 committed May 11, 2024
1 parent afb9e38 commit cfb01de
Show file tree
Hide file tree
Showing 6 changed files with 62 additions and 1 deletion.
9 changes: 9 additions & 0 deletions public/assets/en-language.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 9 additions & 0 deletions public/assets/es-language.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
40 changes: 40 additions & 0 deletions src/components/layout/languageSelector.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
import Image from 'next/image';

import ESLanguage from '@public/assets/es-language.svg';
import ENLanguage from '@public/assets/en-language.svg';
import { useLanguage } from '@/app/[lang]/provider';
import { ButtonApp } from '../elements/button';

export const LanguageSelector = () => {
const { intl } = useLanguage();

const handleLanguageChange = () => {
return window.location.href = `/${intl.language === 'en' ? 'es' : 'en'}/identification`;
};

return (
<div
style={{ marginRight: '16px' }}
>
<ButtonApp
variant='outlined'
startIcon={
<Image
src={intl.language === 'en' ? ESLanguage.src : ENLanguage.src}
alt="icon language"
width="24"
height="24"
/>
}
onClick={() => handleLanguageChange()}
>
{intl.language === 'en'
?
'Español'
:
'English'
}
</ButtonApp>
</div>
);
}
3 changes: 2 additions & 1 deletion src/components/layout/navBar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import styles from './styles.module.css';

import { useLanguage } from '@/app/[lang]/provider';
import { ButtonApp } from '../elements/button';
import { LanguageSelector } from './languageSelector';

export default function Index() {
const { intl } = useLanguage();
Expand Down Expand Up @@ -41,8 +42,8 @@ export default function Index() {
color="primary"
style={{ display: 'none' }}
/>
<LanguageSelector />
<ButtonApp
variant="outlined"
notFullWidth
onClick={() =>
window.open('https://mi.cuentaunica.gob.do/ui/login')
Expand Down
1 change: 1 addition & 0 deletions src/dictionaries/en.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
{
"language": "en",
"common": {
"title": "Cuenta Única Ciudadana",
"hello": "Hello",
Expand Down
1 change: 1 addition & 0 deletions src/dictionaries/es.json
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
{
"language": "es",
"common": {
"title": "Cuenta Única Ciudadana",
"hello": "Hola",
Expand Down

0 comments on commit cfb01de

Please sign in to comment.