Workspaces in Workspaces all around

This commit is contained in:
2026-02-19 01:49:15 +00:00
parent 72bca6cd42
commit dd8ab84df5
84 changed files with 3047 additions and 749 deletions
@@ -1,79 +1 @@
import { useState } from 'react';
import { useParams } from 'react-router';
import { useQueryClient } from '@tanstack/react-query';
import type { SessionEntry } from 'apps/Chat';
import { useClaude } from './useClaude';
import { useOpenCode } from './useOpenCode';
import { ChatPanel } from './ChatPanel';
import { useVisibleClaudeModels, useVisibleOpenCodeModels } from '@/state/useModels';
export const ClaudeChat = () => {
const { sessionId } = useParams<{ sessionId: string }>();
const queryClient = useQueryClient();
const sessions = queryClient.getQueryData<SessionEntry[]>(['SESSIONS']);
const sessionModel = sessions?.find((s) => s.id === sessionId)?.model;
const claude = useClaude(sessionId, sessionModel);
const claudeModels = useVisibleClaudeModels();
return (
<div className="flex items-center justify-center h-full md:p-4">
<div className="flex flex-col w-full h-full md:w-3/4 md:h-3/4 lg:w-1/2 lg:h-1/2">
<ChatPanel chat={claude} provider="claude" availableModels={claudeModels} />
</div>
</div>
);
};
export const OpenCodeChat = () => {
const { sessionId } = useParams<{ sessionId: string }>();
const queryClient = useQueryClient();
const sessions = queryClient.getQueryData<SessionEntry[]>(['OC_SESSIONS']);
const sessionModel = sessions?.find((s) => s.id === sessionId)?.model;
const opencode = useOpenCode(sessionId, sessionModel);
const openCodeModels = useVisibleOpenCodeModels();
return (
<div className="flex items-center justify-center h-full md:p-4">
<div className="flex flex-col w-full h-full md:w-3/4 md:h-3/4 lg:w-1/2 lg:h-1/2">
<ChatPanel chat={opencode} provider="opencode" availableModels={openCodeModels} />
</div>
</div>
);
};
const ClaudeNewChatInner = ({ onProviderChange }: { onProviderChange: (p: 'claude' | 'opencode') => void }) => {
const claude = useClaude();
const claudeModels = useVisibleClaudeModels();
return (
<ChatPanel chat={claude} provider="claude" availableModels={claudeModels} onProviderChange={onProviderChange} />
);
};
const OpenCodeNewChatInner = ({ onProviderChange }: { onProviderChange: (p: 'claude' | 'opencode') => void }) => {
const opencode = useOpenCode();
const openCodeModels = useVisibleOpenCodeModels();
return (
<ChatPanel
chat={opencode}
provider="opencode"
availableModels={openCodeModels}
onProviderChange={onProviderChange}
/>
);
};
export const NewChat = () => {
const [provider, setProvider] = useState<'claude' | 'opencode'>('claude');
return (
<div className="flex items-center justify-center h-full md:p-4">
<div className="flex flex-col w-full h-full md:w-3/4 md:h-3/4 lg:w-1/2 lg:h-1/2">
{provider === 'claude' ? (
<ClaudeNewChatInner key="claude" onProviderChange={setProvider} />
) : (
<OpenCodeNewChatInner key="opencode" onProviderChange={setProvider} />
)}
</div>
</div>
);
};
export {};