Update Code Challenge

.prettierrc

@@ -1,9 +1,9 @@
 {
-  "printWidth": 80,
+  "arrowParens": "avoid",
+  "bracketSpacing": true,
+  "semi": false,
   "tabWidth": 2,
-  "useTabs": false,
-  "semi": true,
   "singleQuote": true,
   "trailingComma": "all",
-  "arrowParens": "avoid"
+  "useTabs": false
 }

README.md

@@ -4,9 +4,9 @@ This is a simple web app that based on the [react-boilerplate CRA template](http
 
 It currently has two pages, an index and a `/countries` page which downloads a list of countries from the CareRev API and displays links to a country detail page. Right now the link leads to a 404. Your task is to add the missing route which will download the details for the selected country and display them.
 
-**NOTE:** The task is broken up into smaller steps and shouldn't take more than an hour or two in total. If you find yourself stuck on any step, simply note where you ran into any problems and what you were trying to do so we can discuss it later, then move on to the next step.
+**NOTE:** If you find yourself stuck on any step, simply note where you ran into any problems and what you were trying to do so we can discuss it later, then move on to the next step.
 
-1. Get the app running with `yarn install` and `yarn start`
+1. Get the app running with `npm install` and `npm start`
 
 2. Add a route for `/country/:id`
 
@@ -20,6 +20,12 @@ It currently has two pages, an index and a `/countries` page which downloads a l
 
 7. Display that country's name and currency code in the container when it loads, using the selector(s).
 
-8. Bonus (optional): Add an error view in case the data fetching has a problem.
+8. Add an error view in case the data fetching has a problem.
 
-This added container should function roughly like the existing `Countries` container. In the interview, we'll discuss this app, ways to improve it, architectural concepts, best practices and what ideas you think are important in making a strong, reliable and easy to use app.
+9. Style the page with tailwind.
+
+10. Ensure the page meets accessibility standards.
+
+11. Add unit tests.
+
+This added container should function roughly like the existing `Countries` container. In the interview, we'll discuss this app, ways to improve it, architectural concepts, best practices and what ideas you think are important in making a strong, reliable and easy to use app.

internals/startingTemplate/src/locales/i18n.ts

@@ -1,18 +1,18 @@
-import i18next from 'i18next';
-import { initReactI18next } from 'react-i18next';
-import LanguageDetector from 'i18next-browser-languagedetector';
+import i18next from 'i18next'
+import { initReactI18next } from 'react-i18next'
+import LanguageDetector from 'i18next-browser-languagedetector'
 
-import en from './en/translation.json';
-import { convertLanguageJsonToObject } from './translations';
+import en from './en/translation.json'
+import { convertLanguageJsonToObject } from './translations'
 
 export const translationsJson = {
   en: {
     translation: en,
   },
-};
+}
 
 // Create the 'translations' object to provide full intellisense support for the static json files.
-convertLanguageJsonToObject(en);
+convertLanguageJsonToObject(en)
 
 export const i18n = i18next
   // pass the i18n instance to react-i18next.
@@ -31,4 +31,4 @@ export const i18n = i18next
     interpolation: {
       escapeValue: false, // not needed for react as it escapes by default
     },
-  });
+  })