[Fix] FutureTimeLine

src/components/organisms/FutureTimeLine.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import TimeLineItem from '../molecules/TimeLineItem'
 import Line from '../atoms/Line'
 
-type MileStone =  {
+type MileStone = {
   userId: string;
   milestoneId: string;
   title: string;
@@ -16,22 +16,27 @@ function FutureTimeLine({ milestones }: { milestones: MileStone[] }) {
   if (milestones.length === 0) {
     return <div>まだイベントがありません</div>
   }
+  else if (milestones.length === 1) {
+    return (
+      <TimeLineItem key={milestones[0].milestoneId} {...milestones[0]} />
+    )
+  }
 
-  const finalMilestone: MileStone | undefined = milestones && milestones.length > 0 ? milestones.pop() : undefined;
-
+  const finalMilestone: MileStone = milestones[-1]
+  const milestonesWithoutFinal: MileStone[] = milestones.slice(0, -1)
 
   return (
     <>
-        {milestones.length > 0 && milestones.map((milestone) => {
-          return (
-            <>
-              <TimeLineItem key={milestone.milestoneId} {...milestone} />
-              <Line />
-            </>
+      {milestonesWithoutFinal.length > 0 && milestones.map((milestone) => {
+        return (
+          <>
+            <TimeLineItem key={milestone.milestoneId} {...milestone} />
+            <Line />
+          </>
 
-          )
-        })}
-        {finalMilestone && <TimeLineItem key={finalMilestone.milestoneId} {...finalMilestone} />}
+        )
+      })}
+      {<TimeLineItem key={finalMilestone.milestoneId} {...finalMilestone} />}
     </>
   )
 }