Skip to content

Commit 680ec45

Browse files
123vivekr123vivekr
committed
Remove Running Sessions components from CC Agents
 - Deleted RunningSessionsView.tsx file - Removed import and usage in CCAgents.tsx - Removed 'Running Sessions' tab from navigation - Removed activeTab state management - Simplified UI to show only agents list
1 parent 7a2372d commit 680ec45

3 files changed

Lines changed: 143 additions & 475 deletions

File tree

‎src/components/CCAgents.tsx‎

Lines changed: 141 additions & 192 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,6 @@ import { Toast, ToastContainer } from "@/components/ui/toast";
3838
import { CreateAgent } from "./CreateAgent";
3939
import { AgentExecution } from "./AgentExecution";
4040
import { AgentRunsList } from "./AgentRunsList";
41-
import { RunningSessionsView } from "./RunningSessionsView";
4241
import { GitHubAgentBrowser } from "./GitHubAgentBrowser";
4342
import { ICON_MAP } from "./IconPicker";
4443

@@ -73,7 +72,6 @@ export const CCAgents: React.FC<CCAgentsProps> = ({ onBack, className }) => {
7372
const [toast, setToast] = useState<{ message: string; type: "success" | "error" } | null>(null);
7473
const [currentPage, setCurrentPage] = useState(1);
7574
const [view, setView] = useState<"list" | "create" | "edit" | "execute">("list");
76-
const [activeTab, setActiveTab] = useState<"agents" | "running">("agents");
7775
const [selectedAgent, setSelectedAgent] = useState<Agent | null>(null);
7876
// const [selectedRunId, setSelectedRunId] = useState<number | null>(null);
7977
const [showGitHubBrowser, setShowGitHubBrowser] = useState(false);
@@ -363,203 +361,154 @@ export const CCAgents: React.FC<CCAgentsProps> = ({ onBack, className }) => {
363361
</motion.div>
364362
)}
365363

