@friggframework/devtools 2.0.0--canary.517.35ee143.0 → 2.0.0--canary.524.06156322a.0

package/management-ui/src/components/SessionMonitor.jsx

@@ -1,350 +0,0 @@
-import React, { useState, useEffect } from 'react'
-import { Clock, User, Activity, RefreshCw, XCircle } from 'lucide-react'
-import { useFrigg } from '../hooks/useFrigg'
-import { useSocket } from '../hooks/useSocket'
-<<<<<<< HEAD
-<<<<<<< HEAD
-import { cn } from '../lib/utils'
-=======
-<<<<<<< HEAD
-<<<<<<< HEAD
-import { cn } from '../lib/utils'
-=======
-import { cn } from '../utils/cn'
->>>>>>> 652520a5 (Claude Flow RFC related development)
-=======
-import { cn } from '../lib/utils'
->>>>>>> f153939e (refactor: clean up CLI help display and remove unused dependencies)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
-import { cn } from '../lib/utils'
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-
-const SessionMonitor = ({ userId = null }) => {
-  const { users, getAllSessions, getUserSessions, refreshSession, endSession } = useFrigg()
-  const { on } = useSocket()
-  const [sessions, setSessions] = useState([])
-  const [loading, setLoading] = useState(true)
-  const [refreshing, setRefreshing] = useState(false)
-
-  // Fetch sessions
-  const fetchSessions = async () => {
-    try {
-      setLoading(true)
-      if (userId) {
-        const userSessions = await getUserSessions(userId)
-        setSessions(userSessions)
-      } else {
-        const allSessionsData = await getAllSessions()
-        setSessions(allSessionsData.sessions)
-      }
-    } catch (error) {
-      console.error('Error fetching sessions:', error)
-    } finally {
-      setLoading(false)
-    }
-  }
-
-  useEffect(() => {
-    fetchSessions()
-
-    // Listen for session events
-    const unsubscribeCreated = on('session:created', () => {
-      fetchSessions()
-    })
-
-    const unsubscribeEnded = on('session:ended', () => {
-      fetchSessions()
-    })
-
-    const unsubscribeActivity = on('session:activity', (data) => {
-<<<<<<< HEAD
-<<<<<<< HEAD
-      setSessions(prev => prev.map(session => 
-        session.id === data.sessionId 
-=======
-<<<<<<< HEAD
-      setSessions(prev => prev.map(session =>
-        session.id === data.sessionId
-=======
-      setSessions(prev => prev.map(session => 
-        session.id === data.sessionId 
->>>>>>> 652520a5 (Claude Flow RFC related development)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
-      setSessions(prev => prev.map(session => 
-        session.id === data.sessionId 
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-          ? { ...session, lastActivity: data.timestamp }
-          : session
-      ))
-    })
-
-    // Auto-refresh every 30 seconds
-    const interval = setInterval(fetchSessions, 30000)
-
-    return () => {
-      unsubscribeCreated && unsubscribeCreated()
-      unsubscribeEnded && unsubscribeEnded()
-      unsubscribeActivity && unsubscribeActivity()
-      clearInterval(interval)
-    }
-  }, [on, userId])
-
-  const handleRefreshSession = async (sessionId) => {
-    try {
-      setRefreshing(true)
-      await refreshSession(sessionId)
-      await fetchSessions()
-    } catch (error) {
-      console.error('Error refreshing session:', error)
-      alert('Failed to refresh session')
-    } finally {
-      setRefreshing(false)
-    }
-  }
-
-  const handleEndSession = async (sessionId) => {
-    if (window.confirm('Are you sure you want to end this session?')) {
-      try {
-        await endSession(sessionId)
-        await fetchSessions()
-      } catch (error) {
-        console.error('Error ending session:', error)
-        alert('Failed to end session')
-      }
-    }
-  }
-
-  const getUser = (userId) => {
-    return users.find(u => u.id === userId)
-  }
-
-  const formatTimeRemaining = (expiresAt) => {
-    const now = new Date()
-    const expiry = new Date(expiresAt)
-    const diff = expiry - now
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-<<<<<<< HEAD
-
-    if (diff < 0) return 'Expired'
-
-    const minutes = Math.floor(diff / 60000)
-    const hours = Math.floor(minutes / 60)
-
-=======
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-    
-    if (diff < 0) return 'Expired'
-    
-    const minutes = Math.floor(diff / 60000)
-    const hours = Math.floor(minutes / 60)
-    
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
->>>>>>> 652520a5 (Claude Flow RFC related development)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-    if (hours > 0) return `${hours}h ${minutes % 60}m`
-    return `${minutes}m`
-  }
-
-  const getTimeAgo = (timestamp) => {
-    const now = new Date()
-    const time = new Date(timestamp)
-    const diff = now - time
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-<<<<<<< HEAD
-
-    const minutes = Math.floor(diff / 60000)
-    const hours = Math.floor(minutes / 60)
-
-=======
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-    
-    const minutes = Math.floor(diff / 60000)
-    const hours = Math.floor(minutes / 60)
-    
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
->>>>>>> 652520a5 (Claude Flow RFC related development)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-    if (hours > 0) return `${hours}h ago`
-    if (minutes > 0) return `${minutes}m ago`
-    return 'Just now'
-  }
-
-  if (loading) {
-    return (
-      <div className="bg-white rounded-lg shadow p-6">
-        <div className="flex items-center justify-center py-12">
-          <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div>
-        </div>
-      </div>
-    )
-  }
-
-  return (
-    <div className="bg-white rounded-lg shadow p-6">
-      <div className="flex items-center justify-between mb-6">
-        <div>
-          <h3 className="text-lg font-semibold text-gray-900">Active Sessions</h3>
-          <p className="text-sm text-gray-600 mt-1">
-            {userId ? 'User sessions' : 'All active development sessions'}
-          </p>
-        </div>
-        <button
-          onClick={fetchSessions}
-          disabled={refreshing}
-          className={cn(
-            "flex items-center space-x-2 px-3 py-1.5 rounded-md text-sm transition-colors",
-<<<<<<< HEAD
-<<<<<<< HEAD
-            refreshing 
-=======
-<<<<<<< HEAD
-            refreshing
-=======
-            refreshing 
->>>>>>> 652520a5 (Claude Flow RFC related development)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
-            refreshing 
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-              ? "bg-gray-100 text-gray-400 cursor-not-allowed"
-              : "bg-gray-100 text-gray-700 hover:bg-gray-200"
-          )}
-        >
-          <RefreshCw size={14} className={cn(refreshing && "animate-spin")} />
-          <span>Refresh</span>
-        </button>
-      </div>
-
-      {sessions.length === 0 ? (
-        <div className="text-center py-8 text-gray-500">
-          <User size={32} className="mx-auto mb-2 text-gray-400" />
-          <p>No active sessions</p>
-        </div>
-      ) : (
-        <div className="space-y-3">
-          {sessions.map(session => {
-            const user = getUser(session.userId)
-            const isExpiring = new Date(session.expiresAt) - new Date() < 600000 // Less than 10 minutes
-
-            return (
-              <div
-                key={session.id}
-                className="border border-gray-200 rounded-lg p-4 hover:border-gray-300 transition-colors"
-              >
-                <div className="flex items-start justify-between">
-                  <div className="flex-1">
-                    <div className="flex items-center space-x-3">
-                      <div className="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center">
-                        <User size={16} className="text-blue-600" />
-                      </div>
-                      <div>
-                        <p className="text-sm font-medium text-gray-900">
-                          {user ? `${user.firstName} ${user.lastName}` : 'Unknown User'}
-                        </p>
-                        <p className="text-xs text-gray-500">
-                          {user?.email || session.userId}
-                        </p>
-                      </div>
-                    </div>
-
-                    <div className="mt-3 grid grid-cols-3 gap-4 text-xs">
-                      <div className="flex items-center space-x-1 text-gray-600">
-                        <Clock size={12} />
-                        <span>Created {getTimeAgo(session.createdAt)}</span>
-                      </div>
-                      <div className="flex items-center space-x-1 text-gray-600">
-                        <Activity size={12} />
-                        <span>Active {getTimeAgo(session.lastActivity)}</span>
-                      </div>
-                      <div className={cn(
-                        "flex items-center space-x-1",
-                        isExpiring ? "text-orange-600" : "text-gray-600"
-                      )}>
-                        <Clock size={12} />
-                        <span>Expires in {formatTimeRemaining(session.expiresAt)}</span>
-                      </div>
-                    </div>
-
-                    {session.metadata && Object.keys(session.metadata).length > 0 && (
-                      <div className="mt-2 text-xs text-gray-500">
-                        <span className="font-medium">Metadata:</span> {JSON.stringify(session.metadata)}
-                      </div>
-                    )}
-                  </div>
-
-                  <div className="flex items-center space-x-2 ml-4">
-                    <button
-                      onClick={() => handleRefreshSession(session.id)}
-                      disabled={refreshing}
-                      className="p-1.5 text-gray-400 hover:text-blue-600 hover:bg-blue-50 rounded transition-colors"
-                      title="Refresh session"
-                    >
-                      <RefreshCw size={16} />
-                    </button>
-                    <button
-                      onClick={() => handleEndSession(session.id)}
-                      className="p-1.5 text-gray-400 hover:text-red-600 hover:bg-red-50 rounded transition-colors"
-                      title="End session"
-                    >
-                      <XCircle size={16} />
-                    </button>
-                  </div>
-                </div>
-
-                <div className="mt-3 flex items-center justify-between text-xs">
-                  <code className="text-gray-500 font-mono">
-                    {session.id}
-                  </code>
-                  <span className={cn(
-                    "px-2 py-0.5 rounded-full font-medium",
-<<<<<<< HEAD
-<<<<<<< HEAD
-                    session.active 
-=======
-<<<<<<< HEAD
-                    session.active
-=======
-                    session.active 
->>>>>>> 652520a5 (Claude Flow RFC related development)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
-                    session.active 
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-                      ? "bg-green-100 text-green-700"
-                      : "bg-gray-100 text-gray-600"
-                  )}>
-                    {session.active ? 'Active' : 'Inactive'}
-                  </span>
-                </div>
-              </div>
-            )
-          })}
-        </div>
-      )}
-
-      <div className="mt-6 text-xs text-gray-500 text-center">
-        Sessions automatically expire after 1 hour of inactivity
-      </div>
-    </div>
-  )
-}
-
-export default SessionMonitor

package/management-ui/src/components/StatusBadge.jsx

@@ -1,208 +0,0 @@
-import React from 'react'
-<<<<<<< HEAD
-<<<<<<< HEAD
-import { Badge } from './ui/badge'
-import { cn } from '../lib/utils'
-import { Loader2, CheckCircle2, XCircle, AlertCircle, Circle } from 'lucide-react'
-=======
-<<<<<<< HEAD
-<<<<<<< HEAD
-import { Badge } from './ui/badge'
-import { cn } from '../lib/utils'
-import { Loader2, CheckCircle2, XCircle, AlertCircle, Circle } from 'lucide-react'
-=======
-import { cn } from '../utils/cn'
->>>>>>> 652520a5 (Claude Flow RFC related development)
-=======
-import { Badge } from './ui/badge'
-import { cn } from '../lib/utils'
-import { Loader2, CheckCircle2, XCircle, AlertCircle, Circle } from 'lucide-react'
->>>>>>> f153939e (refactor: clean up CLI help display and remove unused dependencies)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
-import { Badge } from './ui/badge'
-import { cn } from '../lib/utils'
-import { Loader2, CheckCircle2, XCircle, AlertCircle, Circle } from 'lucide-react'
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-
-const StatusBadge = ({ status, className, showIcon = true, ...props }) => {
-  const getStatusConfig = (status) => {
-    switch (status) {
-      case 'running':
-        return {
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-<<<<<<< HEAD
-<<<<<<< HEAD
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-          icon: CheckCircle2,
-          text: 'Running',
-          variant: 'default',
-          className: 'bg-green-500/10 text-green-700 hover:bg-green-500/20 border-green-200 dark:bg-green-500/20 dark:text-green-400 dark:border-green-800'
-        }
-      case 'stopped':
-        return {
-          icon: XCircle,
-          text: 'Stopped',
-          variant: 'secondary',
-          className: 'bg-red-500/10 text-red-700 hover:bg-red-500/20 border-red-200 dark:bg-red-500/20 dark:text-red-400 dark:border-red-800'
-        }
-      case 'starting':
-        return {
-          icon: Loader2,
-          text: 'Starting...',
-          variant: 'outline',
-          className: 'bg-yellow-500/10 text-yellow-700 hover:bg-yellow-500/20 border-yellow-300 dark:bg-yellow-500/20 dark:text-yellow-400 dark:border-yellow-800',
-          iconClassName: 'animate-spin'
-        }
-      case 'error':
-        return {
-          icon: AlertCircle,
-          text: 'Error',
-          variant: 'destructive',
-          className: ''
-        }
-      default:
-        return {
-          icon: Circle,
-          text: 'Unknown',
-          variant: 'outline',
-          className: ''
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-=======
-          icon: '●',
-=======
-          icon: CheckCircle2,
->>>>>>> f153939e (refactor: clean up CLI help display and remove unused dependencies)
-          text: 'Running',
-          variant: 'default',
-          className: 'bg-green-500/10 text-green-700 hover:bg-green-500/20 border-green-200 dark:bg-green-500/20 dark:text-green-400 dark:border-green-800'
-        }
-      case 'stopped':
-        return {
-          icon: XCircle,
-          text: 'Stopped',
-          variant: 'secondary',
-          className: 'bg-red-500/10 text-red-700 hover:bg-red-500/20 border-red-200 dark:bg-red-500/20 dark:text-red-400 dark:border-red-800'
-        }
-      case 'starting':
-        return {
-          icon: Loader2,
-          text: 'Starting...',
-          variant: 'outline',
-          className: 'bg-yellow-500/10 text-yellow-700 hover:bg-yellow-500/20 border-yellow-300 dark:bg-yellow-500/20 dark:text-yellow-400 dark:border-yellow-800',
-          iconClassName: 'animate-spin'
-        }
-      case 'error':
-        return {
-          icon: AlertCircle,
-          text: 'Error',
-          variant: 'destructive',
-          className: ''
-        }
-      default:
-        return {
-          icon: Circle,
-          text: 'Unknown',
-<<<<<<< HEAD
-          className: 'bg-gray-100 text-gray-800 border-gray-200'
->>>>>>> 652520a5 (Claude Flow RFC related development)
-=======
-          variant: 'outline',
-          className: ''
->>>>>>> f153939e (refactor: clean up CLI help display and remove unused dependencies)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-        }
-    }
-  }
-
-  const config = getStatusConfig(status)
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-<<<<<<< HEAD
-<<<<<<< HEAD
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-  const Icon = config.icon
-
-  return (
-    <Badge
-      variant={config.variant}
-      className={cn(
-        'gap-1.5 px-3 py-1 font-medium industrial-transition sharp-badge',
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-=======
-=======
-  const Icon = config.icon
->>>>>>> f153939e (refactor: clean up CLI help display and remove unused dependencies)
-
-  return (
-    <Badge 
-      variant={config.variant}
-      className={cn(
-<<<<<<< HEAD
-        'inline-flex items-center px-3 py-1 rounded-full text-sm font-medium border',
->>>>>>> 652520a5 (Claude Flow RFC related development)
-=======
-        'gap-1.5 px-3 py-1 font-medium industrial-transition sharp-badge',
->>>>>>> f153939e (refactor: clean up CLI help display and remove unused dependencies)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-        config.className,
-        className
-      )}
-      {...props}
-    >
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-<<<<<<< HEAD
-<<<<<<< HEAD
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-      {showIcon && (
-        <Icon size={14} className={cn('', config.iconClassName)} />
-      )}
-      {config.text}
-    </Badge>
-  )
-}
-
-export { StatusBadge }
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-=======
-      {showIcon && <span className="mr-1">{config.icon}</span>}
-=======
-      {showIcon && (
-        <Icon size={14} className={cn('', config.iconClassName)} />
-      )}
->>>>>>> f153939e (refactor: clean up CLI help display and remove unused dependencies)
-      {config.text}
-    </Badge>
-  )
-}
-
-<<<<<<< HEAD
->>>>>>> 652520a5 (Claude Flow RFC related development)
-=======
-export { StatusBadge }
->>>>>>> f153939e (refactor: clean up CLI help display and remove unused dependencies)
->>>>>>> 860052b4 (feat: integrate complete management-ui and additional features)
-=======
->>>>>>> 7e97f01c (fix: resolve ui-command merge conflicts and update package.json)
-export default StatusBadge