feat(recent-list): add an explanatory label (#591)

6 files changed, 43 insertions, 8 deletions

diff --git a/app/features/recent-list/components/RecentList.js b/app/features/recent-list/components/RecentList.js
index 2518b93..b206b4b 100644
--- a/app/features/recent-list/components/RecentList.js
+++ b/app/features/recent-list/components/RecentList.js
@@ -2,15 +2,19 @@
 
 import moment from 'moment';
 import React, { Component } from 'react';
+import { withTranslation } from 'react-i18next';
 import { connect } from 'react-redux';
 import type { Dispatch } from 'redux';
+import { compose } from 'redux';
 import { push } from 'react-router-redux';
 
 import { conferenceRemoved } from '../actions';
 import {
     ConferenceCard,
     ConferenceTitle,
+    Label,
     RecentListContainer,
+    RecentListWrapper,
     TruncatedText
 } from '../styled';
 import type { RecentListItem } from '../types';
@@ -28,6 +32,11 @@ type Props = {
      * Array of recent conferences.
      */
     _recentList: Array<RecentListItem>;
+
+    /**
+     * I18next translation function.
+     */
+    t: Function;
 };
 
 /**
@@ -40,14 +49,23 @@ class RecentList extends Component<Props, *> {
      * @returns {ReactElement}
      */
     render() {
+        const { t } = this.props;
+
+        if (this.props._recentList.length === 0) {
+            return null;
+        }
+
         return (
-            <RecentListContainer>
-                {
-                    this.props._recentList.map(
-                        conference => this._renderRecentListEntry(conference)
-                    )
-                }
-            </RecentListContainer>
+            <RecentListWrapper>
+                <Label>{ t('recentListLabel') }</Label>
+                <RecentListContainer>
+                    {
+                        this.props._recentList.map(
+                            conference => this._renderRecentListEntry(conference)
+                        )
+                    }
+                </RecentListContainer>
+            </RecentListWrapper>
         );
     }
 
@@ -160,4 +178,4 @@ function _mapStateToProps(state: Object) {
     };
 }
 
-export default connect(_mapStateToProps)(RecentList);
+export default compose(connect(_mapStateToProps), withTranslation())(RecentList);
diff --git a/app/features/recent-list/styled/Label.js b/app/features/recent-list/styled/Label.js
new file mode 100644
index 0000000..1bb4c6f
--- /dev/null
+++ b/app/features/recent-list/styled/Label.js
@@ -0,0 +1,8 @@
+// @flow
+
+import styled from 'styled-components';
+
+export default styled.span`
+    color: white;
+    padding: 1em;
+`;
diff --git a/app/features/recent-list/styled/RecentListWrapper.js b/app/features/recent-list/styled/RecentListWrapper.js
new file mode 100644
index 0000000..8502823
--- /dev/null
+++ b/app/features/recent-list/styled/RecentListWrapper.js
@@ -0,0 +1,5 @@
+// @flow
+
+import styled from 'styled-components';
+
+export default styled.div``;
diff --git a/app/features/recent-list/styled/index.js b/app/features/recent-list/styled/index.js
index f91e220..97dcb2a 100644
--- a/app/features/recent-list/styled/index.js
+++ b/app/features/recent-list/styled/index.js
@@ -1,4 +1,6 @@
 export { default as ConferenceCard } from './ConferenceCard';
 export { default as ConferenceTitle } from './ConferenceTitle';
+export { default as Label } from './Label';
 export { default as RecentListContainer } from './RecentListContainer';
+export { default as RecentListWrapper } from './RecentListWrapper';
 export { default as TruncatedText } from './TruncatedText';
diff --git a/app/i18n/lang/de.json b/app/i18n/lang/de.json
index d53a02b..8466d8a 100644
--- a/app/i18n/lang/de.json
+++ b/app/i18n/lang/de.json
@@ -4,6 +4,7 @@
 	"help": "Hilfe",
 	"termsLink": "Nutzungsbedingungen",
 	"privacyLink": "Datenschutzbedingungen",
+	"recentListLabel": "oder einen zuletzt genutzen Konferenzraum betreten",
 	"sendFeedbackLink": "Eine Rückmeldung senden",
 	"aboutLink": "F&A",
 	"sourceLink": "Quelltext",
diff --git a/app/i18n/lang/en.json b/app/i18n/lang/en.json
index 5148bd0..7752e56 100644
--- a/app/i18n/lang/en.json
+++ b/app/i18n/lang/en.json
@@ -4,6 +4,7 @@
 	"help": "Help",
 	"termsLink": "Terms",
 	"privacyLink": "Privacy",
+	"recentListLabel": "or rejoin one of your recent conference rooms",
 	"sendFeedbackLink": "Send Feedback",
 	"aboutLink": "About",
 	"sourceLink": "Source Code",