diff --git a/admin/inertia/components/InstallActivityFeed.tsx b/admin/inertia/components/InstallActivityFeed.tsx
index 21da57d..152964c 100644
--- a/admin/inertia/components/InstallActivityFeed.tsx
+++ b/admin/inertia/components/InstallActivityFeed.tsx
@@ -1,3 +1,4 @@
+import { useEffect, useRef } from 'react'
 import { IconCircleCheck, IconCircleX } from '@tabler/icons-react'
 import classNames from '~/lib/classNames'
 
@@ -44,10 +45,18 @@ export type InstallActivityFeedProps = {
 }
 
 const InstallActivityFeed: React.FC<InstallActivityFeedProps> = ({ activity, className, withHeader = false }) => {
+  const listRef = useRef<HTMLUListElement>(null)
+
+  useEffect(() => {
+    if (listRef.current) {
+      listRef.current.scrollTop = listRef.current.scrollHeight
+    }
+  }, [activity])
+
   return (
     <div className={classNames('bg-surface-primary shadow-sm rounded-lg p-6', className)}>
       {withHeader && <h2 className="text-lg font-semibold text-text-primary">Installation Activity</h2>}
-      <ul role="list" className={classNames("space-y-6 text-desert-green", withHeader ? 'mt-6' : '')}>
+      <ul ref={listRef} role="list" className={classNames("space-y-6 text-desert-green max-h-[400px] overflow-y-auto scroll-smooth", withHeader ? 'mt-6' : '')}>
         {activity.map((activityItem, activityItemIdx) => (
           <li key={activityItem.timestamp} className="relative flex gap-x-4">
             <div