diff --git a/src/components/Calendar.tsx b/src/components/Calendar.tsx
index b9d4704..8e8e280 100644
--- a/src/components/Calendar.tsx
+++ b/src/components/Calendar.tsx
@@ -3,6 +3,7 @@ import BigCalendar, { View } from 'react-big-calendar';
 import 'react-big-calendar/lib/css/react-big-calendar.css';
 import * as moment from 'moment';
 import 'moment/locale/en-gb';
+import * as ICAL from 'ical.js';
 
 import { EventType } from '../pim-types';
 
@@ -11,6 +12,9 @@ import './Calendar.css';
 moment.locale('en-gb');
 const calendarLocalizer = BigCalendar.momentLocalizer(moment);
 
+const MAX_RECURRENCE_DATE = ICAL.Time.now();
+MAX_RECURRENCE_DATE.adjust(800, 0, 0, 0);
+
 function eventPropGetter(event: EventType) {
   return {
     style: {
@@ -60,12 +64,34 @@ class Calendar extends React.PureComponent {
   }
 
   render() {
+    const entries = [] as Array<EventType>;
+    this.props.entries.forEach((event) => {
+      entries.push(event);
+
+      if (event.isRecurring()) {
+        const recur = event.iterator();
+
+        let next = recur.next(); // Skip the first one
+        while ((next = recur.next())) {
+          if (next.compare(MAX_RECURRENCE_DATE) > 0) {
+            break;
+          }
+
+          const shift = next.subtractDateTz(event.startDate);
+          const ev = event.clone();
+          ev.startDate.addDuration(shift);
+          ev.endDate.addDuration(shift);
+          entries.push(ev);
+        }
+      }
+    });
+
     return (
       <div style={{width: '100%', height: 'calc(100vh - 230px)', minHeight: 500}}>
         <BigCalendar
           defaultDate={new Date()}
           localizer={calendarLocalizer}
-          events={this.props.entries}
+          events={entries}
           selectable={true}
           onSelectEvent={this.props.onItemClick as any}
           onSelectSlot={this.slotClicked as any}
diff --git a/src/components/EventEdit.tsx b/src/components/EventEdit.tsx
index 56487bd..f9db436 100644
--- a/src/components/EventEdit.tsx
+++ b/src/components/EventEdit.tsx
@@ -205,11 +205,20 @@ class EventEdit extends React.PureComponent {
       },
     };
 
+    const recurring = this.props.item && this.props.item.isRecurring;
+
     return (
       <React.Fragment>
         <h2>
           {this.props.item ? 'Edit Event' : 'New Event'}
         </h2>
+        {recurring && (
+          <div>
+            <span style={{ color: 'red' }}>IMPORTANT: </span>
+            This is a recurring event, for now, only editing the whole series
+            (by editing the first instance) is supported.
+          </div>
+        )}
         {this.state.error && (
           <div>ERROR! {this.state.error}</div>
         )}
diff --git a/src/pim-types.ts b/src/pim-types.ts
index bac872a..775a612 100644
--- a/src/pim-types.ts
+++ b/src/pim-types.ts
@@ -43,7 +43,9 @@ export class EventType extends ICAL.Event implements PimType {
   }
 
   clone() {
-    return new EventType(new ICAL.Component(this.component.toJSON()));
+    const ret = new EventType(new ICAL.Component(this.component.toJSON()));
+    ret.color = this.color;
+    return ret;
   }
 }