feat:shareConnect拆分|处理effect竞争引发的Bug

chuan-next/src/components/webrtc/WebRTCFileReceive.tsx

@@ -42,6 +42,7 @@ interface WebRTCFileReceiveProps {
   downloadedFiles?: Map<string, File>;
   error?: string | null;
   onReset?: () => void;
+  pickupCode?: string;
 }
 
 export function WebRTCFileReceive({
@@ -53,12 +54,16 @@ export function WebRTCFileReceive({
   isWebSocketConnected = false,
   downloadedFiles,
   error = null,
-  onReset
+  onReset,
+  pickupCode: propPickupCode
 }: WebRTCFileReceiveProps) {
   const [pickupCode, setPickupCode] = useState('');
   const [isValidating, setIsValidating] = useState(false);
   const { showToast } = useToast();
 
+  // 使用传入的取件码或本地状态的取件码
+  const displayPickupCode = propPickupCode || pickupCode;
+
   // 验证取件码是否存在
   const validatePickupCode = async (code: string): Promise<boolean> => {
     try {
@@ -141,13 +146,13 @@ export function WebRTCFileReceive({
               </div>
               <div>
                 <h3 className="text-lg font-semibold text-slate-800">文件接收中</h3>
-                <p className="text-sm text-slate-600">取件码: {pickupCode}</p>
+                <p className="text-sm text-slate-600">取件码: {displayPickupCode}</p>
               </div>
             </div>
             
             <div className="flex items-center space-x-4">
               <ConnectionStatus 
-                currentRoom={pickupCode ? { code: pickupCode, role: 'receiver' } : null}
+                currentRoom={displayPickupCode ? { code: displayPickupCode, role: 'receiver' } : null}
               />
               
               <Button
@@ -202,14 +207,14 @@ export function WebRTCFileReceive({
             </div>
             <div>
               <h3 className="text-lg font-semibold text-slate-800">可下载文件</h3>
-              <p className="text-sm text-slate-600">房间代码: {pickupCode}</p>
+              <p className="text-sm text-slate-600">房间代码: {displayPickupCode}</p>
             </div>
           </div>
           
           {/* 连接状态 */}
           <ConnectionStatus 
 
-            currentRoom={{ code: pickupCode, role: 'receiver' }}
+            currentRoom={{ code: displayPickupCode, role: 'receiver' }}
           />
         </div>
         

chuan-next/src/components/webrtc/WebRTCTextReceiver.tsx

@@ -297,12 +297,14 @@ export const WebRTCTextReceiver: React.FC<WebRTCTextReceiverProps> = ({
               )}
             </div>
 
-            <div className="min-h-[200px] bg-slate-50/50 rounded-xl p-4 border border-slate-100">
+            <div className="min-h-[200px] bg-slate-50/50 rounded-xl p-4 border border-slate-100 overflow-hidden">
               {receivedText ? (
-                <div className="space-y-2">
-                  <pre className="whitespace-pre-wrap text-slate-700 text-sm leading-relaxed font-sans">
-                    {receivedText}
-                  </pre>
+                <div className="space-y-2 h-full">
+                  <div className="overflow-auto max-h-[180px]">
+                    <pre className="whitespace-pre-wrap break-words text-slate-700 text-sm leading-relaxed font-sans">
+                      {receivedText}
+                    </pre>
+                  </div>
                   {isTyping && (
                     <div className="flex items-center space-x-2 text-slate-500 text-sm">
                       <div className="flex space-x-1">
@@ -364,4 +366,4 @@ export const WebRTCTextReceiver: React.FC<WebRTCTextReceiverProps> = ({
       )}
     </div>
   );
-};
+};