 85bf1341f3
			
		
	
	85bf1341f3
	
	
	
		
			
			Frontend Enhancements: - Complete React TypeScript frontend with modern UI components - Distributed workflows management interface with real-time updates - Socket.IO integration for live agent status monitoring - Agent management dashboard with cluster visualization - Project management interface with metrics and task tracking - Responsive design with proper error handling and loading states Backend Infrastructure: - Distributed coordinator for multi-agent workflow orchestration - Cluster management API with comprehensive agent operations - Enhanced database models for agents and projects - Project service for filesystem-based project discovery - Performance monitoring and metrics collection - Comprehensive API documentation and error handling Documentation: - Complete distributed development guide (README_DISTRIBUTED.md) - Comprehensive development report with architecture insights - System configuration templates and deployment guides The platform now provides a complete web interface for managing the distributed AI cluster with real-time monitoring, workflow orchestration, and agent coordination capabilities. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
		
			
				
	
	
		
			42 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
			
		
		
	
	
			42 lines
		
	
	
		
			1.6 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
| import { useRef, useEffect } from 'react';
 | |
| import { useInstantLayoutTransition } from '../projection/use-instant-layout-transition.mjs';
 | |
| import { useForceUpdate } from './use-force-update.mjs';
 | |
| import { instantAnimationState } from './use-instant-transition-state.mjs';
 | |
| import { frame } from '../frameloop/frame.mjs';
 | |
| 
 | |
| function useInstantTransition() {
 | |
|     const [forceUpdate, forcedRenderCount] = useForceUpdate();
 | |
|     const startInstantLayoutTransition = useInstantLayoutTransition();
 | |
|     const unlockOnFrameRef = useRef();
 | |
|     useEffect(() => {
 | |
|         /**
 | |
|          * Unblock after two animation frames, otherwise this will unblock too soon.
 | |
|          */
 | |
|         frame.postRender(() => frame.postRender(() => {
 | |
|             /**
 | |
|              * If the callback has been called again after the effect
 | |
|              * triggered this 2 frame delay, don't unblock animations. This
 | |
|              * prevents the previous effect from unblocking the current
 | |
|              * instant transition too soon. This becomes more likely when
 | |
|              * used in conjunction with React.startTransition().
 | |
|              */
 | |
|             if (forcedRenderCount !== unlockOnFrameRef.current)
 | |
|                 return;
 | |
|             instantAnimationState.current = false;
 | |
|         }));
 | |
|     }, [forcedRenderCount]);
 | |
|     return (callback) => {
 | |
|         startInstantLayoutTransition(() => {
 | |
|             instantAnimationState.current = true;
 | |
|             forceUpdate();
 | |
|             callback();
 | |
|             unlockOnFrameRef.current = forcedRenderCount + 1;
 | |
|         });
 | |
|     };
 | |
| }
 | |
| function disableInstantTransitions() {
 | |
|     instantAnimationState.current = false;
 | |
| }
 | |
| 
 | |
| export { disableInstantTransitions, useInstantTransition };
 |