366-
{/* Tab Navigation */}
367-
<div className="border-b border-border">
368-
<nav className="flex space-x-8">
369-
<button
370-
onClick={() => setActiveTab("agents")}
371-
className={cn(
372-
"py-2 px-1 border-b-2 font-medium text-sm transition-colors",
373-
activeTab === "agents"
374-
? "border-primary text-primary"
375-
: "border-transparent text-muted-foreground hover:text-foreground hover:border-muted-foreground"
376-
)}
377-
>
378-
<div className="flex items-center gap-2">
379-
<Bot className="h-4 w-4" />
380-
Agents
381-
</div>
382-
</button>
383-
<button
384-
onClick={() => setActiveTab("running")}
385-
className={cn(
386-
"py-2 px-1 border-b-2 font-medium text-sm transition-colors",
387-
activeTab === "running"
388-
? "border-primary text-primary"
389-
: "border-transparent text-muted-foreground hover:text-foreground hover:border-muted-foreground"
390-
)}
391-
>
392-
<div className="flex items-center gap-2">
393-
<Play className="h-4 w-4" />
394-
Running Sessions
395-
</div>
396-
</button>
397-
</nav>
398-
</div>
399-
400-
{/* Tab Content */}
364+
{/* Main Content */}
401365
<div className="flex-1 overflow-y-auto">
402366
<AnimatePresence mode="wait">
403-
{activeTab === "agents" && (
404-
<motion.div
405-
key="agents"
406-
initial={{ opacity: 0, y: 20 }}
407-
animate={{ opacity: 1, y: 0 }}
408-
exit={{ opacity: 0, y: -20 }}
409-
transition={{ duration: 0.2 }}
410-
className="pt-6 space-y-8"
411-
>
412-
{/* Agents Grid */}
413-
<div>
414-
{loading ? (
415-
<div className="flex items-center justify-center h-64">
416-
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-primary"></div>
417-
</div>
418-
) : agents.length === 0 ? (
419-
<div className="flex flex-col items-center justify-center h-64 text-center">
420-
<Bot className="h-16 w-16 text-muted-foreground mb-4" />
421-
<h3 className="text-lg font-medium mb-2">No agents yet</h3>
422-
<p className="text-sm text-muted-foreground mb-4">
423-
Create your first CC Agent to get started
424-
</p>
425-
<Button onClick={() => setView("create")} size="default">
426-
<Plus className="h-4 w-4 mr-2" />
427-
Create CC Agent
428-
</Button>
429-
</div>
430-
) : (
431-
<>
432-
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
433-
<AnimatePresence mode="popLayout">
434-
{paginatedAgents.map((agent, index) => (
435-
<motion.div
436-
key={agent.id}
437-
initial={{ opacity: 0, scale: 0.9 }}
438-
animate={{ opacity: 1, scale: 1 }}
439-
exit={{ opacity: 0, scale: 0.9 }}
440-
transition={{ duration: 0.2, delay: index * 0.05 }}
441-
>
442-
<Card className="h-full hover:shadow-lg transition-shadow">
443-
<CardContent className="p-6 flex flex-col items-center text-center">
444-
<div className="mb-4 p-4 rounded-full bg-primary/10 text-primary">
445-
{renderIcon(agent.icon)}
446-
</div>
447-
<h3 className="text-lg font-semibold mb-2">
448-
{agent.name}
449-
</h3>
450-
<p className="text-xs text-muted-foreground">
451-
Created: {new Date(agent.created_at).toLocaleDateString()}
452-
</p>
453-
</CardContent>
454-
<CardFooter className="p-4 pt-0 flex justify-center gap-1 flex-wrap">
455-
<Button
456-
size="sm"
457-
variant="ghost"
458-
onClick={() => handleExecuteAgent(agent)}
459-
className="flex items-center gap-1"
460-
title="Execute agent"
461-
>
462-
<Play className="h-3 w-3" />
463-
Execute
464-
</Button>
465-
<Button
466-
size="sm"
467-
variant="ghost"
468-
onClick={() => handleEditAgent(agent)}
469-
className="flex items-center gap-1"
470-
title="Edit agent"
471-
>
472-
<Edit className="h-3 w-3" />
473-
Edit
474-
</Button>
475-
<Button
476-
size="sm"
477-
variant="ghost"
478-
onClick={() => handleExportAgent(agent)}
479-
className="flex items-center gap-1"
480-
title="Export agent to .claudia.json"
481-
>
482-
<Upload className="h-3 w-3" />
483-
Export
484-
</Button>
485-
<Button
486-
size="sm"
487-
variant="ghost"
488-
onClick={() => handleDeleteAgent(agent)}
489-
className="flex items-center gap-1 text-destructive hover:text-destructive"
490-
title="Delete agent"
491-
>
492-
<Trash2 className="h-3 w-3" />
493-
Delete
494-
</Button>
495-
</CardFooter>
496-
</Card>
497-
</motion.div>
498-
))}
499-
</AnimatePresence>
500-
</div>
501-
502-
{/* Pagination */}
503-
{totalPages > 1 && (
504-
<div className="mt-6 flex justify-center gap-2">
505-
<Button
506-
size="sm"
507-
variant="outline"
508-
onClick={() => setCurrentPage(p => Math.max(1, p - 1))}
509-
disabled={currentPage === 1}
510-
>
511-
Previous
512-
</Button>
513-
<span className="flex items-center px-3 text-sm">
514-
Page {currentPage} of {totalPages}
515-
</span>
516-
<Button
517-
size="sm"
518-
variant="outline"
519-
onClick={() => setCurrentPage(p => Math.min(totalPages, p + 1))}
520-
disabled={currentPage === totalPages}
367+
<motion.div
368+
key="agents"
369+
initial={{ opacity: 0, y: 20 }}
370+
animate={{ opacity: 1, y: 0 }}
371+
exit={{ opacity: 0, y: -20 }}
372+
transition={{ duration: 0.2 }}
373+
className="pt-6 space-y-8"
374+
>
375+
{/* Agents Grid */}
376+
<div>
377+
{loading ? (
378+
<div className="flex items-center justify-center h-64">
379+
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-primary"></div>
380+
</div>
381+
) : agents.length === 0 ? (
382+
<div className="flex flex-col items-center justify-center h-64 text-center">
383+
<Bot className="h-16 w-16 text-muted-foreground mb-4" />
384+
<h3 className="text-lg font-medium mb-2">No agents yet</h3>
385+
<p className="text-sm text-muted-foreground mb-4">
386+
Create your first CC Agent to get started
387+
</p>
388+
<Button onClick={() => setView("create")} size="default">
389+
<Plus className="h-4 w-4 mr-2" />
390+
Create CC Agent
391+
</Button>
392+
</div>
393+
) : (
394+
<>
395+
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
396+
<AnimatePresence mode="popLayout">
397+
{paginatedAgents.map((agent, index) => (
398+
<motion.div
399+
key={agent.id}
400+
initial={{ opacity: 0, scale: 0.9 }}
401+
animate={{ opacity: 1, scale: 1 }}
402+
exit={{ opacity: 0, scale: 0.9 }}
403+
transition={{ duration: 0.2, delay: index * 0.05 }}
521404
>
522-
Next
523-
</Button>
524-
</div>
525-
)}
526-
</>
527-
)}
528-
</div>
529-
530-
{/* Execution History */}
531-
{!loading && agents.length > 0 && (
532-
<div className="overflow-hidden">
533-
<div className="flex items-center gap-2 mb-4">
534-
<History className="h-5 w-5 text-muted-foreground" />
535-
<h2 className="text-lg font-semibold">Recent Executions</h2>
405+
<Card className="h-full hover:shadow-lg transition-shadow">
406+
<CardContent className="p-6 flex flex-col items-center text-center">
407+
<div className="mb-4 p-4 rounded-full bg-primary/10 text-primary">
408+
{renderIcon(agent.icon)}
409+
</div>
410+
<h3 className="text-lg font-semibold mb-2">
411+
{agent.name}
412+
</h3>
413+
<p className="text-xs text-muted-foreground">
414+
Created: {new Date(agent.created_at).toLocaleDateString()}
415+
</p>
416+
</CardContent>
417+
<CardFooter className="p-4 pt-0 flex justify-center gap-1 flex-wrap">
418+
<Button
419+
size="sm"
420+
variant="ghost"
421+
onClick={() => handleExecuteAgent(agent)}
422+
className="flex items-center gap-1"
423+
title="Execute agent"
424+
>
425+
<Play className="h-3 w-3" />
426+
Execute
427+
</Button>
428+
<Button
429+
size="sm"
430+
variant="ghost"
431+
onClick={() => handleEditAgent(agent)}
432+
className="flex items-center gap-1"
433+
title="Edit agent"
434+
>
435+
<Edit className="h-3 w-3" />
436+
Edit
437+
</Button>
438+
<Button
439+
size="sm"
440+
variant="ghost"
441+
onClick={() => handleExportAgent(agent)}
442+
className="flex items-center gap-1"
443+
title="Export agent to .claudia.json"
444+
>
445+
<Upload className="h-3 w-3" />
446+
Export
447+
</Button>
448+
<Button
449+
size="sm"
450+
variant="ghost"
451+
onClick={() => handleDeleteAgent(agent)}
452+
className="flex items-center gap-1 text-destructive hover:text-destructive"
453+
title="Delete agent"
454+
>
455+
<Trash2 className="h-3 w-3" />
456+
Delete
457+
</Button>
458+
</CardFooter>
459+
</Card>
460+
</motion.div>
461+
))}
462+
</AnimatePresence>
536463
</div>
537-
{runsLoading ? (
538-
<div className="flex items-center justify-center h-32">
539-
<div className="animate-spin rounded-full h-6 w-6 border-b-2 border-primary"></div>
464+
465+
{/* Pagination */}
466+
{totalPages > 1 && (
467+
<div className="mt-6 flex justify-center gap-2">
468+
<Button
469+
size="sm"
470+
variant="outline"
471+
onClick={() => setCurrentPage(p => Math.max(1, p - 1))}
472+
disabled={currentPage === 1}
473+
>
474+
Previous
475+
</Button>
476+
<span className="flex items-center px-3 text-sm">
477+
Page {currentPage} of {totalPages}
478+
</span>
479+
<Button
480+
size="sm"
481+
variant="outline"
482+
onClick={() => setCurrentPage(p => Math.min(totalPages, p + 1))}
483+
disabled={currentPage === totalPages}
484+
>
485+
Next
486+
</Button>
540487
</div>
541-
) : (
542-
<AgentRunsList
543-
runs={runs}
544-
/>
545488
)}
546-
</div>
489+
</>
547490
)}
548-
</motion.div>
549-
)}
550-
551-
{activeTab === "running" && (
552-
<motion.div
553-
key="running"
554-
initial={{ opacity: 0, y: 20 }}
555-
animate={{ opacity: 1, y: 0 }}
556-
exit={{ opacity: 0, y: -20 }}
557-
transition={{ duration: 0.2 }}
558-
className="pt-6"
559-
>
560-
<RunningSessionsView />
561-
</motion.div>
562-
)}
491+
</div>
492+
493+
{/* Execution History */}
494+
{!loading && agents.length > 0 && (
495+
<div className="overflow-hidden">
496+
<div className="flex items-center gap-2 mb-4">
497+
<History className="h-5 w-5 text-muted-foreground" />
498+
<h2 className="text-lg font-semibold">Recent Executions</h2>
499+
</div>
500+
{runsLoading ? (
501+
<div className="flex items-center justify-center h-32">
502+
<div className="animate-spin rounded-full h-6 w-6 border-b-2 border-primary"></div>
503+
</div>
504+
) : (
505+
<AgentRunsList
506+
runs={runs}
507+
/>
508+
)}
509+
</div>
510+
)}
511+
</motion.div>
563512
</AnimatePresence>
564513
</div>
565514
</div>

0 commit comments

Comments
 (0)