feat(langselect): add optional language selector

edly-io · May 8, 2019 · 85ed8fb · 85ed8fb
1 parent d6adfec
commit 85ed8fb
Show file tree

Hide file tree

Showing 4 changed files with 542 additions and 0 deletions.
diff --git a/src/index.jsx b/src/index.jsx
@@ -56,6 +56,7 @@ const socialLinks = [
   },
 ];
 
+
 const App = () => (
   <IntlProvider locale="en">
     <SiteFooter
@@ -71,6 +72,21 @@ const App = () => (
       googlePlayUrl="https://play.google.com"
       handleAllTrackEvents={() => {}}
       socialLinks={socialLinks}
+      supportedLanguages={[
+        {
+          label: 'English',
+          value: 'en',
+        }, {
+          label: 'español',
+          value: 'es-419',
+        },
+      ]}
+      languageForm={{
+        activeLanguage: 'en',
+        screenReaderLabel: 'Choose Language',
+        submitLabel: 'Apply',
+        onLanguageSelected: () => {},
+      }}
     />
   </IntlProvider>
 );

diff --git a/src/lib/components/SiteFooter/SiteFooter.test.jsx b/src/lib/components/SiteFooter/SiteFooter.test.jsx
@@ -56,6 +56,23 @@ const socialLinks = [
   },
 ];
 
+const supportedLanguages = [
+  {
+    label: 'English',
+    value: 'en',
+  }, {
+    label: 'español',
+    value: 'es-419',
+  },
+];
+
+const languageForm = {
+  activeLanguage: 'en',
+  screenReaderLabel: 'Choose Language',
+  submitLabel: 'Apply',
+  onLanguageSelected: () => {},
+};
+
 const completeSiteFooterComponent = mockHandleAllTrackEvents =>
   (
     <IntlProvider locale="en">
@@ -72,6 +89,8 @@ const completeSiteFooterComponent = mockHandleAllTrackEvents =>
         appleAppStoreUrl="https://store.apple.com"
         googlePlayUrl="https://play.google.com"
         handleAllTrackEvents={mockHandleAllTrackEvents}
+        supportedLanguages={supportedLanguages}
+        languageForm={languageForm}
       />
     </IntlProvider>
   );
@@ -101,6 +120,8 @@ describe('<SiteFooter />', () => {
               privacyPolicyUrl="https://www.example.com/privacy-policy"
               appleAppStoreUrl="https://store.apple.com"
               googlePlayUrl="https://play.google.com"
+              supportedLanguages={supportedLanguages}
+              languageForm={languageForm}
               handleAllTrackEvents={jest.fn()}
             />
           </IntlProvider>
@@ -124,13 +145,37 @@ describe('<SiteFooter />', () => {
               socialLinks={socialLinks}
               appleAppStoreUrl="https://store.apple.com"
               googlePlayUrl="https://play.google.com"
+              supportedLanguages={supportedLanguages}
+              languageForm={languageForm}
               handleAllTrackEvents={jest.fn()}
               showMobileLinks={false}
             />
           </IntlProvider>
         )).toJSON();
       expect(tree).toMatchSnapshot();
     });
+
+    it('does not render language selector', () => {
+      const tree = renderer
+        .create((
+          <IntlProvider locale="en">
+            <SiteFooter
+              siteName="example"
+              siteLogo={FooterLogo}
+              marketingSiteBaseUrl="https://www.example.com"
+              supportUrl="https://www.example.com/support"
+              contactUrl="https://www.example.com/contact"
+              openSourceUrl="https://www.example.com/open"
+              termsOfServiceUrl="https://www.example.com/terms-of-service"
+              privacyPolicyUrl="https://www.example.com/privacy-policy"
+              appleAppStoreUrl="https://store.apple.com"
+              googlePlayUrl="https://play.google.com"
+              handleAllTrackEvents={jest.fn()}
+            />
+          </IntlProvider>
+        )).toJSON();
+      expect(tree).toMatchSnapshot();
+    });
   });
 
   describe('handles analytics', () => {