diff --git a/ui/app/templates/allocations/allocation/index.hbs b/ui/app/templates/allocations/allocation/index.hbs
index a4e885fd0..1aa22ab0a 100644
--- a/ui/app/templates/allocations/allocation/index.hbs
+++ b/ui/app/templates/allocations/allocation/index.hbs
@@ -98,36 +98,7 @@
           Reschedule Events
         </div>
         <div class="boxed-section-body">
-          <ol class="timeline">
-            {{#if model.nextAllocation}}
-              {{reschedule-event-row
-                label="Next Allocation"
-                allocation=model.nextAllocation
-                time=model.nextAllocation.modifyTime}}
-            {{/if}}
-            {{#if model.hasStoppedRescheduling}}
-              <li class="timeline-note">
-                {{x-icon "warning" class="is-warning is-text"}} Nomad has stopped attempting to reschedule this allocation.
-              </li>
-            {{/if}}
-            {{#if (and model.followUpEvaluation.waitUntil (not model.nextAllocation))}}
-              <li class="timeline-note">
-                {{x-icon "clock" class="is-info is-text"}} Nomad will attempt to reschedule
-                {{moment-from-now model.followUpEvaluation.waitUntil interval=1000}}
-              </li>
-            {{/if}}
-            {{reschedule-event-row
-              label="This Allocation"
-              allocation=model
-              linkToAllocation=false
-              time=model.modifyTime}}
-
-            {{#each (reverse model.rescheduleEvents) as |event|}}
-              {{reschedule-event-row
-                allocationId=event.previousAllocationId
-                time=event.time}}
-            {{/each}}
-          </ol>
+          {{reschedule-event-timeline allocation=model}}
         </div>
       </div>
     {{/if}}
diff --git a/ui/app/templates/components/reschedule-event-timeline.hbs b/ui/app/templates/components/reschedule-event-timeline.hbs
new file mode 100644
index 000000000..8a75433c2
--- /dev/null
+++ b/ui/app/templates/components/reschedule-event-timeline.hbs
@@ -0,0 +1,30 @@
+<ol class="timeline">
+  {{#if allocation.nextAllocation}}
+    {{reschedule-event-row
+      label="Next Allocation"
+      allocation=allocation.nextAllocation
+      time=allocation.nextAllocation.modifyTime}}
+  {{/if}}
+  {{#if allocation.hasStoppedRescheduling}}
+    <li class="timeline-note">
+      {{x-icon "warning" class="is-warning is-text"}} Nomad has stopped attempting to reschedule this allocation.
+    </li>
+  {{/if}}
+  {{#if (and allocation.followUpEvaluation.waitUntil (not allocation.nextAllocation))}}
+    <li class="timeline-note">
+      {{x-icon "clock" class="is-info is-text"}} Nomad will attempt to reschedule
+      {{moment-from-now allocation.followUpEvaluation.waitUntil interval=1000}}
+    </li>
+  {{/if}}
+  {{reschedule-event-row
+    label="This Allocation"
+    allocation=allocation
+    linkToAllocation=false
+    time=allocation.modifyTime}}
+
+  {{#each (reverse allocation.rescheduleEvents) as |event|}}
+    {{reschedule-event-row
+      allocationId=event.previousAllocationId
+      time=event.time}}
+  {{/each}}
+</ol>