Show only days that have items on it

wix#416 (comment)
CHOIMINSEOK · Dec 6, 2019 · 6f0f014 · 6f0f014
1 parent 36e3ad9
commit 6f0f014
Show file tree

Hide file tree

Showing 2 changed files with 31 additions and 12 deletions.
diff --git a/example/src/screens/agenda.js b/example/src/screens/agenda.js
@@ -17,9 +17,10 @@ export default class AgendaScreen extends Component {
         loadItemsForMonth={this.loadItems.bind(this)}
         selected={'2017-05-16'}
         renderItem={this.renderItem.bind(this)}
-        renderEmptyDate={this.renderEmptyDate.bind(this)}
+        renderEmptyDate={this._renderEmptyDate.bind(this)}
         rowHasChanged={this.rowHasChanged.bind(this)}
         enableInfiniteScrollingForPast={true}
+        renderDay={this._renderDay.bind(this)}
         // markingType={'period'}
         // markedDates={{
         //    '2017-05-08': {textColor: '#666'},
@@ -37,6 +38,16 @@ export default class AgendaScreen extends Component {
     );
   }
 
+  _renderDay = (day, item) => {
+    if (!item) {
+      return <View></View>;
+    }
+  };
+
+  _renderEmptyDate = () => {
+    return <View style={{height: 0}}></View>;
+  };
+
   loadItems(day) {
     setTimeout(() => {
       for (let i = -15; i < 85; i++) {

diff --git a/src/agenda/reservation-list/reservation.js b/src/agenda/reservation-list/reservation.js
@@ -7,7 +7,7 @@ import styleConstructor from './style';
 
 class ReservationListItem extends Component {
   static displayName = 'IGNORE';
-  
+
   constructor(props) {
     super(props);
     this.styles = styleConstructor(props.theme);
@@ -35,20 +35,30 @@ class ReservationListItem extends Component {
 
   renderDate(date, item) {
     if (this.props.renderDay) {
-      return this.props.renderDay(date ? xdateToData(date) : undefined, item);
+      let ret = this.props.renderDay(
+        date ? xdateToData(date) : undefined,
+        item,
+      );
+      if (ret) {
+        return ret;
+      }
     }
-    const today = dateutils.sameDate(date, XDate()) ? this.styles.today : undefined;
+    const today = dateutils.sameDate(date, XDate())
+      ? this.styles.today
+      : undefined;
     if (date) {
       return (
         <View style={this.styles.day}>
-          <Text allowFontScaling={false} style={[this.styles.dayNum, today]}>{date.getDate()}</Text>
-          <Text allowFontScaling={false} style={[this.styles.dayText, today]}>{XDate.locales[XDate.defaultLocale].dayNamesShort[date.getDay()]}</Text>
+          <Text allowFontScaling={false} style={[this.styles.dayNum, today]}>
+            {date.getDate()}
+          </Text>
+          <Text allowFontScaling={false} style={[this.styles.dayText, today]}>
+            {XDate.locales[XDate.defaultLocale].dayNamesShort[date.getDay()]}
+          </Text>
         </View>
       );
     } else {
-      return (
-        <View style={this.styles.day}/>
-      );
+      return <View style={this.styles.day} />;
     }
   }
 
@@ -64,9 +74,7 @@ class ReservationListItem extends Component {
     return (
       <View style={this.styles.container}>
         {this.renderDate(date, reservation)}
-        <View style={{flex:1}}>
-          {content}
-        </View>
+        <View style={{flex: 1}}>{content}</View>
       </View>
     );
   }