重构 JavaScript/React 代码，提升可读性、性能、类型安全与可维护性。

# 代码重构提示词 ## 重构建议 ~~~ Refactor the following code to improve: - Readability and maintainability - Performance - Type safety (add TypeScript if missing) - Error handling - Testing strategy - Separation of concerns - Modern JavaScript/React patterns Keep the same functionality but improve the code structure and quality. ~~~ ## 从Class组件到Hook组件 ~~~ Convert the following React class component to a functional component using hooks: - Replace lifecycle methods with useEffect hooks - Convert state management to useState/useReducer - Handle refs appropriately - Maintain the same functionality - Add proper TypeScript typing - Include proper cleanup functions ~~~