+
= ({
className={`
flex items-center gap-2 rounded-t-md transition-all w-full shrink-0
${onClose && !isPending ? "pl-3 pr-6" : "px-3"}
- ${isSelected
- ? "text-white border-t border-x border-r h-[33px] bg-stone-950"
- : "text-neutral-400 hover:text-neutral-200 hover:bg-neutral-800/50 border-transparent h-8"
+ ${
+ isSelected
+ ? "text-white border-t border-x border-r h-[33px] bg-stone-950"
+ : "text-neutral-400 hover:text-neutral-200 hover:bg-neutral-800/50 border-transparent h-8"
}
${isPending ? "opacity-70 cursor-wait" : ""}
`}
@@ -58,7 +59,9 @@ export const WorktreeTabButton: React.FC = ({
task &&
)}
- {hasTask && task ? `${task.title} (${worktree.branch})` : worktree.branch}
+ {hasTask && task
+ ? `${task.title} (${worktree.branch})`
+ : worktree.branch}
{onClose && !isPending && (
@@ -74,9 +77,10 @@ export const WorktreeTabButton: React.FC = ({
w-4 h-4 rounded
transition-opacity cursor-pointer
hover:bg-neutral-700
- ${isSelected
- ? "opacity-100 text-neutral-300"
- : "opacity-0 group-hover:opacity-100 text-neutral-400 hover:text-neutral-200"
+ ${
+ isSelected
+ ? "opacity-100 text-neutral-300"
+ : "opacity-0 group-hover:opacity-100 text-neutral-400 hover:text-neutral-200"
}
`}
aria-label="Close tab"
diff --git a/apps/desktop/src/renderer/screens/main/components/MainContent/TabContent.tsx b/apps/desktop/src/renderer/screens/main/components/MainContent/TabContent.tsx
index 576fb053042..67e94fee28d 100644
--- a/apps/desktop/src/renderer/screens/main/components/MainContent/TabContent.tsx
+++ b/apps/desktop/src/renderer/screens/main/components/MainContent/TabContent.tsx
@@ -28,16 +28,17 @@ export default function TabContent({
}: TabContentProps) {
const { currentWorkspace } = useWorkspaceContext();
const { selectedWorktreeId, selectedTabId, handleTabFocus } = useTabContext();
-
+
const selectedWorktree = currentWorkspace?.worktrees?.find(
(wt) => wt.id === selectedWorktreeId,
);
-
- const workingDirectory = selectedWorktree?.path || currentWorkspace?.repoPath || "";
+
+ const workingDirectory =
+ selectedWorktree?.path || currentWorkspace?.repoPath || "";
const workspaceId = currentWorkspace?.id || "";
const worktreeId = selectedWorktreeId ?? undefined;
const worktree = selectedWorktree;
-
+
const handleFocus = () => {
handleTabFocus(tab.id);
};
diff --git a/apps/desktop/src/renderer/screens/main/components/MainContent/TabGroup.tsx b/apps/desktop/src/renderer/screens/main/components/MainContent/TabGroup.tsx
index 2f957334628..d94a7242711 100644
--- a/apps/desktop/src/renderer/screens/main/components/MainContent/TabGroup.tsx
+++ b/apps/desktop/src/renderer/screens/main/components/MainContent/TabGroup.tsx
@@ -9,6 +9,7 @@ import "react-mosaic-component/react-mosaic-component.css";
import type { Tab } from "shared/types";
import { useWorkspaceContext, useTabContext } from "../../../../contexts";
import TabContent from "./TabContent";
+import { dragDropManager } from "renderer/lib/dnd";
interface ScreenLayoutProps {
groupTab: Tab; // A tab with type: "group"
@@ -17,12 +18,13 @@ interface ScreenLayoutProps {
export default function TabGroup({ groupTab }: ScreenLayoutProps) {
const { currentWorkspace } = useWorkspaceContext();
const { selectedWorktreeId, selectedTabId, handleTabFocus } = useTabContext();
-
+
const selectedWorktree = currentWorkspace?.worktrees?.find(
(wt) => wt.id === selectedWorktreeId,
);
-
- const workingDirectory = selectedWorktree?.path || currentWorkspace?.repoPath || "";
+
+ const workingDirectory =
+ selectedWorktree?.path || currentWorkspace?.repoPath || "";
const workspaceId = currentWorkspace?.id || "";
const worktreeId = selectedWorktreeId ?? undefined;
// Initialize mosaic tree from groupTab or create a default tree
@@ -243,6 +245,7 @@ export default function TabGroup({ groupTab }: ScreenLayoutProps) {
value={mosaicTree}
onChange={handleMosaicChange}
className="mosaic-theme-dark"
+ dragAndDropManager={dragDropManager}
/>