From a4941ad67873c6a29ec17e26c6b40988f6899d98 Mon Sep 17 00:00:00 2001 From: Martin Bavio Date: Mon, 26 Oct 2020 23:42:45 -0300 Subject: [PATCH] Add support for dynamic flags images and alts --- components/core/I18nWidget/I18nWidget.tsx | 38 ++++++++++++++++++---- public/flag-en-us.svg | 1 + public/flag-es.svg | 1 + public/flag-us.png | Bin 762 -> 0 bytes 4 files changed, 34 insertions(+), 6 deletions(-) create mode 100644 public/flag-en-us.svg create mode 100644 public/flag-es.svg delete mode 100644 public/flag-us.png diff --git a/components/core/I18nWidget/I18nWidget.tsx b/components/core/I18nWidget/I18nWidget.tsx index 132553f7f..31f2db76f 100644 --- a/components/core/I18nWidget/I18nWidget.tsx +++ b/components/core/I18nWidget/I18nWidget.tsx @@ -6,21 +6,47 @@ import { Menu } from '@headlessui/react' import { DoubleChevron } from '@components/icons' import s from './I18nWidget.module.css' -const LOCALES_MAP: Record = { - es: 'Español', - 'en-US': 'English', +interface LOCALE_DATA { + name: string + img: { + filename: string + alt: string + } +} + +const LOCALES_MAP: Record = { + es: { + name: 'Español', + img: { + filename: 'flag-es.svg', + alt: 'Bandera española', + }, + }, + 'en-US': { + name: 'English', + img: { + filename: 'flag-en-us.svg', + alt: 'US Flag', + }, + }, } const I18nWidget: FC = () => { const { locale, locales, defaultLocale = 'en-US' } = useRouter() const options = locales?.filter((val) => val !== locale) + const currentLocale = locale || defaultLocale + return (