fix: moved actions to top of timeline

flamingchickens1540 · Nov 4, 2024 · e5fae01 · e5fae01
1 parent d299b54
commit e5fae01
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 10 deletions.
diff --git a/src/lib/components/Timeline.svelte b/src/lib/components/Timeline.svelte
@@ -3,14 +3,15 @@
 	import Action from './Action.svelte';
 
 	let { actions = $bindable() }: { actions: ActionData[] } = $props()
+	let latestActions: ActionData[] = $derived(actions.toReversed().slice(0, 5))
 </script>
 
 <div class="flex flex-col items-center h-[80vh] bg-btn_grey text-text_white p-1 rounded gap-2 w-80">
-	{#each actions as _, i}
+	{#each latestActions as _, i}
 		<Action
-			bind:action={actions[i]}
+			bind:action={latestActions[i]}
 			deleteself={() => {
-				actions.splice(i, 1);
+				actions.splice(actions.indexOf(latestActions[i]), 1);
 			}}
 		/>
 	{/each}

diff --git a/src/routes/scout/+page.svelte b/src/routes/scout/+page.svelte
@@ -4,17 +4,19 @@
 
 	function addAction() {
 		//everything here is for testing, as there is no system for this yet
-		latestActions.push({ type: actionType.ScoreAnotherRobotsTote, result: actionResult.success });
-		latestActions.push({ type: actionType.EjectTote, result: actionResult.fail });
-		latestActions.push({ type: actionType.IntakeTote, result: actionResult.success });
+		actions.push({ type: actionType.ScoreAnotherRobotsTote, result: actionResult.success });
+		actions.push({ type: actionType.EjectTote, result: actionResult.fail });
+		actions.push({ type: actionType.IntakeTote, result: actionResult.success });
 	}
 
-	let latestActions: ActionData[] = $state([]);
+	let actions: ActionData[] = $state([]);
 </script>
 
 <main class="flex flex-col items-center gap-2 p-2 justify-center h-screen">
-    <Timeline bind:actions={latestActions} />
+	<Timeline bind:actions={actions} />
 
-    <!--to be changed in the future-->
-    <button class="bg-btn_grey w-80 p-1 rounded border-2 border-outline_gray" onclick={addAction}>Add Action</button>
+	<!--to be changed in the future-->
+	<button class="bg-btn_grey w-80 p-1 rounded border-2 border-outline_gray" onclick={addAction}
+		>Add Action</button
+	>
 </main>