diff --git a/.storybook/config.js b/.storybook/config.js
index 1a7e0177..5096b9c6 100644
--- a/.storybook/config.js
+++ b/.storybook/config.js
@@ -1,14 +1,11 @@
-import { configure } from '@storybook/react';
-import '@formatjs/intl-relativetimeformat/polyfill';
-import '@formatjs/intl-relativetimeformat/locale-data/en';
import React from 'react';
+import { configure } from '@storybook/react';
import { addDecorator } from '@storybook/react';
import { withKnobs } from '@storybook/addon-knobs';
import StoryRouter from 'storybook-router';
import { withSmartKnobs } from 'storybook-addon-smart-knobs';
import { setIntlConfig, withIntl } from 'storybook-addon-intl';
-// import enLocaleData from 'react-intl/locale-data/en';
-import { translationMessages, appLocales, DEFAULT_LOCALE } from '../app/i18n.js';
+import { translationMessages, appLocales, DEFAULT_LOCALE } from '../app/i18n.ts';
Object.values = (obj) => Object.keys(obj).map((key) => obj[key]);
diff --git a/README.md b/README.md
index eae3864c..33bb202a 100644
--- a/README.md
+++ b/README.md
@@ -118,9 +118,9 @@ An enterprise react template application showcasing - Testing strategies, Global
- [app/containers/HomeContainer/index.tsx](app/containers/HomeContainer/index.tsx)
-## Localization using react-intl
+## Localization using Lingui
-- Translations using [React Intl](https://github.com/formatjs/react-intl)
+- Translations using [Lingui](https://github.com/lingui/js-lingui)
Take a look at the following files
diff --git a/app/components/Clickable/tests/__snapshots__/index.test.tsx.snap b/app/components/Clickable/tests/__snapshots__/index.test.tsx.snap
index a2c678b1..93dd7f08 100644
--- a/app/components/Clickable/tests/__snapshots__/index.test.tsx.snap
+++ b/app/components/Clickable/tests/__snapshots__/index.test.tsx.snap
@@ -3,6 +3,7 @@
exports[` component tests should render and match the snapshot 1`] = `
+
component tests should render and match the snapshot 1`]
List of launches
+
`;
diff --git a/app/components/ErrorBoundary/index.tsx b/app/components/ErrorBoundary/index.tsx
index 7545a730..d00cac3f 100644
--- a/app/components/ErrorBoundary/index.tsx
+++ b/app/components/ErrorBoundary/index.tsx
@@ -5,7 +5,7 @@
*/
import React, { PropsWithChildren } from 'react';
-import { translate } from '@components/IntlGlobalProvider/index';
+import { translate } from '@app/utils';
interface ErrorState {
hasError: boolean;
diff --git a/app/components/ErrorHandler/index.tsx b/app/components/ErrorHandler/index.tsx
index 51a9dd1c..cc42cbe4 100644
--- a/app/components/ErrorHandler/index.tsx
+++ b/app/components/ErrorHandler/index.tsx
@@ -13,7 +13,7 @@ const CustomCard = styled(Card)`
interface ErrorHandlerTypes {
loading: boolean;
- launchListError?: string;
+ launchListError: string;
}
export function ErrorHandler({ loading, launchListError }: ErrorHandlerTypes) {
@@ -21,7 +21,7 @@ export function ErrorHandler({ loading, launchListError }: ErrorHandlerTypes) {
return (
}>
-
+
);
diff --git a/app/components/ErrorHandler/tests/__snapshots__/index.test.js.snap b/app/components/ErrorHandler/tests/__snapshots__/index.test.js.snap
index 074b82b8..cfc8cd94 100644
--- a/app/components/ErrorHandler/tests/__snapshots__/index.test.js.snap
+++ b/app/components/ErrorHandler/tests/__snapshots__/index.test.js.snap
@@ -3,6 +3,7 @@
exports[` should render and match the snapshot 1`] = `
+
should render and match the snapshot 1`] = `
class="T__StyledText-znbtqz-0 TmgHn"
data-testid="error-message"
>
- something_went_wrong
+ Something went wrong
+
`;
diff --git a/app/components/Header/index.tsx b/app/components/Header/index.tsx
index ed95f48f..07cf9b09 100644
--- a/app/components/Header/index.tsx
+++ b/app/components/Header/index.tsx
@@ -18,7 +18,7 @@ const StyledHeader = styled(Layout.Header)`
height: ${(props) => props.theme.headerHeight};
align-items: center;
justify-content: center;
- background-color: ${colors.primary};
+ background-color: ${colors.lightGreen};
gap: 1rem;
${media.lessThan('mobile')`
padding-left: ${(props) => props.theme.sidebarWidth}
diff --git a/app/components/Header/tests/__snapshots__/index.test.tsx.snap b/app/components/Header/tests/__snapshots__/index.test.tsx.snap
index b7c12fb4..3c1aae5c 100644
--- a/app/components/Header/tests/__snapshots__/index.test.tsx.snap
+++ b/app/components/Header/tests/__snapshots__/index.test.tsx.snap
@@ -4,7 +4,7 @@ exports[` should render and match the snapshot 1`] = `