✨ Multiple updates

- Upgrade to Ionic 8
- Move fab position
- Fix rocket not moving once log limit is reached
- Other misc fixes

components/demo/Journey/index.tsx

@@ -74,7 +74,7 @@ export function useStarshipYPosition(
 		const todoDistanceFromCommonAncestor = nextTodoPosition.top
 		const starshipHeightAdjustment =
 			(nextTodoPosition.height - starship?.offsetHeight) / 2
-		const additionalOffset = -5 // Just a visual thing to make the center of the rocket align and ignore the tail
+		const additionalOffset = 0 // Just a visual thing to make the center of the rocket align and ignore the tail
 
 		const y =
 			todoDistanceFromCommonAncestor +

components/pages/Home.tsx

@@ -217,6 +217,7 @@ export const TodoLists = ({}: {}) => {
 			iceboxTodosPromise,
 		])
 	}, [inActiveStarRoles, iceboxLimit, logLimit, query])
+	console.log(logLimit)
 
 	const loading = todos === undefined
 
@@ -271,22 +272,21 @@ export const TodoLists = ({}: {}) => {
 
 	return (
 		<IonContent ref={contentRef}>
-			<IonFab
-				horizontal="end"
-				slot="fixed"
-				vertical="bottom"
-			>
-				<IonFabButton onClick={openCreateTodoModal}>
-					<IonIcon icon={add}></IonIcon>
-				</IonFabButton>
-			</IonFab>
 			<IonGrid className="h-full ion-no-padding">
 				<IonRow className="h-full">
 					<IonCol
 						className="relative"
 						size="auto"
 						sizeLg="2"
 					>
+						<IonFab className="fixed min-[992px]:left-[calc(100vw/12*2-40px-17px)] bottom-16">
+							<IonFabButton
+								onClick={openCreateTodoModal}
+								size="small"
+							>
+								<IonIcon icon={add}></IonIcon>
+							</IonFabButton>
+						</IonFab>
 						<Journey commonAncestor={contentRef} />
 					</IonCol>
 					<IonCol sizeLg="8">
@@ -366,6 +366,7 @@ export const TodoLists = ({}: {}) => {
 															])
 														},
 													)
+													setLogLimit(limit => limit - 1)
 												}}
 												checked={!!todo.completedAt}
 											/>
@@ -425,7 +426,7 @@ export const TodoLists = ({}: {}) => {
 											>
 												<IonItem
 													button
-													className="todo ion-no-"
+													className="todo"
 													onClick={event => {
 														// Prevent the action sheet from opening when reordering
 														if (event.target['localName'] === 'ion-item') return
@@ -474,6 +475,7 @@ export const TodoLists = ({}: {}) => {
 																	])
 																},
 															)
+															setLogLimit(limit => limit + 1)
 														}}
 													/>
 													<IonLabel>{todo?.title}</IonLabel>
@@ -521,12 +523,6 @@ export const TodoLists = ({}: {}) => {
 								>
 									<IonInfiniteScrollContent></IonInfiniteScrollContent>
 								</IonInfiniteScroll>
-								<IonFab
-									ref={fab}
-									slot="fixed"
-									vertical="bottom"
-									horizontal="end"
-								></IonFab>
 							</>
 						)}
 					</IonCol>