fix: resolve typescript build errors for docker deployment

- fix motion.div className prop issues by using style attribute
- add react-icons to web dependencies
- fix useRef type annotations for NodeJS.Timeout
- update processToolContent return type signature

all typescript errors resolved, docker build now succeeds

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

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

Author: caffeinum

Dockerfile

@@ -7,23 +7,25 @@ RUN apk add --no-cache python3 py3-pip python3-dev build-base git
 # set working directory
 WORKDIR /app
 
-# copy package files
+# copy package files and scripts
 COPY package*.json ./
+COPY scripts ./scripts
 COPY apps/web/package*.json ./apps/web/
 COPY apps/api/requirements.txt ./apps/api/
 
-# install node dependencies
-RUN npm ci --only=production
-
-# install web dependencies
-WORKDIR /app/apps/web
-RUN npm ci --only=production
+# install node dependencies without running postinstall
+RUN npm ci --only=production --ignore-scripts
 
 # build stage for next.js
 FROM base AS builder
 WORKDIR /app
 COPY . .
 
+# install all dependencies for build
+RUN npm ci --ignore-scripts
+WORKDIR /app/apps/web
+RUN npm ci
+
 # build next.js app
 WORKDIR /app/apps/web
 RUN npm run build

apps/web/app/page.tsx

@@ -984,8 +984,8 @@ export default function HomePage() {
             initial={{ opacity: 0, scale: 0.9 }}
             animate={{ opacity: 1, scale: 1 }}
             exit={{ opacity: 0, scale: 0.9 }}
-            className="bg-white dark:bg-gray-900 rounded-lg p-6 max-w-md w-full mx-4 border border-gray-200 dark:border-gray-700"
           >
+            <div className="bg-white dark:bg-gray-900 rounded-lg p-6 max-w-md w-full mx-4 border border-gray-200 dark:border-gray-700">
             <div className="flex items-center gap-3 mb-4">
               <div className="w-10 h-10 bg-red-100 dark:bg-red-900/20 rounded-full flex items-center justify-center">
                 <svg className="w-5 h-5 text-red-600 dark:text-red-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -1029,6 +1029,7 @@ export default function HomePage() {
                 )}
               </button>
             </div>
+            </div>
           </motion.div>
         </div>
       )}

apps/web/components/ChatLog.tsx

@@ -9,7 +9,12 @@ import ToolResultItem from './ToolResultItem';
 // Tool Message Component - Enhanced with new design
 const ToolMessage = ({ content, metadata }: { content: unknown; metadata?: { tool_name?: string; summary?: string; description?: string; file_path?: string; [key: string]: unknown } }) => {
   // Process tool content to extract action and file path
-  const processToolContent = (rawContent: unknown) => {
+  const processToolContent = (rawContent: unknown): { 
+    action: 'Edited' | 'Created' | 'Read' | 'Deleted' | 'Generated' | 'Searched' | 'Executed';
+    filePath: string;
+    cleanContent: string | undefined;
+    toolName: string;
+  } => {
     let processedContent = '' as string;
     let action: 'Edited' | 'Created' | 'Read' | 'Deleted' | 'Generated' | 'Searched' | 'Executed' = 'Executed';
     let filePath = '';

apps/web/components/ToolResultItem.tsx

@@ -110,7 +110,7 @@ const ToolResultItem: React.FC<ToolResultItemProps> = ({ action, filePath, conte
             animate={{ height: 'auto', opacity: 1 }}
             exit={{ height: 0, opacity: 0 }}
             transition={{ duration: 0.2 }}
-            className="overflow-hidden"
+            style={{ overflow: 'hidden' }}
           >
             <div className="mt-2 ml-6 p-3 bg-gray-50 dark:bg-gray-900 rounded-lg">
               <pre className="text-xs text-gray-700 dark:text-gray-300 font-mono whitespace-pre-wrap break-words">

apps/web/hooks/useUserRequests.ts

@@ -14,7 +14,7 @@ export function useUserRequests({ projectId }: UseUserRequestsOptions) {
   const [activeCount, setActiveCount] = useState(0);
   const [isTabVisible, setIsTabVisible] = useState(true); // 기본값 true로 설정
 
-  const intervalRef = useRef<NodeJS.Timeout>();
+  const intervalRef = useRef<NodeJS.Timeout | null>(null);
   const previousActiveState = useRef(false);
 
   // 탭 활성화 상태 추적
@@ -65,7 +65,7 @@ export function useUserRequests({ projectId }: UseUserRequestsOptions) {
     if (!isTabVisible) {
       if (intervalRef.current) {
         clearInterval(intervalRef.current);
-        intervalRef.current = undefined;
+        intervalRef.current = null;
       }
       return;
     }

apps/web/package.json

@@ -18,6 +18,7 @@
     "open": "^10.2.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
+    "react-icons": "^5.5.0",
     "react-markdown": "^10.1.0",
     "react-syntax-highlighter": "^15.5.0"
   },