feat: Update MessageItem to use EditAction component

- Refactor MessageItem to use new EditAction component
- Reorder display: show EditAction before cat message
- Remove duplicate diff formatting logic
- Improve component separation and reusability

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

Author: koki-develop

src/components/MessageItem.tsx

@@ -1,6 +1,7 @@
 import { Box, Text } from "ink";
 import type React from "react";
 import { indent } from "../lib/util";
+import { EditAction } from "./EditAction";
 import type { Message } from "./types";
 
 interface MessageItemProps {
@@ -11,7 +12,10 @@ export const MessageItem: React.FC<MessageItemProps> = ({ message }) => {
   const isUser = message.sender === "user";
 
   return (
-    <Box marginBottom={1} paddingLeft={1}>
+    <Box flexDirection="column" marginBottom={1} paddingLeft={1}>
+      {!isUser && message.action?.type === "edit" && (
+        <EditAction action={message.action} />
+      )}
       <Text color={isUser ? "gray" : undefined}>
         {isUser ? `> ${indent(message.text)}` : `⏺ ${indent(message.text)}`}
       </Text>