Revert "Implement sticky date separators"

package.json

@@ -73,7 +73,6 @@
     "react-addons-css-transition-group": "15.3.2",
     "react-dom": "^15.4.0",
     "react-gemini-scrollbar": "matrix-org/react-gemini-scrollbar#5e97aef",
-    "react-sticky": "^6.0.1",
     "sanitize-html": "^1.14.1",
     "text-encoding-utf-8": "^1.0.1",
     "url": "^0.11.0",

src/DateUtils.js

@@ -30,18 +30,6 @@ function getDaysArray() {
     ];
 }
 
-function getLongDaysArray() {
-    return [
-        _t('Sunday'),
-        _t('Monday'),
-        _t('Tuesday'),
-        _t('Wednesday'),
-        _t('Thursday'),
-        _t('Friday'),
-        _t('Saturday'),
-    ];
-}
-
 function getMonthsArray() {
     return [
         _t('Jan'),
@@ -108,38 +96,6 @@ module.exports = {
         });
     },
 
-    formatDateSeparator: function(date) {
-        const days = getDaysArray();
-        const longDays = getLongDaysArray();
-        const months = getMonthsArray();
-
-        const today = new Date();
-        const yesterday = new Date();
-        yesterday.setDate(today.getDate() - 1);
-
-        if (date.toDateString() === today.toDateString()) {
-            return _t('Today');
-        } else if (date.toDateString() === yesterday.toDateString()) {
-            return _t('Yesterday');
-        } else if (today.getTime() - date.getTime() < 6 * 24 * 60 * 60 * 1000) {
-            return longDays[date.getDay()];
-        } else if (today.getTime() - date.getTime() < 365 * 24 * 60 * 60 * 1000) {
-            return _t('%(weekDayName)s, %(monthName)s %(day)s', {
-                weekDayName: days[date.getDay()],
-                monthName: months[date.getMonth()],
-                day: date.getDate(),
-                fullYear: date.getFullYear(),
-            });
-        } else {
-            return _t('%(weekDayName)s, %(monthName)s %(day)s %(fullYear)s', {
-                weekDayName: days[date.getDay()],
-                monthName: months[date.getMonth()],
-                day: date.getDate(),
-                fullYear: date.getFullYear(),
-            });
-        }
-    },
-
     formatTime: function(date, showTwelveHour=false) {
         if (showTwelveHour) {
           return twelveHourTime(date);

src/components/structures/MessagePanel.js

@@ -61,6 +61,9 @@ module.exports = React.createClass({
         // for pending messages.
         ourUserId: React.PropTypes.string,
 
+        // true to suppress the date at the start of the timeline
+        suppressFirstDateSeparator: React.PropTypes.bool,
+
         // whether to show read receipts
         showReadReceipts: React.PropTypes.bool,
 
@@ -514,10 +517,10 @@ module.exports = React.createClass({
 
     _wantsDateSeparator: function(prevEvent, nextEventDate) {
         if (prevEvent == null) {
-            // First event in the panel always wants a DateSeparator
+            // first event in the panel: depends if we could back-paginate from
-            return true;
+            // here.
+            return !this.props.suppressFirstDateSeparator;
         }
-
         const prevEventDate = prevEvent.getDate();
         if (!nextEventDate || !prevEventDate) {
             return false;

src/components/structures/TimelinePanel.js

@@ -1147,6 +1147,7 @@ var TimelinePanel = React.createClass({
                           highlightedEventId={ this.props.highlightedEventId }
                           readMarkerEventId={ this.state.readMarkerEventId }
                           readMarkerVisible={ this.state.readMarkerVisible }
+                          suppressFirstDateSeparator={ this.state.canBackPaginate }
                           showUrlPreview={ this.props.showUrlPreview }
                           showReadReceipts={ this.props.showReadReceipts }
                           ourUserId={ MatrixClientPeg.get().credentials.userId }

test/components/structures/TimelinePanel-test.js

@@ -234,6 +234,7 @@ describe('TimelinePanel', function() {
             // 5 times, and we should have given up paginating
             expect(client.paginateEventTimeline.callCount).toEqual(5);
             expect(messagePanel.props.backPaginating).toBe(false);
+            expect(messagePanel.props.suppressFirstDateSeparator).toBe(false);
 
             // now, if we update the events, there shouldn't be any
             // more requests.
@@ -338,6 +339,7 @@ describe('TimelinePanel', function() {
         awaitScroll().then(() => {
             // we should now have loaded the first few events
             expect(messagePanel.props.backPaginating).toBe(false);
+            expect(messagePanel.props.suppressFirstDateSeparator).toBe(true);
 
             // back-paginate until we hit the start
             return backPaginate();
@@ -345,6 +347,7 @@ describe('TimelinePanel', function() {
             // hopefully, we got to the start of the timeline
             expect(messagePanel.props.backPaginating).toBe(false);
 
+            expect(messagePanel.props.suppressFirstDateSeparator).toBe(false);
             var events = scryEventTiles(panel);
             expect(events[0].props.mxEvent).toBe(timeline.getEvents()[0]);