npm - @openhands/agent-canvas - Versions diffs - 1.14.0 → 1.15.0 - Mend

@openhands/agent-canvas 1.14.0 → 1.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1590) hide show

package/dist/components/features/conversation/conversation-overview-automations-panel.js ADDED Viewed

@@ -0,0 +1,48 @@
+import { useTranslation as e } from "../../../node_modules/react-i18next/dist/es/useTranslation.js";
+import { I18nKey as t } from "../../../i18n/declaration.js";
+import { AutomationCardSkeleton as n } from "../automations/automation-card-skeleton.js";
+import { useAutomations as r } from "../../../hooks/query/use-automations.js";
+import { AutomationGroup as i } from "../automations/automation-group.js";
+import { AddAutomationModal as a } from "../automations/add-automation-modal.js";
+import { BackendUnavailable as o } from "../automations/backend-not-configured.js";
+import { EmptyState as s } from "../automations/empty-state.js";
+import { ErrorState as c } from "../automations/error-state.js";
+import { useAutomationHealth as l } from "../../../hooks/query/use-automation-health.js";
+import { useEffect as u, useState as d } from "react";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/features/conversation/conversation-overview-automations-panel.tsx
+var h = () => void 0;
+function g({ openAdd: g }) {
+	let { t: _ } = e("openhands"), [v, y] = d(g), { data: b, isLoading: x, refetch: S } = l(), { data: C, isLoading: w, isError: T, refetch: E } = r({
+		limit: 50,
+		offset: 0,
+		enabled: b?.status === "ok"
+	});
+	u(() => {
+		g && y(!0);
+	}, [g]);
+	let D;
+	return D = x || b?.status === "ok" && w ? /* @__PURE__ */ p(n, {}) : b?.status === "ok" ? T ? /* @__PURE__ */ p(c, { onRetry: E }) : C?.automations.length ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(i, {
+		title: _(t.CONVERSATION_PANEL$AUTOMATIONS),
+		count: C.automations.length,
+		automations: C.automations,
+		view: "list",
+		onToggle: h,
+		onRunNow: h,
+		onDelete: h,
+		onExport: h
+	}), /* @__PURE__ */ p(a, {
+		isOpen: v,
+		onClose: () => y(!1)
+	})] }) : /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(s, {}), /* @__PURE__ */ p(a, {
+		isOpen: v,
+		onClose: () => y(!1)
+	})] }) : /* @__PURE__ */ p(o, { onRetry: S }), /* @__PURE__ */ p("div", {
+		"data-testid": "conversation-overview-automations-panel",
+		children: D
+	});
+}
+//#endregion
+export { g as ConversationOverviewAutomationsPanel };
+//# sourceMappingURL=conversation-overview-automations-panel.js.map

package/dist/components/features/conversation/conversation-overview-automations-panel.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"conversation-overview-automations-panel.js","names":[],"sources":["../../../../src/components/features/conversation/conversation-overview-automations-panel.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport { AutomationCardSkeleton } from \"#/components/features/automations/automation-card-skeleton\";\nimport { AutomationGroup } from \"#/components/features/automations/automation-group\";\nimport { AddAutomationModal } from \"#/components/features/automations/add-automation-modal\";\nimport { BackendNotConfigured } from \"#/components/features/automations/backend-not-configured\";\nimport { EmptyState } from \"#/components/features/automations/empty-state\";\nimport { ErrorState } from \"#/components/features/automations/error-state\";\nimport { useAutomations } from \"#/hooks/query/use-automations\";\nimport { useAutomationHealth } from \"#/hooks/query/use-automation-health\";\nimport { I18nKey } from \"#/i18n/declaration\";\n\ninterface ConversationOverviewAutomationsPanelProps {\n openAdd: boolean;\n}\n\nconst NOOP = () => undefined;\n\n/** Reuses the existing Automations list and creation guidance in the drawer. */\nexport function ConversationOverviewAutomationsPanel({\n openAdd,\n}: ConversationOverviewAutomationsPanelProps) {\n const { t } = useTranslation(\"openhands\");\n const [isAddModalOpen, setIsAddModalOpen] = useState(openAdd);\n const {\n data: health,\n isLoading: isHealthLoading,\n refetch: refetchHealth,\n } = useAutomationHealth();\n const { data, isLoading, isError, refetch } = useAutomations({\n limit: 50,\n offset: 0,\n enabled: health?.status === \"ok\",\n });\n\n useEffect(() => {\n if (openAdd) setIsAddModalOpen(true);\n }, [openAdd]);\n\n // Every state renders inside the same panel container so the drawer's\n // DOM contract (one `conversation-overview-automations-panel` node) holds\n // regardless of backend health or list contents.\n let body;\n if (isHealthLoading || (health?.status === \"ok\" && isLoading)) {\n body = <AutomationCardSkeleton />;\n } else if (health?.status !== \"ok\") {\n body = <BackendNotConfigured onRetry={refetchHealth} />;\n } else if (isError) {\n body = <ErrorState onRetry={refetch} />;\n } else if (!data?.automations.length) {\n body = (\n <>\n <EmptyState />\n <AddAutomationModal\n isOpen={isAddModalOpen}\n onClose={() => setIsAddModalOpen(false)}\n />\n </>\n );\n } else {\n body = (\n <>\n <AutomationGroup\n title={t(I18nKey.CONVERSATION_PANEL$AUTOMATIONS)}\n count={data.automations.length}\n automations={data.automations}\n view=\"list\"\n onToggle={NOOP}\n onRunNow={NOOP}\n onDelete={NOOP}\n onExport={NOOP}\n />\n <AddAutomationModal\n isOpen={isAddModalOpen}\n onClose={() => setIsAddModalOpen(false)}\n />\n </>\n );\n }\n\n return (\n <div data-testid=\"conversation-overview-automations-panel\">{body}</div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;AAgBA,IAAM,UAAa,KAAA;AAGnB,SAAgB,EAAqC,EACnD,cAC4C;CAC5C,IAAM,EAAE,SAAM,EAAe,WAAW,GAClC,CAAC,GAAgB,KAAqB,EAAS,CAAO,GACtD,EACJ,MAAM,GACN,WAAW,GACX,SAAS,MACP,EAAoB,GAClB,EAAE,SAAM,cAAW,YAAS,eAAY,EAAe;EAC3D,OAAO;EACP,QAAQ;EACR,SAAS,GAAQ,WAAW;CAC9B,CAAC;CAED,QAAgB;EACd,AAAI,KAAS,EAAkB,EAAI;CACrC,GAAG,CAAC,CAAO,CAAC;CAKZ,IAAI;CAsCJ,OArCA,AAGE,IAHE,KAAoB,GAAQ,WAAW,QAAQ,IAC1C,kBAAC,GAAD,CAAyB,CAAA,IACvB,GAAQ,WAAW,OAEnB,IACF,kBAAC,GAAD,EAAY,SAAS,EAAU,CAAA,IAC5B,GAAM,YAAY,SAY1B,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,OAAO,EAAE,EAAQ,8BAA8B;EAC/C,OAAO,EAAK,YAAY;EACxB,aAAa,EAAK;EAClB,MAAK;EACL,UAAU;EACV,UAAU;EACV,UAAU;EACV,UAAU;CACX,CAAA,GACD,kBAAC,GAAD;EACE,QAAQ;EACR,eAAe,EAAkB,EAAK;CACvC,CAAA,CACD,EAAA,CAAA,IAzBF,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD,CAAa,CAAA,GACb,kBAAC,GAAD;EACE,QAAQ;EACR,eAAe,EAAkB,EAAK;CACvC,CAAA,CACD,EAAA,CAAA,IAXG,kBAAC,GAAD,EAAsB,SAAS,EAAgB,CAAA,GAmCtD,kBAAC,OAAD;EAAK,eAAY;YAA2C;CAAU,CAAA;AAE1E"}

package/dist/components/features/conversation/conversation-overview-context-menu.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/react-i18next/dist/es/useTranslation.cjs"),n=require("../../../i18n/declaration.cjs"),r=require("../../../node_modules/lucide-react/dist/esm/icons/folder-git-2.cjs"),i=require("../../../node_modules/lucide-react/dist/esm/icons/git-branch.cjs"),a=require("../../../node_modules/lucide-react/dist/esm/icons/git-commit-horizontal.cjs"),o=require("../../../node_modules/lucide-react/dist/esm/icons/laptop.cjs"),s=require("../../../utils/utils.cjs"),c=require("../../../hooks/use-conversation-id.cjs"),l=require("./conversation-overview-sections.cjs"),u=require("../../../utils/conversation-local-storage.cjs"),d=require("../../../utils/dropdown-classes.cjs"),f=require("../../../ui/context-menu.cjs"),p=require("../../../hooks/use-click-outside-element.cjs"),m=require("../../../ui/divider.cjs"),h=require("../../../hooks/use-select-conversation-tab.cjs"),g=require("../../../icons/u-pr.cjs"),_=require("../../../node_modules/react-icons/lu/index.cjs"),v=require("./conversation-overview-drawer-context.cjs"),y=require("../../../icons/pill.cjs"),b=require("../../../icons/pill-fill.cjs"),x=require("./conversation-overview-drawer.types.cjs");let S=require("react");S=e.__toESM(S,1);let C=require("react/jsx-runtime"),w=require("react-dom");w=e.__toESM(w,1);var T={[l.CONVERSATION_OVERVIEW_SECTION.workspace]:{section:l.CONVERSATION_OVERVIEW_SECTION.workspace,icon:o.Laptop,i18nKey:n.I18nKey.CONVERSATION$OVERVIEW_WORKSPACE}},E=[{part:l.CONVERSATION_OVERVIEW_GIT_PART.changes,icon:_.LuFileDiff,i18nKey:n.I18nKey.COMMON$CHANGES,opensChanges:!0},{part:l.CONVERSATION_OVERVIEW_GIT_PART.repository,icon:r.FolderGit2,i18nKey:n.I18nKey.CONVERSATION$REPOSITORY},{part:l.CONVERSATION_OVERVIEW_GIT_PART.branch,icon:i.GitBranch,i18nKey:n.I18nKey.CONVERSATION$BRANCH},{part:l.CONVERSATION_OVERVIEW_GIT_PART.commits,icon:a.GitCommitHorizontal,i18nKey:n.I18nKey.DIFF_VIEWER$COMMITS,opensCommits:!0},{part:l.CONVERSATION_OVERVIEW_GIT_PART.pull_requests,icon:g.default,i18nKey:n.I18nKey.CONVERSATION$OVERVIEW_PULL_REQUESTS,drawerSection:x.CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests}];function D({testId:e,pinned:t,pinnedLabel:n,unpinnedLabel:r,onClick:i}){return(0,C.jsx)(`button`,{type:`button`,"data-testid":e,className:s.cn(`flex shrink-0 cursor-pointer items-center justify-center rounded-r px-2 text-white`,d.dropdownInstantColorClassName,`hover:bg-white/10`),"aria-pressed":t,"aria-label":t?n:r,onClick:i,children:(0,C.jsx)(`span`,{className:s.cn(`ml-auto overflow-hidden`,d.dropdownMenuRowIconWrapperClassName),"aria-hidden":!0,children:t?(0,C.jsx)(b.default,{className:`size-4`,width:16,height:16}):(0,C.jsx)(y.default,{className:`size-4`,width:16,height:16})})})}function O({isOpen:e,onClose:r,ignoreOutsideClickRef:a,anchorRef:o}){let g=p.useClickOutsideElement(r,a),[_,y]=(0,S.useState)(),{t:b}=t.useTranslation(`openhands`),{conversationId:x}=c.useConversationId(),{state:O,setUnpinnedOverviewSections:k,setUnpinnedOverviewGitParts:A}=u.useConversationLocalStorageState(x),{navigateToChanges:j,navigateToCommits:M}=h.useSelectConversationTab(),N=v.useConversationOverviewDrawerOptional();(0,S.useLayoutEffect)(()=>{if(!e\|\|!o?.current){y(void 0);return}let t=()=>{let e=o.current?.getBoundingClientRect();e&&y({position:`fixed`,zIndex:9999,top:e.bottom+8,right:window.innerWidth-e.right})};return t(),window.addEventListener(`resize`,t),window.addEventListener(`scroll`,t,!0),()=>{window.removeEventListener(`resize`,t),window.removeEventListener(`scroll`,t,!0)}},[e,o]);let P=e=>{if(e.opensChanges){N?.closeDrawer(),j(),r();return}if(e.opensCommits){N?.closeDrawer(),M(),r();return}e.drawerSection&&(N?.openSection(e.drawerSection),r())},F=(e,t)=>{t.preventDefault(),t.stopPropagation();let n=O.unpinnedOverviewSections??[];if(n.includes(e)){k?.(n.filter(t=>t!==e));return}k?.([...n,e])},I=(e,t)=>{t.preventDefault(),t.stopPropagation();let n=O.unpinnedOverviewGitParts??[];if(n.includes(e)){A?.(n.filter(t=>t!==e));return}A?.([...n,e])};if(!e)return null;let L=!!(o?.current&&_),R=l.isOverviewSectionPinned(l.CONVERSATION_OVERVIEW_SECTION.git,O.unpinnedOverviewSections??[]),z=b(n.I18nKey.CONVERSATION$UNPIN_OVERVIEW_SECTION),B=b(n.I18nKey.CONVERSATION$PIN_OVERVIEW_SECTION),V=({key:e,testIdOpen:t,testIdPin:n,icon:r,label:i,pinned:a,isActionable:o,indent:c=!1,onOpen:l,onPinToggle:u})=>{let f=(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(`span`,{className:d.dropdownMenuRowIconWrapperClassName,"aria-hidden":!0,children:(0,C.jsx)(r,{className:`h-4 w-4`})}),(0,C.jsx)(`span`,{className:`text-sm`,children:i})]});return(0,C.jsx)(`li`,{className:`list-none`,children:(0,C.jsxs)(`div`,{className:s.cn(`group flex h-[30px] w-full min-w-0 items-stretch rounded hover:bg-[var(--oh-interactive-hover)]`,c&&`pl-4`),children:[o?(0,C.jsx)(`button`,{type:`button`,"data-testid":t,className:s.cn(`flex min-w-0 flex-1 cursor-pointer items-center gap-2 rounded-l p-2 text-start text-white`,d.dropdownInstantColorClassName),onClick:l,children:f}):(0,C.jsx)(`div`,{"data-testid":t,className:s.cn(`flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white`,d.dropdownInstantColorClassName),children:f}),(0,C.jsx)(D,{testId:n,pinned:a,pinnedLabel:z,unpinnedLabel:B,onClick:u})]})},e)},H=e=>{if(e===l.CONVERSATION_OVERVIEW_SECTION.git)return null;let t=T[e];return V({key:e,testIdOpen:`conversation-overview-menu-open-${e}`,testIdPin:`conversation-overview-menu-pin-${e}`,icon:t.icon,label:b(t.i18nKey),pinned:l.isOverviewSectionPinned(e,O.unpinnedOverviewSections??[]),isActionable:!1,onPinToggle:t=>F(e,t)})},U=(0,C.jsxs)(f.ContextMenu,{ref:g,testId:`conversation-overview-context-menu`,theme:L?`popover`:`default`,position:L?`none`:`bottom`,alignment:L?`none`:`right`,spacing:L?`none`:`default`,className:s.cn(`z-[9999] w-fit`,L?`mt-0`:`mt-2`),children:[l.CONVERSATION_OVERVIEW_SECTION_GROUPS.map((e,t)=>(0,C.jsxs)(S.default.Fragment,{children:[t>0?(0,C.jsx)(m.Divider,{testId:`conversation-overview-menu-divider-${t}`,inset:`menu`}):null,e.sections.map(e=>H(e))]},e.sections.join(`-`))),(0,C.jsx)(m.Divider,{testId:`conversation-overview-menu-divider-git`,inset:`menu`}),V({key:l.CONVERSATION_OVERVIEW_SECTION.git,testIdOpen:`conversation-overview-menu-open-${l.CONVERSATION_OVERVIEW_SECTION.git}`,testIdPin:`conversation-overview-menu-pin-${l.CONVERSATION_OVERVIEW_SECTION.git}`,icon:i.GitBranch,label:b(n.I18nKey.CONVERSATION$OVERVIEW_GIT),pinned:R,isActionable:!1,onPinToggle:e=>F(l.CONVERSATION_OVERVIEW_SECTION.git,e)}),E.map(e=>V({key:e.part,testIdOpen:`conversation-overview-menu-open-git-${e.part}`,testIdPin:`conversation-overview-menu-pin-git-${e.part}`,icon:e.icon,label:b(e.i18nKey),pinned:l.isOverviewGitPartPinned(e.part,O.unpinnedOverviewGitParts??[]),isActionable:!!(e.drawerSection\|\|e.opensCommits\|\|e.opensChanges),indent:!0,onOpen:()=>P(e),onPinToggle:t=>I(e.part,t)}))]});return L&&_&&typeof document<`u`?w.default.createPortal((0,C.jsx)(`div`,{style:_,children:U}),document.body):U}exports.ConversationOverviewContextMenu=O;
2	+ //# sourceMappingURL=conversation-overview-context-menu.cjs.map

package/dist/components/features/conversation/conversation-overview-context-menu.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"conversation-overview-context-menu.cjs","names":[],"sources":["../../../../src/components/features/conversation/conversation-overview-context-menu.tsx"],"sourcesContent":["import React, { useLayoutEffect, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport {\n FolderGit2,\n GitBranch,\n GitCommitHorizontal,\n Laptop,\n} from \"lucide-react\";\nimport { LuFileDiff } from \"react-icons/lu\";\nimport { useTranslation } from \"react-i18next\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { Divider } from \"#/ui/divider\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\nimport { useConversationLocalStorageState } from \"#/utils/conversation-local-storage\";\nimport { useSelectConversationTab } from \"#/hooks/use-select-conversation-tab\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport PrIcon from \"#/icons/u-pr.svg?react\";\nimport PillIcon from \"#/icons/pill.svg?react\";\nimport PillFillIcon from \"#/icons/pill-fill.svg?react\";\nimport { cn } from \"#/utils/utils\";\nimport {\n dropdownInstantColorClassName,\n dropdownMenuRowIconWrapperClassName,\n} from \"#/utils/dropdown-classes\";\nimport { useConversationOverviewDrawerOptional } from \"./conversation-overview-drawer-context\";\nimport {\n CONVERSATION_OVERVIEW_DRAWER_SECTION,\n type ConversationOverviewDrawerSection,\n} from \"./conversation-overview-drawer.types\";\nimport {\n CONVERSATION_OVERVIEW_GIT_PART,\n CONVERSATION_OVERVIEW_SECTION,\n CONVERSATION_OVERVIEW_SECTION_GROUPS,\n isOverviewGitPartPinned,\n isOverviewSectionPinned,\n type ConversationOverviewGitPart,\n type ConversationOverviewSection,\n} from \"./conversation-overview-sections\";\n\ninterface ConversationOverviewContextMenuProps {\n isOpen: boolean;\n onClose: () => void;\n ignoreOutsideClickRef?: React.RefObject<HTMLElement | null>;\n /** Portal anchor so the menu is not clipped by the overview panel. */\n anchorRef?: React.RefObject<HTMLElement | null>;\n}\n\ntype OverviewMenuItem = {\n section: ConversationOverviewSection;\n icon: React.ComponentType<{ className?: string }>;\n i18nKey: I18nKey;\n};\n\ntype GitPartMenuItem = {\n part: ConversationOverviewGitPart;\n icon: React.ComponentType<{ className?: string }>;\n i18nKey: I18nKey;\n drawerSection?: ConversationOverviewDrawerSection;\n opensChanges?: boolean;\n opensCommits?: boolean;\n};\n\nconst OVERVIEW_MENU_ITEMS_BY_SECTION: Record<\n Exclude<ConversationOverviewSection, \"git\">,\n OverviewMenuItem\n> = {\n [CONVERSATION_OVERVIEW_SECTION.workspace]: {\n section: CONVERSATION_OVERVIEW_SECTION.workspace,\n icon: Laptop,\n i18nKey: I18nKey.CONVERSATION$OVERVIEW_WORKSPACE,\n },\n};\n\nconst GIT_PART_MENU_ITEMS: GitPartMenuItem[] = [\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.changes,\n icon: LuFileDiff,\n i18nKey: I18nKey.COMMON$CHANGES,\n opensChanges: true,\n },\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.repository,\n icon: FolderGit2,\n i18nKey: I18nKey.CONVERSATION$REPOSITORY,\n },\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.branch,\n icon: GitBranch,\n i18nKey: I18nKey.CONVERSATION$BRANCH,\n },\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.commits,\n icon: GitCommitHorizontal,\n i18nKey: I18nKey.DIFF_VIEWER$COMMITS,\n opensCommits: true,\n },\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.pull_requests,\n icon: PrIcon,\n i18nKey: I18nKey.CONVERSATION$OVERVIEW_PULL_REQUESTS,\n drawerSection: CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests,\n },\n];\n\nfunction OverviewPinButton({\n testId,\n pinned,\n pinnedLabel,\n unpinnedLabel,\n onClick,\n}: {\n testId: string;\n pinned: boolean;\n pinnedLabel: string;\n unpinnedLabel: string;\n onClick: (event: React.MouseEvent) => void;\n}) {\n return (\n <button\n type=\"button\"\n data-testid={testId}\n className={cn(\n \"flex shrink-0 cursor-pointer items-center justify-center rounded-r px-2 text-white\",\n dropdownInstantColorClassName,\n \"hover:bg-white/10\",\n )}\n aria-pressed={pinned}\n aria-label={pinned ? pinnedLabel : unpinnedLabel}\n onClick={onClick}\n >\n <span\n className={cn(\n \"ml-auto overflow-hidden\",\n dropdownMenuRowIconWrapperClassName,\n )}\n aria-hidden\n >\n {pinned ? (\n <PillFillIcon className=\"size-4\" width={16} height={16} />\n ) : (\n <PillIcon className=\"size-4\" width={16} height={16} />\n )}\n </span>\n </button>\n );\n}\n\nexport function ConversationOverviewContextMenu({\n isOpen,\n onClose,\n ignoreOutsideClickRef,\n anchorRef,\n}: ConversationOverviewContextMenuProps) {\n const ref = useClickOutsideElement<HTMLUListElement>(\n onClose,\n ignoreOutsideClickRef,\n );\n const [portalStyle, setPortalStyle] = useState<React.CSSProperties>();\n const { t } = useTranslation(\"openhands\");\n const { conversationId } = useConversationId();\n const { state, setUnpinnedOverviewSections, setUnpinnedOverviewGitParts } =\n useConversationLocalStorageState(conversationId);\n const { navigateToChanges, navigateToCommits } = useSelectConversationTab();\n const overviewDrawer = useConversationOverviewDrawerOptional();\n\n useLayoutEffect(() => {\n if (!isOpen || !anchorRef?.current) {\n setPortalStyle(undefined);\n return undefined;\n }\n\n const updatePosition = () => {\n const rect = anchorRef.current?.getBoundingClientRect();\n if (!rect) return;\n\n const gap = 8;\n setPortalStyle({\n position: \"fixed\",\n zIndex: 9999,\n top: rect.bottom + gap,\n right: window.innerWidth - rect.right,\n });\n };\n\n updatePosition();\n window.addEventListener(\"resize\", updatePosition);\n window.addEventListener(\"scroll\", updatePosition, true);\n return () => {\n window.removeEventListener(\"resize\", updatePosition);\n window.removeEventListener(\"scroll\", updatePosition, true);\n };\n }, [isOpen, anchorRef]);\n\n const handleOpenGitPart = (item: GitPartMenuItem) => {\n if (item.opensChanges) {\n overviewDrawer?.closeDrawer();\n navigateToChanges();\n onClose();\n return;\n }\n\n if (item.opensCommits) {\n overviewDrawer?.closeDrawer();\n navigateToCommits();\n onClose();\n return;\n }\n\n if (!item.drawerSection) return;\n overviewDrawer?.openSection(item.drawerSection);\n onClose();\n };\n\n const handlePinToggle = (\n section: ConversationOverviewSection,\n event: React.MouseEvent,\n ) => {\n event.preventDefault();\n event.stopPropagation();\n\n const unpinnedSections = state.unpinnedOverviewSections ?? [];\n if (unpinnedSections.includes(section)) {\n setUnpinnedOverviewSections?.(\n unpinnedSections.filter((item) => item !== section),\n );\n return;\n }\n\n setUnpinnedOverviewSections?.([...unpinnedSections, section]);\n };\n\n const handleGitPartPinToggle = (\n part: ConversationOverviewGitPart,\n event: React.MouseEvent,\n ) => {\n event.preventDefault();\n event.stopPropagation();\n\n const unpinnedGitParts = state.unpinnedOverviewGitParts ?? [];\n if (unpinnedGitParts.includes(part)) {\n setUnpinnedOverviewGitParts?.(\n unpinnedGitParts.filter((item) => item !== part),\n );\n return;\n }\n\n setUnpinnedOverviewGitParts?.([...unpinnedGitParts, part]);\n };\n\n if (!isOpen) return null;\n\n const isPortaled = Boolean(anchorRef?.current && portalStyle);\n const gitPinned = isOverviewSectionPinned(\n CONVERSATION_OVERVIEW_SECTION.git,\n state.unpinnedOverviewSections ?? [],\n );\n const pinnedLabel = t(I18nKey.CONVERSATION$UNPIN_OVERVIEW_SECTION);\n const unpinnedLabel = t(I18nKey.CONVERSATION$PIN_OVERVIEW_SECTION);\n\n const renderMenuRow = ({\n key,\n testIdOpen,\n testIdPin,\n icon: Icon,\n label,\n pinned,\n isActionable,\n indent = false,\n onOpen,\n onPinToggle,\n }: {\n key: string;\n testIdOpen: string;\n testIdPin: string;\n icon: React.ComponentType<{ className?: string }>;\n label: string;\n pinned: boolean;\n isActionable: boolean;\n indent?: boolean;\n onOpen?: () => void;\n onPinToggle: (event: React.MouseEvent) => void;\n }) => {\n const labelContent = (\n <>\n <span className={dropdownMenuRowIconWrapperClassName} aria-hidden>\n <Icon className=\"h-4 w-4\" />\n </span>\n <span className=\"text-sm\">{label}</span>\n </>\n );\n\n return (\n <li key={key} className=\"list-none\">\n <div\n className={cn(\n \"group flex h-[30px] w-full min-w-0 items-stretch rounded hover:bg-[var(--oh-interactive-hover)]\",\n indent && \"pl-4\",\n )}\n >\n {isActionable ? (\n <button\n type=\"button\"\n data-testid={testIdOpen}\n className={cn(\n \"flex min-w-0 flex-1 cursor-pointer items-center gap-2 rounded-l p-2 text-start text-white\",\n dropdownInstantColorClassName,\n )}\n onClick={onOpen}\n >\n {labelContent}\n </button>\n ) : (\n <div\n data-testid={testIdOpen}\n className={cn(\n \"flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white\",\n dropdownInstantColorClassName,\n )}\n >\n {labelContent}\n </div>\n )}\n <OverviewPinButton\n testId={testIdPin}\n pinned={pinned}\n pinnedLabel={pinnedLabel}\n unpinnedLabel={unpinnedLabel}\n onClick={onPinToggle}\n />\n </div>\n </li>\n );\n };\n\n const renderSectionRow = (section: ConversationOverviewSection) => {\n if (section === CONVERSATION_OVERVIEW_SECTION.git) return null;\n const item = OVERVIEW_MENU_ITEMS_BY_SECTION[section];\n return renderMenuRow({\n key: section,\n testIdOpen: `conversation-overview-menu-open-${section}`,\n testIdPin: `conversation-overview-menu-pin-${section}`,\n icon: item.icon,\n label: t(item.i18nKey),\n pinned: isOverviewSectionPinned(\n section,\n state.unpinnedOverviewSections ?? [],\n ),\n isActionable: false,\n onPinToggle: (event) => handlePinToggle(section, event),\n });\n };\n\n const menu = (\n <ContextMenu\n ref={ref}\n testId=\"conversation-overview-context-menu\"\n theme={isPortaled ? \"popover\" : \"default\"}\n position={isPortaled ? \"none\" : \"bottom\"}\n alignment={isPortaled ? \"none\" : \"right\"}\n spacing={isPortaled ? \"none\" : \"default\"}\n className={cn(\"z-[9999] w-fit\", isPortaled ? \"mt-0\" : \"mt-2\")}\n >\n {CONVERSATION_OVERVIEW_SECTION_GROUPS.map((group, groupIndex) => (\n <React.Fragment key={group.sections.join(\"-\")}>\n {groupIndex > 0 ? (\n <Divider\n testId={`conversation-overview-menu-divider-${groupIndex}`}\n inset=\"menu\"\n />\n ) : null}\n {group.sections.map((section) => renderSectionRow(section))}\n </React.Fragment>\n ))}\n\n <Divider testId=\"conversation-overview-menu-divider-git\" inset=\"menu\" />\n\n {renderMenuRow({\n key: CONVERSATION_OVERVIEW_SECTION.git,\n testIdOpen: `conversation-overview-menu-open-${CONVERSATION_OVERVIEW_SECTION.git}`,\n testIdPin: `conversation-overview-menu-pin-${CONVERSATION_OVERVIEW_SECTION.git}`,\n icon: GitBranch,\n label: t(I18nKey.CONVERSATION$OVERVIEW_GIT),\n pinned: gitPinned,\n isActionable: false,\n onPinToggle: (event) =>\n handlePinToggle(CONVERSATION_OVERVIEW_SECTION.git, event),\n })}\n\n {GIT_PART_MENU_ITEMS.map((item) =>\n renderMenuRow({\n key: item.part,\n testIdOpen: `conversation-overview-menu-open-git-${item.part}`,\n testIdPin: `conversation-overview-menu-pin-git-${item.part}`,\n icon: item.icon,\n label: t(item.i18nKey),\n pinned: isOverviewGitPartPinned(\n item.part,\n state.unpinnedOverviewGitParts ?? [],\n ),\n isActionable: Boolean(\n item.drawerSection || item.opensCommits || item.opensChanges,\n ),\n indent: true,\n onOpen: () => handleOpenGitPart(item),\n onPinToggle: (event) => handleGitPartPinToggle(item.part, event),\n }),\n )}\n </ContextMenu>\n );\n\n if (isPortaled && portalStyle && typeof document !== \"undefined\") {\n return ReactDOM.createPortal(\n <div style={portalStyle}>{menu}</div>,\n document.body,\n );\n }\n\n return menu;\n}\n"],"mappings":"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"}

package/dist/components/features/conversation/conversation-overview-context-menu.d.ts ADDED Viewed

@@ -0,0 +1,10 @@
+import React from "react";
+interface ConversationOverviewContextMenuProps {
+    isOpen: boolean;
+    onClose: () => void;
+    ignoreOutsideClickRef?: React.RefObject<HTMLElement | null>;
+    /** Portal anchor so the menu is not clipped by the overview panel. */
+    anchorRef?: React.RefObject<HTMLElement | null>;
+}
+export declare function ConversationOverviewContextMenu({ isOpen, onClose, ignoreOutsideClickRef, anchorRef, }: ConversationOverviewContextMenuProps): React.JSX.Element | null;
+export {};

package/dist/components/features/conversation/conversation-overview-context-menu.js ADDED Viewed

@@ -0,0 +1,221 @@
+import { useTranslation as e } from "../../../node_modules/react-i18next/dist/es/useTranslation.js";
+import { I18nKey as t } from "../../../i18n/declaration.js";
+import { FolderGit2 as n } from "../../../node_modules/lucide-react/dist/esm/icons/folder-git-2.js";
+import { GitBranch as r } from "../../../node_modules/lucide-react/dist/esm/icons/git-branch.js";
+import { GitCommitHorizontal as i } from "../../../node_modules/lucide-react/dist/esm/icons/git-commit-horizontal.js";
+import { Laptop as a } from "../../../node_modules/lucide-react/dist/esm/icons/laptop.js";
+import { cn as o } from "../../../utils/utils.js";
+import { useConversationId as s } from "../../../hooks/use-conversation-id.js";
+import { CONVERSATION_OVERVIEW_GIT_PART as c, CONVERSATION_OVERVIEW_SECTION as l, CONVERSATION_OVERVIEW_SECTION_GROUPS as u, isOverviewGitPartPinned as d, isOverviewSectionPinned as f } from "./conversation-overview-sections.js";
+import { useConversationLocalStorageState as p } from "../../../utils/conversation-local-storage.js";
+import { dropdownInstantColorClassName as m, dropdownMenuRowIconWrapperClassName as h } from "../../../utils/dropdown-classes.js";
+import { ContextMenu as g } from "../../../ui/context-menu.js";
+import { useClickOutsideElement as _ } from "../../../hooks/use-click-outside-element.js";
+import { Divider as v } from "../../../ui/divider.js";
+import { useSelectConversationTab as y } from "../../../hooks/use-select-conversation-tab.js";
+import b from "../../../icons/u-pr.js";
+import { LuFileDiff as x } from "../../../node_modules/react-icons/lu/index.js";
+import { useConversationOverviewDrawerOptional as S } from "./conversation-overview-drawer-context.js";
+import C from "../../../icons/pill.js";
+import w from "../../../icons/pill-fill.js";
+import { CONVERSATION_OVERVIEW_DRAWER_SECTION as T } from "./conversation-overview-drawer.types.js";
+import E, { useLayoutEffect as D, useState as O } from "react";
+import { Fragment as k, jsx as A, jsxs as j } from "react/jsx-runtime";
+import M from "react-dom";
+//#region src/components/features/conversation/conversation-overview-context-menu.tsx
+var N = { [l.workspace]: {
+	section: l.workspace,
+	icon: a,
+	i18nKey: t.CONVERSATION$OVERVIEW_WORKSPACE
+} }, P = [
+	{
+		part: c.changes,
+		icon: x,
+		i18nKey: t.COMMON$CHANGES,
+		opensChanges: !0
+	},
+	{
+		part: c.repository,
+		icon: n,
+		i18nKey: t.CONVERSATION$REPOSITORY
+	},
+	{
+		part: c.branch,
+		icon: r,
+		i18nKey: t.CONVERSATION$BRANCH
+	},
+	{
+		part: c.commits,
+		icon: i,
+		i18nKey: t.DIFF_VIEWER$COMMITS,
+		opensCommits: !0
+	},
+	{
+		part: c.pull_requests,
+		icon: b,
+		i18nKey: t.CONVERSATION$OVERVIEW_PULL_REQUESTS,
+		drawerSection: T.pull_requests
+	}
+];
+function F({ testId: e, pinned: t, pinnedLabel: n, unpinnedLabel: r, onClick: i }) {
+	return /* @__PURE__ */ A("button", {
+		type: "button",
+		"data-testid": e,
+		className: o("flex shrink-0 cursor-pointer items-center justify-center rounded-r px-2 text-white", m, "hover:bg-white/10"),
+		"aria-pressed": t,
+		"aria-label": t ? n : r,
+		onClick: i,
+		children: /* @__PURE__ */ A("span", {
+			className: o("ml-auto overflow-hidden", h),
+			"aria-hidden": !0,
+			children: A(t ? w : C, {
+				className: "size-4",
+				width: 16,
+				height: 16
+			})
+		})
+	});
+}
+function I({ isOpen: n, onClose: i, ignoreOutsideClickRef: a, anchorRef: c }) {
+	let b = _(i, a), [x, C] = O(), { t: w } = e("openhands"), { conversationId: T } = s(), { state: I, setUnpinnedOverviewSections: L, setUnpinnedOverviewGitParts: R } = p(T), { navigateToChanges: z, navigateToCommits: B } = y(), V = S();
+	D(() => {
+		if (!n || !c?.current) {
+			C(void 0);
+			return;
+		}
+		let e = () => {
+			let e = c.current?.getBoundingClientRect();
+			e && C({
+				position: "fixed",
+				zIndex: 9999,
+				top: e.bottom + 8,
+				right: window.innerWidth - e.right
+			});
+		};
+		return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+			window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+		};
+	}, [n, c]);
+	let H = (e) => {
+		if (e.opensChanges) {
+			V?.closeDrawer(), z(), i();
+			return;
+		}
+		if (e.opensCommits) {
+			V?.closeDrawer(), B(), i();
+			return;
+		}
+		e.drawerSection && (V?.openSection(e.drawerSection), i());
+	}, U = (e, t) => {
+		t.preventDefault(), t.stopPropagation();
+		let n = I.unpinnedOverviewSections ?? [];
+		if (n.includes(e)) {
+			L?.(n.filter((t) => t !== e));
+			return;
+		}
+		L?.([...n, e]);
+	}, W = (e, t) => {
+		t.preventDefault(), t.stopPropagation();
+		let n = I.unpinnedOverviewGitParts ?? [];
+		if (n.includes(e)) {
+			R?.(n.filter((t) => t !== e));
+			return;
+		}
+		R?.([...n, e]);
+	};
+	if (!n) return null;
+	let G = !!(c?.current && x), K = f(l.git, I.unpinnedOverviewSections ?? []), q = w(t.CONVERSATION$UNPIN_OVERVIEW_SECTION), J = w(t.CONVERSATION$PIN_OVERVIEW_SECTION), Y = ({ key: e, testIdOpen: t, testIdPin: n, icon: r, label: i, pinned: a, isActionable: s, indent: c = !1, onOpen: l, onPinToggle: u }) => {
+		let d = /* @__PURE__ */ j(k, { children: [/* @__PURE__ */ A("span", {
+			className: h,
+			"aria-hidden": !0,
+			children: /* @__PURE__ */ A(r, { className: "h-4 w-4" })
+		}), /* @__PURE__ */ A("span", {
+			className: "text-sm",
+			children: i
+		})] });
+		return /* @__PURE__ */ A("li", {
+			className: "list-none",
+			children: /* @__PURE__ */ j("div", {
+				className: o("group flex h-[30px] w-full min-w-0 items-stretch rounded hover:bg-[var(--oh-interactive-hover)]", c && "pl-4"),
+				children: [s ? /* @__PURE__ */ A("button", {
+					type: "button",
+					"data-testid": t,
+					className: o("flex min-w-0 flex-1 cursor-pointer items-center gap-2 rounded-l p-2 text-start text-white", m),
+					onClick: l,
+					children: d
+				}) : /* @__PURE__ */ A("div", {
+					"data-testid": t,
+					className: o("flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white", m),
+					children: d
+				}), /* @__PURE__ */ A(F, {
+					testId: n,
+					pinned: a,
+					pinnedLabel: q,
+					unpinnedLabel: J,
+					onClick: u
+				})]
+			})
+		}, e);
+	}, X = (e) => {
+		if (e === l.git) return null;
+		let t = N[e];
+		return Y({
+			key: e,
+			testIdOpen: `conversation-overview-menu-open-${e}`,
+			testIdPin: `conversation-overview-menu-pin-${e}`,
+			icon: t.icon,
+			label: w(t.i18nKey),
+			pinned: f(e, I.unpinnedOverviewSections ?? []),
+			isActionable: !1,
+			onPinToggle: (t) => U(e, t)
+		});
+	}, Z = /* @__PURE__ */ j(g, {
+		ref: b,
+		testId: "conversation-overview-context-menu",
+		theme: G ? "popover" : "default",
+		position: G ? "none" : "bottom",
+		alignment: G ? "none" : "right",
+		spacing: G ? "none" : "default",
+		className: o("z-[9999] w-fit", G ? "mt-0" : "mt-2"),
+		children: [
+			u.map((e, t) => /* @__PURE__ */ j(E.Fragment, { children: [t > 0 ? /* @__PURE__ */ A(v, {
+				testId: `conversation-overview-menu-divider-${t}`,
+				inset: "menu"
+			}) : null, e.sections.map((e) => X(e))] }, e.sections.join("-"))),
+			/* @__PURE__ */ A(v, {
+				testId: "conversation-overview-menu-divider-git",
+				inset: "menu"
+			}),
+			Y({
+				key: l.git,
+				testIdOpen: `conversation-overview-menu-open-${l.git}`,
+				testIdPin: `conversation-overview-menu-pin-${l.git}`,
+				icon: r,
+				label: w(t.CONVERSATION$OVERVIEW_GIT),
+				pinned: K,
+				isActionable: !1,
+				onPinToggle: (e) => U(l.git, e)
+			}),
+			P.map((e) => Y({
+				key: e.part,
+				testIdOpen: `conversation-overview-menu-open-git-${e.part}`,
+				testIdPin: `conversation-overview-menu-pin-git-${e.part}`,
+				icon: e.icon,
+				label: w(e.i18nKey),
+				pinned: d(e.part, I.unpinnedOverviewGitParts ?? []),
+				isActionable: !!(e.drawerSection || e.opensCommits || e.opensChanges),
+				indent: !0,
+				onOpen: () => H(e),
+				onPinToggle: (t) => W(e.part, t)
+			}))
+		]
+	});
+	return G && x && typeof document < "u" ? M.createPortal(/* @__PURE__ */ A("div", {
+		style: x,
+		children: Z
+	}), document.body) : Z;
+}
+//#endregion
+export { I as ConversationOverviewContextMenu };
+//# sourceMappingURL=conversation-overview-context-menu.js.map

package/dist/components/features/conversation/conversation-overview-context-menu.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"conversation-overview-context-menu.js","names":[],"sources":["../../../../src/components/features/conversation/conversation-overview-context-menu.tsx"],"sourcesContent":["import React, { useLayoutEffect, useState } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport {\n FolderGit2,\n GitBranch,\n GitCommitHorizontal,\n Laptop,\n} from \"lucide-react\";\nimport { LuFileDiff } from \"react-icons/lu\";\nimport { useTranslation } from \"react-i18next\";\nimport { ContextMenu } from \"#/ui/context-menu\";\nimport { Divider } from \"#/ui/divider\";\nimport { useClickOutsideElement } from \"#/hooks/use-click-outside-element\";\nimport { useConversationId } from \"#/hooks/use-conversation-id\";\nimport { useConversationLocalStorageState } from \"#/utils/conversation-local-storage\";\nimport { useSelectConversationTab } from \"#/hooks/use-select-conversation-tab\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport PrIcon from \"#/icons/u-pr.svg?react\";\nimport PillIcon from \"#/icons/pill.svg?react\";\nimport PillFillIcon from \"#/icons/pill-fill.svg?react\";\nimport { cn } from \"#/utils/utils\";\nimport {\n dropdownInstantColorClassName,\n dropdownMenuRowIconWrapperClassName,\n} from \"#/utils/dropdown-classes\";\nimport { useConversationOverviewDrawerOptional } from \"./conversation-overview-drawer-context\";\nimport {\n CONVERSATION_OVERVIEW_DRAWER_SECTION,\n type ConversationOverviewDrawerSection,\n} from \"./conversation-overview-drawer.types\";\nimport {\n CONVERSATION_OVERVIEW_GIT_PART,\n CONVERSATION_OVERVIEW_SECTION,\n CONVERSATION_OVERVIEW_SECTION_GROUPS,\n isOverviewGitPartPinned,\n isOverviewSectionPinned,\n type ConversationOverviewGitPart,\n type ConversationOverviewSection,\n} from \"./conversation-overview-sections\";\n\ninterface ConversationOverviewContextMenuProps {\n isOpen: boolean;\n onClose: () => void;\n ignoreOutsideClickRef?: React.RefObject<HTMLElement | null>;\n /** Portal anchor so the menu is not clipped by the overview panel. */\n anchorRef?: React.RefObject<HTMLElement | null>;\n}\n\ntype OverviewMenuItem = {\n section: ConversationOverviewSection;\n icon: React.ComponentType<{ className?: string }>;\n i18nKey: I18nKey;\n};\n\ntype GitPartMenuItem = {\n part: ConversationOverviewGitPart;\n icon: React.ComponentType<{ className?: string }>;\n i18nKey: I18nKey;\n drawerSection?: ConversationOverviewDrawerSection;\n opensChanges?: boolean;\n opensCommits?: boolean;\n};\n\nconst OVERVIEW_MENU_ITEMS_BY_SECTION: Record<\n Exclude<ConversationOverviewSection, \"git\">,\n OverviewMenuItem\n> = {\n [CONVERSATION_OVERVIEW_SECTION.workspace]: {\n section: CONVERSATION_OVERVIEW_SECTION.workspace,\n icon: Laptop,\n i18nKey: I18nKey.CONVERSATION$OVERVIEW_WORKSPACE,\n },\n};\n\nconst GIT_PART_MENU_ITEMS: GitPartMenuItem[] = [\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.changes,\n icon: LuFileDiff,\n i18nKey: I18nKey.COMMON$CHANGES,\n opensChanges: true,\n },\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.repository,\n icon: FolderGit2,\n i18nKey: I18nKey.CONVERSATION$REPOSITORY,\n },\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.branch,\n icon: GitBranch,\n i18nKey: I18nKey.CONVERSATION$BRANCH,\n },\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.commits,\n icon: GitCommitHorizontal,\n i18nKey: I18nKey.DIFF_VIEWER$COMMITS,\n opensCommits: true,\n },\n {\n part: CONVERSATION_OVERVIEW_GIT_PART.pull_requests,\n icon: PrIcon,\n i18nKey: I18nKey.CONVERSATION$OVERVIEW_PULL_REQUESTS,\n drawerSection: CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests,\n },\n];\n\nfunction OverviewPinButton({\n testId,\n pinned,\n pinnedLabel,\n unpinnedLabel,\n onClick,\n}: {\n testId: string;\n pinned: boolean;\n pinnedLabel: string;\n unpinnedLabel: string;\n onClick: (event: React.MouseEvent) => void;\n}) {\n return (\n <button\n type=\"button\"\n data-testid={testId}\n className={cn(\n \"flex shrink-0 cursor-pointer items-center justify-center rounded-r px-2 text-white\",\n dropdownInstantColorClassName,\n \"hover:bg-white/10\",\n )}\n aria-pressed={pinned}\n aria-label={pinned ? pinnedLabel : unpinnedLabel}\n onClick={onClick}\n >\n <span\n className={cn(\n \"ml-auto overflow-hidden\",\n dropdownMenuRowIconWrapperClassName,\n )}\n aria-hidden\n >\n {pinned ? (\n <PillFillIcon className=\"size-4\" width={16} height={16} />\n ) : (\n <PillIcon className=\"size-4\" width={16} height={16} />\n )}\n </span>\n </button>\n );\n}\n\nexport function ConversationOverviewContextMenu({\n isOpen,\n onClose,\n ignoreOutsideClickRef,\n anchorRef,\n}: ConversationOverviewContextMenuProps) {\n const ref = useClickOutsideElement<HTMLUListElement>(\n onClose,\n ignoreOutsideClickRef,\n );\n const [portalStyle, setPortalStyle] = useState<React.CSSProperties>();\n const { t } = useTranslation(\"openhands\");\n const { conversationId } = useConversationId();\n const { state, setUnpinnedOverviewSections, setUnpinnedOverviewGitParts } =\n useConversationLocalStorageState(conversationId);\n const { navigateToChanges, navigateToCommits } = useSelectConversationTab();\n const overviewDrawer = useConversationOverviewDrawerOptional();\n\n useLayoutEffect(() => {\n if (!isOpen || !anchorRef?.current) {\n setPortalStyle(undefined);\n return undefined;\n }\n\n const updatePosition = () => {\n const rect = anchorRef.current?.getBoundingClientRect();\n if (!rect) return;\n\n const gap = 8;\n setPortalStyle({\n position: \"fixed\",\n zIndex: 9999,\n top: rect.bottom + gap,\n right: window.innerWidth - rect.right,\n });\n };\n\n updatePosition();\n window.addEventListener(\"resize\", updatePosition);\n window.addEventListener(\"scroll\", updatePosition, true);\n return () => {\n window.removeEventListener(\"resize\", updatePosition);\n window.removeEventListener(\"scroll\", updatePosition, true);\n };\n }, [isOpen, anchorRef]);\n\n const handleOpenGitPart = (item: GitPartMenuItem) => {\n if (item.opensChanges) {\n overviewDrawer?.closeDrawer();\n navigateToChanges();\n onClose();\n return;\n }\n\n if (item.opensCommits) {\n overviewDrawer?.closeDrawer();\n navigateToCommits();\n onClose();\n return;\n }\n\n if (!item.drawerSection) return;\n overviewDrawer?.openSection(item.drawerSection);\n onClose();\n };\n\n const handlePinToggle = (\n section: ConversationOverviewSection,\n event: React.MouseEvent,\n ) => {\n event.preventDefault();\n event.stopPropagation();\n\n const unpinnedSections = state.unpinnedOverviewSections ?? [];\n if (unpinnedSections.includes(section)) {\n setUnpinnedOverviewSections?.(\n unpinnedSections.filter((item) => item !== section),\n );\n return;\n }\n\n setUnpinnedOverviewSections?.([...unpinnedSections, section]);\n };\n\n const handleGitPartPinToggle = (\n part: ConversationOverviewGitPart,\n event: React.MouseEvent,\n ) => {\n event.preventDefault();\n event.stopPropagation();\n\n const unpinnedGitParts = state.unpinnedOverviewGitParts ?? [];\n if (unpinnedGitParts.includes(part)) {\n setUnpinnedOverviewGitParts?.(\n unpinnedGitParts.filter((item) => item !== part),\n );\n return;\n }\n\n setUnpinnedOverviewGitParts?.([...unpinnedGitParts, part]);\n };\n\n if (!isOpen) return null;\n\n const isPortaled = Boolean(anchorRef?.current && portalStyle);\n const gitPinned = isOverviewSectionPinned(\n CONVERSATION_OVERVIEW_SECTION.git,\n state.unpinnedOverviewSections ?? [],\n );\n const pinnedLabel = t(I18nKey.CONVERSATION$UNPIN_OVERVIEW_SECTION);\n const unpinnedLabel = t(I18nKey.CONVERSATION$PIN_OVERVIEW_SECTION);\n\n const renderMenuRow = ({\n key,\n testIdOpen,\n testIdPin,\n icon: Icon,\n label,\n pinned,\n isActionable,\n indent = false,\n onOpen,\n onPinToggle,\n }: {\n key: string;\n testIdOpen: string;\n testIdPin: string;\n icon: React.ComponentType<{ className?: string }>;\n label: string;\n pinned: boolean;\n isActionable: boolean;\n indent?: boolean;\n onOpen?: () => void;\n onPinToggle: (event: React.MouseEvent) => void;\n }) => {\n const labelContent = (\n <>\n <span className={dropdownMenuRowIconWrapperClassName} aria-hidden>\n <Icon className=\"h-4 w-4\" />\n </span>\n <span className=\"text-sm\">{label}</span>\n </>\n );\n\n return (\n <li key={key} className=\"list-none\">\n <div\n className={cn(\n \"group flex h-[30px] w-full min-w-0 items-stretch rounded hover:bg-[var(--oh-interactive-hover)]\",\n indent && \"pl-4\",\n )}\n >\n {isActionable ? (\n <button\n type=\"button\"\n data-testid={testIdOpen}\n className={cn(\n \"flex min-w-0 flex-1 cursor-pointer items-center gap-2 rounded-l p-2 text-start text-white\",\n dropdownInstantColorClassName,\n )}\n onClick={onOpen}\n >\n {labelContent}\n </button>\n ) : (\n <div\n data-testid={testIdOpen}\n className={cn(\n \"flex min-w-0 flex-1 items-center gap-2 rounded-l p-2 text-start text-white\",\n dropdownInstantColorClassName,\n )}\n >\n {labelContent}\n </div>\n )}\n <OverviewPinButton\n testId={testIdPin}\n pinned={pinned}\n pinnedLabel={pinnedLabel}\n unpinnedLabel={unpinnedLabel}\n onClick={onPinToggle}\n />\n </div>\n </li>\n );\n };\n\n const renderSectionRow = (section: ConversationOverviewSection) => {\n if (section === CONVERSATION_OVERVIEW_SECTION.git) return null;\n const item = OVERVIEW_MENU_ITEMS_BY_SECTION[section];\n return renderMenuRow({\n key: section,\n testIdOpen: `conversation-overview-menu-open-${section}`,\n testIdPin: `conversation-overview-menu-pin-${section}`,\n icon: item.icon,\n label: t(item.i18nKey),\n pinned: isOverviewSectionPinned(\n section,\n state.unpinnedOverviewSections ?? [],\n ),\n isActionable: false,\n onPinToggle: (event) => handlePinToggle(section, event),\n });\n };\n\n const menu = (\n <ContextMenu\n ref={ref}\n testId=\"conversation-overview-context-menu\"\n theme={isPortaled ? \"popover\" : \"default\"}\n position={isPortaled ? \"none\" : \"bottom\"}\n alignment={isPortaled ? \"none\" : \"right\"}\n spacing={isPortaled ? \"none\" : \"default\"}\n className={cn(\"z-[9999] w-fit\", isPortaled ? \"mt-0\" : \"mt-2\")}\n >\n {CONVERSATION_OVERVIEW_SECTION_GROUPS.map((group, groupIndex) => (\n <React.Fragment key={group.sections.join(\"-\")}>\n {groupIndex > 0 ? (\n <Divider\n testId={`conversation-overview-menu-divider-${groupIndex}`}\n inset=\"menu\"\n />\n ) : null}\n {group.sections.map((section) => renderSectionRow(section))}\n </React.Fragment>\n ))}\n\n <Divider testId=\"conversation-overview-menu-divider-git\" inset=\"menu\" />\n\n {renderMenuRow({\n key: CONVERSATION_OVERVIEW_SECTION.git,\n testIdOpen: `conversation-overview-menu-open-${CONVERSATION_OVERVIEW_SECTION.git}`,\n testIdPin: `conversation-overview-menu-pin-${CONVERSATION_OVERVIEW_SECTION.git}`,\n icon: GitBranch,\n label: t(I18nKey.CONVERSATION$OVERVIEW_GIT),\n pinned: gitPinned,\n isActionable: false,\n onPinToggle: (event) =>\n handlePinToggle(CONVERSATION_OVERVIEW_SECTION.git, event),\n })}\n\n {GIT_PART_MENU_ITEMS.map((item) =>\n renderMenuRow({\n key: item.part,\n testIdOpen: `conversation-overview-menu-open-git-${item.part}`,\n testIdPin: `conversation-overview-menu-pin-git-${item.part}`,\n icon: item.icon,\n label: t(item.i18nKey),\n pinned: isOverviewGitPartPinned(\n item.part,\n state.unpinnedOverviewGitParts ?? [],\n ),\n isActionable: Boolean(\n item.drawerSection || item.opensCommits || item.opensChanges,\n ),\n indent: true,\n onOpen: () => handleOpenGitPart(item),\n onPinToggle: (event) => handleGitPartPinToggle(item.part, event),\n }),\n )}\n </ContextMenu>\n );\n\n if (isPortaled && portalStyle && typeof document !== \"undefined\") {\n return ReactDOM.createPortal(\n <div style={portalStyle}>{menu}</div>,\n document.body,\n );\n }\n\n return menu;\n}\n"],"mappings":"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"}

package/dist/components/features/conversation/conversation-overview-diffs-row.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/react-i18next/dist/es/useTranslation.cjs"),n=require("../../../i18n/declaration.cjs"),r=require("../../../node_modules/lucide-react/dist/esm/icons/git-commit-horizontal.cjs"),i=require("../../../constants/status-colors.cjs"),a=require("../../../utils/utils.cjs"),o=require("../../../hooks/query/use-active-conversation.cjs"),s=require("../../../hooks/use-select-conversation-tab.cjs"),c=require("../../../node_modules/react-icons/lu/index.cjs"),l=require("../../../hooks/use-conversation-overview-git-diff-stats.cjs"),u=require("./conversation-overview-drawer-context.cjs"),d=require("./conversation-git-actions-menu.cjs");let f=require("react");f=e.__toESM(f,1);let p=require("react/jsx-runtime");var m=a.cn(`flex min-w-0 flex-1 items-center gap-2 rounded-md px-2 py-1.5`,`cursor-pointer border-0 bg-transparent text-left`),h=`size-4 shrink-0 text-[var(--oh-muted)]`,g=`conversation-overview-diffs-git-action`,_=a.cn(g,`absolute inset-0 inline-flex items-center justify-center`,`rounded-md text-[var(--oh-muted)] transition-opacity`,`hover:bg-white/10 hover:text-[var(--oh-foreground)]`),v=a.cn(`flex items-center rounded-md transition-colors`,`hover:bg-white/5`,`has-[.${g}:hover]:bg-transparent`),y=a.cn(`pointer-events-none invisible opacity-0`,`group-hover/diffstats:pointer-events-auto group-hover/diffstats:visible group-hover/diffstats:opacity-100`,`group-focus-within/diffstats:pointer-events-auto group-focus-within/diffstats:visible group-focus-within/diffstats:opacity-100`);function b(){let{t:e}=t.useTranslation(`openhands`),{navigateToChanges:g}=s.useSelectConversationTab(),b=u.useConversationOverviewDrawerOptional(),{data:x}=o.useActiveConversation(),{additions:S,deletions:C,isLoading:w}=l.useConversationOverviewGitDiffStats(),T=x?.git_provider??`github`,[E,D]=(0,f.useState)(!1),O=(0,f.useRef)(null);return(0,f.useEffect)(()=>{if(!E)return;let e=e=>{e.key===`Escape`&&D(!1)};return window.addEventListener(`keydown`,e),()=>window.removeEventListener(`keydown`,e)},[E]),(0,p.jsxs)(`li`,{className:v,children:[(0,p.jsxs)(`button`,{type:`button`,"data-testid":`conversation-overview-diffs`,"aria-label":e(n.I18nKey.CONVERSATION$OVERVIEW_OPEN_CHANGES),onClick:()=>{b?.closeDrawer(),g()},className:m,children:[(0,p.jsx)(c.LuFileDiff,{className:h,"aria-hidden":!0}),(0,p.jsx)(`span`,{className:`min-w-0 flex-1 truncate text-sm text-[var(--oh-foreground)]`,children:e(n.I18nKey.COMMON$CHANGES)})]}),(0,p.jsx)(`div`,{className:`group/diffstats relative mr-2 flex h-6 min-w-6 shrink-0 items-center justify-center`,children:w?(0,p.jsx)(`span`,{className:`text-sm tabular-nums text-[var(--oh-muted)]`,children:`…`}):(0,p.jsxs)(p.Fragment,{children:[(0,p.jsxs)(`span`,{className:a.cn(`flex items-center gap-1.5 text-sm tabular-nums transition-opacity`,E?`opacity-0`:`group-hover/diffstats:opacity-0 group-focus-within/diffstats:opacity-0`),children:[(0,p.jsx)(`span`,{"data-testid":`conversation-overview-diffs-additions`,style:{color:i.OH_STATUS_SUCCESS_COLOR},children:e(n.I18nKey.CONVERSATION$OVERVIEW_DIFF_ADDITIONS,{count:S.toLocaleString()})}),(0,p.jsx)(`span`,{"data-testid":`conversation-overview-diffs-deletions`,style:{color:i.OH_STATUS_ERROR_COLOR},children:e(n.I18nKey.CONVERSATION$OVERVIEW_DIFF_DELETIONS,{count:C.toLocaleString()})})]}),(0,p.jsx)(`button`,{ref:O,type:`button`,"data-testid":`conversation-overview-diffs-git-action`,"aria-label":e(n.I18nKey.CONVERSATION$OVERVIEW_DIFF_GIT_ACTIONS),"aria-expanded":E,"aria-haspopup":`menu`,onClick:e=>{e.stopPropagation(),D(e=>!e)},className:a.cn(_,!E&&y,E&&`pointer-events-auto visible opacity-100 text-[var(--oh-foreground)]`),children:(0,p.jsx)(r.GitCommitHorizontal,{className:`size-4`,"aria-hidden":!0})}),E?(0,p.jsx)(d.ConversationGitActionsMenu,{anchorRef:O,gitProvider:T,testIdPrefix:`conversation-overview-diffs-git`,onClose:()=>D(!1)}):null]})})]})}exports.ConversationOverviewDiffsRow=b;
2	+ //# sourceMappingURL=conversation-overview-diffs-row.cjs.map

package/dist/components/features/conversation/conversation-overview-diffs-row.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"conversation-overview-diffs-row.cjs","names":[],"sources":["../../../../src/components/features/conversation/conversation-overview-diffs-row.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { GitCommitHorizontal } from \"lucide-react\";\nimport { LuFileDiff } from \"react-icons/lu\";\nimport { useTranslation } from \"react-i18next\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useConversationOverviewGitDiffStats } from \"#/hooks/use-conversation-overview-git-diff-stats\";\nimport { useSelectConversationTab } from \"#/hooks/use-select-conversation-tab\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport {\n OH_STATUS_ERROR_COLOR,\n OH_STATUS_SUCCESS_COLOR,\n} from \"#/constants/status-colors\";\nimport { cn } from \"#/utils/utils\";\nimport { Provider } from \"#/types/settings\";\nimport { useConversationOverviewDrawerOptional } from \"./conversation-overview-drawer-context\";\nimport { ConversationGitActionsMenu } from \"./conversation-git-actions-menu\";\n\nconst CHANGES_BUTTON_CLASSNAME = cn(\n \"flex min-w-0 flex-1 items-center gap-2 rounded-md px-2 py-1.5\",\n \"cursor-pointer border-0 bg-transparent text-left\",\n);\n\nconst ROW_ICON_CLASSNAME = \"size-4 shrink-0 text-[var(--oh-muted)]\";\n\nconst GIT_ACTION_HOVER_TARGET_CLASSNAME =\n \"conversation-overview-diffs-git-action\";\n\nconst GIT_ACTION_BUTTON_CLASSNAME = cn(\n GIT_ACTION_HOVER_TARGET_CLASSNAME,\n \"absolute inset-0 inline-flex items-center justify-center\",\n \"rounded-md text-[var(--oh-muted)] transition-opacity\",\n \"hover:bg-white/10 hover:text-[var(--oh-foreground)]\",\n);\n\n/** Full-row hover, cleared while the git commit control itself is hovered. */\nconst DIFFS_ROW_CLASSNAME = cn(\n \"flex items-center rounded-md transition-colors\",\n \"hover:bg-white/5\",\n `has-[.${GIT_ACTION_HOVER_TARGET_CLASSNAME}:hover]:bg-transparent`,\n);\n\nconst GIT_ACTION_OVERLAY_CLASSNAME = cn(\n \"pointer-events-none invisible opacity-0\",\n \"group-hover/diffstats:pointer-events-auto group-hover/diffstats:visible group-hover/diffstats:opacity-100\",\n \"group-focus-within/diffstats:pointer-events-auto group-focus-within/diffstats:visible group-focus-within/diffstats:opacity-100\",\n);\n\nexport function ConversationOverviewDiffsRow() {\n const { t } = useTranslation(\"openhands\");\n const { navigateToChanges } = useSelectConversationTab();\n const overviewDrawer = useConversationOverviewDrawerOptional();\n const { data: conversation } = useActiveConversation();\n const { additions, deletions, isLoading } =\n useConversationOverviewGitDiffStats();\n const gitProvider =\n (conversation?.git_provider as Provider | undefined) ?? \"github\";\n const [isGitMenuOpen, setIsGitMenuOpen] = useState(false);\n const gitActionButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (!isGitMenuOpen) {\n return undefined;\n }\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n setIsGitMenuOpen(false);\n }\n };\n\n window.addEventListener(\"keydown\", onKeyDown);\n return () => window.removeEventListener(\"keydown\", onKeyDown);\n }, [isGitMenuOpen]);\n\n const handleOpenChanges = () => {\n overviewDrawer?.closeDrawer();\n navigateToChanges();\n };\n\n return (\n <li className={DIFFS_ROW_CLASSNAME}>\n <button\n type=\"button\"\n data-testid=\"conversation-overview-diffs\"\n aria-label={t(I18nKey.CONVERSATION$OVERVIEW_OPEN_CHANGES)}\n onClick={handleOpenChanges}\n className={CHANGES_BUTTON_CLASSNAME}\n >\n <LuFileDiff className={ROW_ICON_CLASSNAME} aria-hidden />\n <span className=\"min-w-0 flex-1 truncate text-sm text-[var(--oh-foreground)]\">\n {t(I18nKey.COMMON$CHANGES)}\n </span>\n </button>\n\n <div className=\"group/diffstats relative mr-2 flex h-6 min-w-6 shrink-0 items-center justify-center\">\n {isLoading ? (\n <span className=\"text-sm tabular-nums text-[var(--oh-muted)]\">…</span>\n ) : (\n <>\n <span\n className={cn(\n \"flex items-center gap-1.5 text-sm tabular-nums transition-opacity\",\n isGitMenuOpen\n ? \"opacity-0\"\n : \"group-hover/diffstats:opacity-0 group-focus-within/diffstats:opacity-0\",\n )}\n >\n <span\n data-testid=\"conversation-overview-diffs-additions\"\n style={{ color: OH_STATUS_SUCCESS_COLOR }}\n >\n {t(I18nKey.CONVERSATION$OVERVIEW_DIFF_ADDITIONS, {\n count: additions.toLocaleString(),\n })}\n </span>\n <span\n data-testid=\"conversation-overview-diffs-deletions\"\n style={{ color: OH_STATUS_ERROR_COLOR }}\n >\n {t(I18nKey.CONVERSATION$OVERVIEW_DIFF_DELETIONS, {\n count: deletions.toLocaleString(),\n })}\n </span>\n </span>\n <button\n ref={gitActionButtonRef}\n type=\"button\"\n data-testid=\"conversation-overview-diffs-git-action\"\n aria-label={t(I18nKey.CONVERSATION$OVERVIEW_DIFF_GIT_ACTIONS)}\n aria-expanded={isGitMenuOpen}\n aria-haspopup=\"menu\"\n onClick={(event) => {\n event.stopPropagation();\n setIsGitMenuOpen((open) => !open);\n }}\n className={cn(\n GIT_ACTION_BUTTON_CLASSNAME,\n !isGitMenuOpen && GIT_ACTION_OVERLAY_CLASSNAME,\n isGitMenuOpen &&\n \"pointer-events-auto visible opacity-100 text-[var(--oh-foreground)]\",\n )}\n >\n <GitCommitHorizontal className=\"size-4\" aria-hidden />\n </button>\n {isGitMenuOpen ? (\n <ConversationGitActionsMenu\n anchorRef={gitActionButtonRef}\n gitProvider={gitProvider}\n testIdPrefix=\"conversation-overview-diffs-git\"\n onClose={() => setIsGitMenuOpen(false)}\n />\n ) : null}\n </>\n )}\n </div>\n </li>\n );\n}\n"],"mappings":"sxBAiBA,IAAM,EAA2B,EAAA,GAC/B,gEACA,kDACF,EAEM,EAAqB,yCAErB,EACJ,yCAEI,EAA8B,EAAA,GAClC,EACA,2DACA,uDACA,qDACF,EAGM,EAAsB,EAAA,GAC1B,iDACA,mBACA,SAAS,EAAkC,uBAC7C,EAEM,EAA+B,EAAA,GACnC,0CACA,4GACA,gIACF,EAEA,SAAgB,GAA+B,CAC7C,GAAM,CAAE,KAAM,EAAA,eAAe,WAAW,EAClC,CAAE,qBAAsB,EAAA,yBAAyB,EACjD,EAAiB,EAAA,sCAAsC,EACvD,CAAE,KAAM,GAAiB,EAAA,sBAAsB,EAC/C,CAAE,YAAW,YAAW,aAC5B,EAAA,oCAAoC,EAChC,EACH,GAAc,cAAyC,SACpD,CAAC,EAAe,IAAA,EAAA,EAAA,UAA6B,EAAK,EAClD,GAAA,EAAA,EAAA,QAA+C,IAAI,EAsBzD,OApBA,EAAA,EAAA,eAAgB,CACd,GAAI,CAAC,EACH,OAGF,IAAM,EAAa,GAAyB,CACtC,EAAM,MAAQ,UAChB,EAAiB,EAAK,CAE1B,EAGA,OADA,OAAO,iBAAiB,UAAW,CAAS,MAC/B,OAAO,oBAAoB,UAAW,CAAS,CAC9D,EAAG,CAAC,CAAa,CAAC,GAQhB,EAAA,EAAA,MAAC,KAAD,CAAI,UAAW,WAAf,EACE,EAAA,EAAA,MAAC,SAAD,CACE,KAAK,SACL,cAAY,8BACZ,aAAY,EAAE,EAAA,QAAQ,kCAAkC,EACxD,YAX0B,CAC9B,GAAgB,YAAY,EAC5B,EAAkB,CACpB,EASM,UAAW,WALb,EAOE,EAAA,EAAA,KAAC,EAAA,WAAD,CAAY,UAAW,EAAoB,cAAA,EAAa,CAAA,GACxD,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,uEACb,EAAE,EAAA,QAAQ,cAAc,CACrB,CAAA,CACA,KAER,EAAA,EAAA,KAAC,MAAD,CAAK,UAAU,+FACZ,GACC,EAAA,EAAA,KAAC,OAAD,CAAM,UAAU,uDAA8C,GAAO,CAAA,GAErE,EAAA,EAAA,MAAA,EAAA,SAAA,CAAA,SAAA,EACE,EAAA,EAAA,MAAC,OAAD,CACE,UAAW,EAAA,GACT,oEACA,EACI,YACA,wEACN,WANF,EAQE,EAAA,EAAA,KAAC,OAAD,CACE,cAAY,wCACZ,MAAO,CAAE,MAAO,EAAA,uBAAwB,WAEvC,EAAE,EAAA,QAAQ,qCAAsC,CAC/C,MAAO,EAAU,eAAe,CAClC,CAAC,CACG,CAAA,GACN,EAAA,EAAA,KAAC,OAAD,CACE,cAAY,wCACZ,MAAO,CAAE,MAAO,EAAA,qBAAsB,WAErC,EAAE,EAAA,QAAQ,qCAAsC,CAC/C,MAAO,EAAU,eAAe,CAClC,CAAC,CACG,CAAA,CACF,KACN,EAAA,EAAA,KAAC,SAAD,CACE,IAAK,EACL,KAAK,SACL,cAAY,yCACZ,aAAY,EAAE,EAAA,QAAQ,sCAAsC,EAC5D,gBAAe,EACf,gBAAc,OACd,QAAU,GAAU,CAClB,EAAM,gBAAgB,EACtB,EAAkB,GAAS,CAAC,CAAI,CAClC,EACA,UAAW,EAAA,GACT,EACA,CAAC,GAAiB,EAClB,GACE,qEACJ,YAEA,EAAA,EAAA,KAAC,EAAA,oBAAD,CAAqB,UAAU,SAAS,cAAA,EAAa,CAAA,CAC/C,CAAA,EACP,GACC,EAAA,EAAA,KAAC,EAAA,2BAAD,CACE,UAAW,EACE,cACb,aAAa,kCACb,YAAe,EAAiB,EAAK,CACtC,CAAA,EACC,IACJ,CAAA,CAAA,CAED,CAAA,CACH,GAER"}

package/dist/components/features/conversation/conversation-overview-diffs-row.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import React from "react";
2	+ export declare function ConversationOverviewDiffsRow(): React.JSX.Element;

package/dist/components/features/conversation/conversation-overview-diffs-row.js ADDED Viewed

@@ -0,0 +1,88 @@
+import { useTranslation as e } from "../../../node_modules/react-i18next/dist/es/useTranslation.js";
+import { I18nKey as t } from "../../../i18n/declaration.js";
+import { GitCommitHorizontal as n } from "../../../node_modules/lucide-react/dist/esm/icons/git-commit-horizontal.js";
+import { OH_STATUS_ERROR_COLOR as r, OH_STATUS_SUCCESS_COLOR as i } from "../../../constants/status-colors.js";
+import { cn as a } from "../../../utils/utils.js";
+import { useActiveConversation as o } from "../../../hooks/query/use-active-conversation.js";
+import { useSelectConversationTab as s } from "../../../hooks/use-select-conversation-tab.js";
+import { LuFileDiff as c } from "../../../node_modules/react-icons/lu/index.js";
+import { useConversationOverviewGitDiffStats as l } from "../../../hooks/use-conversation-overview-git-diff-stats.js";
+import { useConversationOverviewDrawerOptional as u } from "./conversation-overview-drawer-context.js";
+import { ConversationGitActionsMenu as d } from "./conversation-git-actions-menu.js";
+import { useEffect as f, useRef as p, useState as m } from "react";
+import { Fragment as h, jsx as g, jsxs as _ } from "react/jsx-runtime";
+//#region src/components/features/conversation/conversation-overview-diffs-row.tsx
+var v = a("flex min-w-0 flex-1 items-center gap-2 rounded-md px-2 py-1.5", "cursor-pointer border-0 bg-transparent text-left"), y = "size-4 shrink-0 text-[var(--oh-muted)]", b = "conversation-overview-diffs-git-action", x = a(b, "absolute inset-0 inline-flex items-center justify-center", "rounded-md text-[var(--oh-muted)] transition-opacity", "hover:bg-white/10 hover:text-[var(--oh-foreground)]"), S = a("flex items-center rounded-md transition-colors", "hover:bg-white/5", `has-[.${b}:hover]:bg-transparent`), C = a("pointer-events-none invisible opacity-0", "group-hover/diffstats:pointer-events-auto group-hover/diffstats:visible group-hover/diffstats:opacity-100", "group-focus-within/diffstats:pointer-events-auto group-focus-within/diffstats:visible group-focus-within/diffstats:opacity-100");
+function w() {
+	let { t: b } = e("openhands"), { navigateToChanges: w } = s(), T = u(), { data: E } = o(), { additions: D, deletions: O, isLoading: k } = l(), A = E?.git_provider ?? "github", [j, M] = m(!1), N = p(null);
+	return f(() => {
+		if (!j) return;
+		let e = (e) => {
+			e.key === "Escape" && M(!1);
+		};
+		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
+	}, [j]), /* @__PURE__ */ _("li", {
+		className: S,
+		children: [/* @__PURE__ */ _("button", {
+			type: "button",
+			"data-testid": "conversation-overview-diffs",
+			"aria-label": b(t.CONVERSATION$OVERVIEW_OPEN_CHANGES),
+			onClick: () => {
+				T?.closeDrawer(), w();
+			},
+			className: v,
+			children: [/* @__PURE__ */ g(c, {
+				className: y,
+				"aria-hidden": !0
+			}), /* @__PURE__ */ g("span", {
+				className: "min-w-0 flex-1 truncate text-sm text-[var(--oh-foreground)]",
+				children: b(t.COMMON$CHANGES)
+			})]
+		}), /* @__PURE__ */ g("div", {
+			className: "group/diffstats relative mr-2 flex h-6 min-w-6 shrink-0 items-center justify-center",
+			children: k ? /* @__PURE__ */ g("span", {
+				className: "text-sm tabular-nums text-[var(--oh-muted)]",
+				children: "…"
+			}) : /* @__PURE__ */ _(h, { children: [
+				/* @__PURE__ */ _("span", {
+					className: a("flex items-center gap-1.5 text-sm tabular-nums transition-opacity", j ? "opacity-0" : "group-hover/diffstats:opacity-0 group-focus-within/diffstats:opacity-0"),
+					children: [/* @__PURE__ */ g("span", {
+						"data-testid": "conversation-overview-diffs-additions",
+						style: { color: i },
+						children: b(t.CONVERSATION$OVERVIEW_DIFF_ADDITIONS, { count: D.toLocaleString() })
+					}), /* @__PURE__ */ g("span", {
+						"data-testid": "conversation-overview-diffs-deletions",
+						style: { color: r },
+						children: b(t.CONVERSATION$OVERVIEW_DIFF_DELETIONS, { count: O.toLocaleString() })
+					})]
+				}),
+				/* @__PURE__ */ g("button", {
+					ref: N,
+					type: "button",
+					"data-testid": "conversation-overview-diffs-git-action",
+					"aria-label": b(t.CONVERSATION$OVERVIEW_DIFF_GIT_ACTIONS),
+					"aria-expanded": j,
+					"aria-haspopup": "menu",
+					onClick: (e) => {
+						e.stopPropagation(), M((e) => !e);
+					},
+					className: a(x, !j && C, j && "pointer-events-auto visible opacity-100 text-[var(--oh-foreground)]"),
+					children: /* @__PURE__ */ g(n, {
+						className: "size-4",
+						"aria-hidden": !0
+					})
+				}),
+				j ? /* @__PURE__ */ g(d, {
+					anchorRef: N,
+					gitProvider: A,
+					testIdPrefix: "conversation-overview-diffs-git",
+					onClose: () => M(!1)
+				}) : null
+			] })
+		})]
+	});
+}
+//#endregion
+export { w as ConversationOverviewDiffsRow };
+//# sourceMappingURL=conversation-overview-diffs-row.js.map

package/dist/components/features/conversation/conversation-overview-diffs-row.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"conversation-overview-diffs-row.js","names":[],"sources":["../../../../src/components/features/conversation/conversation-overview-diffs-row.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport { GitCommitHorizontal } from \"lucide-react\";\nimport { LuFileDiff } from \"react-icons/lu\";\nimport { useTranslation } from \"react-i18next\";\nimport { useActiveConversation } from \"#/hooks/query/use-active-conversation\";\nimport { useConversationOverviewGitDiffStats } from \"#/hooks/use-conversation-overview-git-diff-stats\";\nimport { useSelectConversationTab } from \"#/hooks/use-select-conversation-tab\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport {\n OH_STATUS_ERROR_COLOR,\n OH_STATUS_SUCCESS_COLOR,\n} from \"#/constants/status-colors\";\nimport { cn } from \"#/utils/utils\";\nimport { Provider } from \"#/types/settings\";\nimport { useConversationOverviewDrawerOptional } from \"./conversation-overview-drawer-context\";\nimport { ConversationGitActionsMenu } from \"./conversation-git-actions-menu\";\n\nconst CHANGES_BUTTON_CLASSNAME = cn(\n \"flex min-w-0 flex-1 items-center gap-2 rounded-md px-2 py-1.5\",\n \"cursor-pointer border-0 bg-transparent text-left\",\n);\n\nconst ROW_ICON_CLASSNAME = \"size-4 shrink-0 text-[var(--oh-muted)]\";\n\nconst GIT_ACTION_HOVER_TARGET_CLASSNAME =\n \"conversation-overview-diffs-git-action\";\n\nconst GIT_ACTION_BUTTON_CLASSNAME = cn(\n GIT_ACTION_HOVER_TARGET_CLASSNAME,\n \"absolute inset-0 inline-flex items-center justify-center\",\n \"rounded-md text-[var(--oh-muted)] transition-opacity\",\n \"hover:bg-white/10 hover:text-[var(--oh-foreground)]\",\n);\n\n/** Full-row hover, cleared while the git commit control itself is hovered. */\nconst DIFFS_ROW_CLASSNAME = cn(\n \"flex items-center rounded-md transition-colors\",\n \"hover:bg-white/5\",\n `has-[.${GIT_ACTION_HOVER_TARGET_CLASSNAME}:hover]:bg-transparent`,\n);\n\nconst GIT_ACTION_OVERLAY_CLASSNAME = cn(\n \"pointer-events-none invisible opacity-0\",\n \"group-hover/diffstats:pointer-events-auto group-hover/diffstats:visible group-hover/diffstats:opacity-100\",\n \"group-focus-within/diffstats:pointer-events-auto group-focus-within/diffstats:visible group-focus-within/diffstats:opacity-100\",\n);\n\nexport function ConversationOverviewDiffsRow() {\n const { t } = useTranslation(\"openhands\");\n const { navigateToChanges } = useSelectConversationTab();\n const overviewDrawer = useConversationOverviewDrawerOptional();\n const { data: conversation } = useActiveConversation();\n const { additions, deletions, isLoading } =\n useConversationOverviewGitDiffStats();\n const gitProvider =\n (conversation?.git_provider as Provider | undefined) ?? \"github\";\n const [isGitMenuOpen, setIsGitMenuOpen] = useState(false);\n const gitActionButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (!isGitMenuOpen) {\n return undefined;\n }\n\n const onKeyDown = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n setIsGitMenuOpen(false);\n }\n };\n\n window.addEventListener(\"keydown\", onKeyDown);\n return () => window.removeEventListener(\"keydown\", onKeyDown);\n }, [isGitMenuOpen]);\n\n const handleOpenChanges = () => {\n overviewDrawer?.closeDrawer();\n navigateToChanges();\n };\n\n return (\n <li className={DIFFS_ROW_CLASSNAME}>\n <button\n type=\"button\"\n data-testid=\"conversation-overview-diffs\"\n aria-label={t(I18nKey.CONVERSATION$OVERVIEW_OPEN_CHANGES)}\n onClick={handleOpenChanges}\n className={CHANGES_BUTTON_CLASSNAME}\n >\n <LuFileDiff className={ROW_ICON_CLASSNAME} aria-hidden />\n <span className=\"min-w-0 flex-1 truncate text-sm text-[var(--oh-foreground)]\">\n {t(I18nKey.COMMON$CHANGES)}\n </span>\n </button>\n\n <div className=\"group/diffstats relative mr-2 flex h-6 min-w-6 shrink-0 items-center justify-center\">\n {isLoading ? (\n <span className=\"text-sm tabular-nums text-[var(--oh-muted)]\">…</span>\n ) : (\n <>\n <span\n className={cn(\n \"flex items-center gap-1.5 text-sm tabular-nums transition-opacity\",\n isGitMenuOpen\n ? \"opacity-0\"\n : \"group-hover/diffstats:opacity-0 group-focus-within/diffstats:opacity-0\",\n )}\n >\n <span\n data-testid=\"conversation-overview-diffs-additions\"\n style={{ color: OH_STATUS_SUCCESS_COLOR }}\n >\n {t(I18nKey.CONVERSATION$OVERVIEW_DIFF_ADDITIONS, {\n count: additions.toLocaleString(),\n })}\n </span>\n <span\n data-testid=\"conversation-overview-diffs-deletions\"\n style={{ color: OH_STATUS_ERROR_COLOR }}\n >\n {t(I18nKey.CONVERSATION$OVERVIEW_DIFF_DELETIONS, {\n count: deletions.toLocaleString(),\n })}\n </span>\n </span>\n <button\n ref={gitActionButtonRef}\n type=\"button\"\n data-testid=\"conversation-overview-diffs-git-action\"\n aria-label={t(I18nKey.CONVERSATION$OVERVIEW_DIFF_GIT_ACTIONS)}\n aria-expanded={isGitMenuOpen}\n aria-haspopup=\"menu\"\n onClick={(event) => {\n event.stopPropagation();\n setIsGitMenuOpen((open) => !open);\n }}\n className={cn(\n GIT_ACTION_BUTTON_CLASSNAME,\n !isGitMenuOpen && GIT_ACTION_OVERLAY_CLASSNAME,\n isGitMenuOpen &&\n \"pointer-events-auto visible opacity-100 text-[var(--oh-foreground)]\",\n )}\n >\n <GitCommitHorizontal className=\"size-4\" aria-hidden />\n </button>\n {isGitMenuOpen ? (\n <ConversationGitActionsMenu\n anchorRef={gitActionButtonRef}\n gitProvider={gitProvider}\n testIdPrefix=\"conversation-overview-diffs-git\"\n onClose={() => setIsGitMenuOpen(false)}\n />\n ) : null}\n </>\n )}\n </div>\n </li>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;AAiBA,IAAM,IAA2B,EAC/B,iEACA,kDACF,GAEM,IAAqB,0CAErB,IACJ,0CAEI,IAA8B,EAClC,GACA,4DACA,wDACA,qDACF,GAGM,IAAsB,EAC1B,kDACA,oBACA,SAAS,EAAkC,uBAC7C,GAEM,IAA+B,EACnC,2CACA,6GACA,gIACF;AAEA,SAAgB,IAA+B;CAC7C,IAAM,EAAE,SAAM,EAAe,WAAW,GAClC,EAAE,yBAAsB,EAAyB,GACjD,IAAiB,EAAsC,GACvD,EAAE,MAAM,MAAiB,EAAsB,GAC/C,EAAE,cAAW,cAAW,iBAC5B,EAAoC,GAChC,IACH,GAAc,gBAAyC,UACpD,CAAC,GAAe,KAAoB,EAAS,EAAK,GAClD,IAAqB,EAA0B,IAAI;CAsBzD,OApBA,QAAgB;EACd,IAAI,CAAC,GACH;EAGF,IAAM,KAAa,MAAyB;GAC1C,AAAI,EAAM,QAAQ,YAChB,EAAiB,EAAK;EAE1B;EAGA,OADA,OAAO,iBAAiB,WAAW,CAAS,SAC/B,OAAO,oBAAoB,WAAW,CAAS;CAC9D,GAAG,CAAC,CAAa,CAAC,GAQhB,kBAAC,MAAD;EAAI,WAAW;YAAf,CACE,kBAAC,UAAD;GACE,MAAK;GACL,eAAY;GACZ,cAAY,EAAE,EAAQ,kCAAkC;GACxD,eAX0B;IAE9B,AADA,GAAgB,YAAY,GAC5B,EAAkB;GACpB;GASM,WAAW;aALb,CAOE,kBAAC,GAAD;IAAY,WAAW;IAAoB,eAAA;GAAa,CAAA,GACxD,kBAAC,QAAD;IAAM,WAAU;cACb,EAAE,EAAQ,cAAc;GACrB,CAAA,CACA;MAER,kBAAC,OAAD;GAAK,WAAU;aACZ,IACC,kBAAC,QAAD;IAAM,WAAU;cAA8C;GAAO,CAAA,IAErE,kBAAA,GAAA,EAAA,UAAA;IACE,kBAAC,QAAD;KACE,WAAW,EACT,qEACA,IACI,cACA,wEACN;eANF,CAQE,kBAAC,QAAD;MACE,eAAY;MACZ,OAAO,EAAE,OAAO,EAAwB;gBAEvC,EAAE,EAAQ,sCAAsC,EAC/C,OAAO,EAAU,eAAe,EAClC,CAAC;KACG,CAAA,GACN,kBAAC,QAAD;MACE,eAAY;MACZ,OAAO,EAAE,OAAO,EAAsB;gBAErC,EAAE,EAAQ,sCAAsC,EAC/C,OAAO,EAAU,eAAe,EAClC,CAAC;KACG,CAAA,CACF;;IACN,kBAAC,UAAD;KACE,KAAK;KACL,MAAK;KACL,eAAY;KACZ,cAAY,EAAE,EAAQ,sCAAsC;KAC5D,iBAAe;KACf,iBAAc;KACd,UAAU,MAAU;MAElB,AADA,EAAM,gBAAgB,GACtB,GAAkB,MAAS,CAAC,CAAI;KAClC;KACA,WAAW,EACT,GACA,CAAC,KAAiB,GAClB,KACE,qEACJ;eAEA,kBAAC,GAAD;MAAqB,WAAU;MAAS,eAAA;KAAa,CAAA;IAC/C,CAAA;IACP,IACC,kBAAC,GAAD;KACE,WAAW;KACE;KACb,cAAa;KACb,eAAe,EAAiB,EAAK;IACtC,CAAA,IACC;GACJ,EAAA,CAAA;EAED,CAAA,CACH;;AAER"}

package/dist/components/features/conversation/conversation-overview-drawer-content.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/react-i18next/dist/es/useTranslation.cjs"),n=require("../../../i18n/declaration.cjs"),r=require("../../../utils/utils.cjs"),i=require("../settings/brand-button.cjs"),a=require("../../../hooks/use-conversation-overview-stats.cjs"),o=require("./conversation-overview-drawer-context.cjs"),s=require("./conversation-overview-drawer.types.cjs"),c=require("../../../icons/x-mark.cjs"),l=require("./conversation-overview-automations-panel.cjs"),u=require("./conversation-overview-skills-panel.cjs"),d=require("./conversation-overview-mcp-panel.cjs"),f=require("./conversation-overview-secrets-panel.cjs"),p=require("./conversation-overview-git-items-panel.cjs"),m=require("./conversation-secondary-drawer.classes.cjs");let h=require("react");h=e.__toESM(h,1);let g=require("react/jsx-runtime");function _(e){switch(e){case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.automations:return n.I18nKey.CONVERSATION_PANEL$AUTOMATIONS;case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.skills:return n.I18nKey.SETTINGS$NAV_SKILLS;case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.mcp:return n.I18nKey.CONVERSATION$OVERVIEW_MCP;case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.secrets:return n.I18nKey.SETTINGS$NAV_SECRETS;case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests:return n.I18nKey.CONVERSATION$OVERVIEW_PULL_REQUESTS;case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.issues:return n.I18nKey.CONVERSATION$OVERVIEW_ISSUES;default:return e}}function v({section:e}){let{t:r}=t.useTranslation(`openhands`),{requestAdd:a}=o.useConversationOverviewDrawer();switch(e){case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.automations:return(0,g.jsx)(i.BrandButton,{type:`button`,variant:`primary`,testId:`conversation-overview-automations-add`,className:m.CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME,onClick:a,children:r(n.I18nKey.AUTOMATIONS$ADD_AUTOMATION)});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.skills:return(0,g.jsx)(i.BrandButton,{type:`button`,variant:`primary`,testId:`conversation-overview-skills-add-skill-button`,className:m.CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME,onClick:a,children:r(n.I18nKey.SETTINGS$SKILLS_ADD_BUTTON)});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.mcp:return(0,g.jsx)(i.BrandButton,{type:`button`,variant:`secondary`,testId:`conversation-overview-mcp-add-server`,className:m.CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME,onClick:a,children:r(n.I18nKey.MCP$ADD_CUSTOM)});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.secrets:return(0,g.jsx)(i.BrandButton,{type:`button`,variant:`primary`,testId:`conversation-overview-secrets-add-button`,className:m.CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME,onClick:a,children:r(n.I18nKey.SECRETS$ADD_NEW_SECRET)});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests:return(0,g.jsx)(p.ConversationOverviewGitItemsHeaderLink,{kind:`pull_requests`});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.issues:return(0,g.jsx)(p.ConversationOverviewGitItemsHeaderLink,{kind:`issues`});default:return null}}function y({section:e,openAdd:t}){switch(e){case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.automations:return(0,g.jsx)(l.ConversationOverviewAutomationsPanel,{openAdd:t});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.skills:return(0,g.jsx)(u.ConversationOverviewSkillsPanel,{openAdd:t});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.mcp:return(0,g.jsx)(d.ConversationOverviewMcpPanel,{openAdd:t});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.secrets:return(0,g.jsx)(f.ConversationOverviewSecretsPanel,{openAdd:t});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests:return(0,g.jsx)(p.ConversationOverviewGitItemsPanel,{kind:`pull_requests`});case s.CONVERSATION_OVERVIEW_DRAWER_SECTION.issues:return(0,g.jsx)(p.ConversationOverviewGitItemsPanel,{kind:`issues`});default:return e}}function b({className:e}){let{t:i}=t.useTranslation(`openhands`),{section:l,openAdd:u,closeDrawer:d}=o.useConversationOverviewDrawer(),{workspaceName:f}=a.useConversationOverviewStats();if((0,h.useEffect)(()=>{if(!l)return;let e=e=>{e.key===`Escape`&&d()};return document.addEventListener(`keydown`,e),()=>{document.removeEventListener(`keydown`,e)}},[d,l]),!l)return null;let p=l===s.CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests\|\|l===s.CONVERSATION_OVERVIEW_DRAWER_SECTION.issues\|\|l===s.CONVERSATION_OVERVIEW_DRAWER_SECTION.secrets;return(0,g.jsxs)(`aside`,{"data-testid":`conversation-overview-drawer-content`,"aria-label":i(_(l)),className:r.cn(`flex h-full w-full min-h-0 flex-col overflow-hidden bg-base-secondary`,e),children:[(0,g.jsxs)(`header`,{className:m.CONVERSATION_SECONDARY_DRAWER_HEADER_CLASSNAME,children:[(0,g.jsx)(`button`,{type:`button`,"data-testid":`conversation-overview-drawer-close`,"aria-label":i(n.I18nKey.BUTTON$CLOSE),onClick:d,className:m.CONVERSATION_SECONDARY_DRAWER_CLOSE_BUTTON_CLASSNAME,children:(0,g.jsx)(c.default,{className:`size-4`,"aria-hidden":!0})}),(0,g.jsxs)(`div`,{className:`flex min-w-0 flex-1 items-center gap-2`,children:[(0,g.jsx)(`h2`,{className:`truncate text-sm font-medium text-content`,children:i(_(l))}),f?(0,g.jsx)(`p`,{"data-testid":`conversation-overview-drawer-workspace`,className:`truncate text-xs text-muted`,children:f}):null]}),(0,g.jsx)(`div`,{className:`shrink-0`,children:(0,g.jsx)(v,{section:l})})]}),(0,g.jsx)(`div`,{className:r.cn(`min-h-0 flex-1 custom-scrollbar-always`,p?`flex flex-col overflow-hidden`:`overflow-y-auto px-4 py-4`),children:(0,g.jsx)(y,{section:l,openAdd:u})})]})}exports.ConversationOverviewDrawerContent=b;
2	+ //# sourceMappingURL=conversation-overview-drawer-content.cjs.map

package/dist/components/features/conversation/conversation-overview-drawer-content.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"conversation-overview-drawer-content.cjs","names":[],"sources":["../../../../src/components/features/conversation/conversation-overview-drawer-content.tsx"],"sourcesContent":["import React, { useEffect } from \"react\";\nimport { useTranslation } from \"react-i18next\";\nimport XMarkIcon from \"#/icons/x-mark.svg?react\";\nimport { BrandButton } from \"#/components/features/settings/brand-button\";\nimport { I18nKey } from \"#/i18n/declaration\";\nimport { cn } from \"#/utils/utils\";\nimport { useConversationOverviewDrawer } from \"./conversation-overview-drawer-context\";\nimport {\n CONVERSATION_OVERVIEW_DRAWER_SECTION,\n type ConversationOverviewDrawerSection,\n} from \"./conversation-overview-drawer.types\";\nimport { ConversationOverviewAutomationsPanel } from \"./conversation-overview-automations-panel\";\nimport { ConversationOverviewSkillsPanel } from \"./conversation-overview-skills-panel\";\nimport { ConversationOverviewMcpPanel } from \"./conversation-overview-mcp-panel\";\nimport { ConversationOverviewSecretsPanel } from \"./conversation-overview-secrets-panel\";\nimport {\n ConversationOverviewGitItemsHeaderLink,\n ConversationOverviewGitItemsPanel,\n} from \"./conversation-overview-git-items-panel\";\nimport { useConversationOverviewStats } from \"#/hooks/use-conversation-overview-stats\";\nimport {\n CONVERSATION_SECONDARY_DRAWER_CLOSE_BUTTON_CLASSNAME,\n CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME,\n CONVERSATION_SECONDARY_DRAWER_HEADER_CLASSNAME,\n} from \"./conversation-secondary-drawer.classes\";\n\ninterface ConversationOverviewDrawerContentProps {\n className?: string;\n}\n\nfunction getSectionTitleKey(section: ConversationOverviewDrawerSection) {\n switch (section) {\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.automations:\n return I18nKey.CONVERSATION_PANEL$AUTOMATIONS;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.skills:\n return I18nKey.SETTINGS$NAV_SKILLS;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.mcp:\n return I18nKey.CONVERSATION$OVERVIEW_MCP;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.secrets:\n return I18nKey.SETTINGS$NAV_SECRETS;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests:\n return I18nKey.CONVERSATION$OVERVIEW_PULL_REQUESTS;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.issues:\n return I18nKey.CONVERSATION$OVERVIEW_ISSUES;\n default: {\n const _exhaustive: never = section;\n return _exhaustive;\n }\n }\n}\n\nfunction ConversationOverviewDrawerHeaderAddAction({\n section,\n}: {\n section: ConversationOverviewDrawerSection;\n}) {\n const { t } = useTranslation(\"openhands\");\n const { requestAdd } = useConversationOverviewDrawer();\n\n switch (section) {\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.automations:\n return (\n <BrandButton\n type=\"button\"\n variant=\"primary\"\n testId=\"conversation-overview-automations-add\"\n className={CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME}\n onClick={requestAdd}\n >\n {t(I18nKey.AUTOMATIONS$ADD_AUTOMATION)}\n </BrandButton>\n );\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.skills:\n return (\n <BrandButton\n type=\"button\"\n variant=\"primary\"\n testId=\"conversation-overview-skills-add-skill-button\"\n className={CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME}\n onClick={requestAdd}\n >\n {t(I18nKey.SETTINGS$SKILLS_ADD_BUTTON)}\n </BrandButton>\n );\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.mcp:\n return (\n <BrandButton\n type=\"button\"\n variant=\"secondary\"\n testId=\"conversation-overview-mcp-add-server\"\n className={CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME}\n onClick={requestAdd}\n >\n {t(I18nKey.MCP$ADD_CUSTOM)}\n </BrandButton>\n );\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.secrets:\n return (\n <BrandButton\n type=\"button\"\n variant=\"primary\"\n testId=\"conversation-overview-secrets-add-button\"\n className={CONVERSATION_SECONDARY_DRAWER_HEADER_ACTION_CLASSNAME}\n onClick={requestAdd}\n >\n {t(I18nKey.SECRETS$ADD_NEW_SECRET)}\n </BrandButton>\n );\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests:\n return <ConversationOverviewGitItemsHeaderLink kind=\"pull_requests\" />;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.issues:\n return <ConversationOverviewGitItemsHeaderLink kind=\"issues\" />;\n default:\n return null;\n }\n}\n\nfunction ConversationOverviewDrawerBody({\n section,\n openAdd,\n}: {\n section: ConversationOverviewDrawerSection;\n openAdd: boolean;\n}) {\n switch (section) {\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.automations:\n return <ConversationOverviewAutomationsPanel openAdd={openAdd} />;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.skills:\n return <ConversationOverviewSkillsPanel openAdd={openAdd} />;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.mcp:\n return <ConversationOverviewMcpPanel openAdd={openAdd} />;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.secrets:\n return <ConversationOverviewSecretsPanel openAdd={openAdd} />;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests:\n return <ConversationOverviewGitItemsPanel kind=\"pull_requests\" />;\n case CONVERSATION_OVERVIEW_DRAWER_SECTION.issues:\n return <ConversationOverviewGitItemsPanel kind=\"issues\" />;\n default: {\n const _exhaustive: never = section;\n return _exhaustive;\n }\n }\n}\n\nexport function ConversationOverviewDrawerContent({\n className,\n}: ConversationOverviewDrawerContentProps) {\n const { t } = useTranslation(\"openhands\");\n const { section, openAdd, closeDrawer } = useConversationOverviewDrawer();\n const { workspaceName } = useConversationOverviewStats();\n\n useEffect(() => {\n if (!section) {\n return undefined;\n }\n\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\") {\n closeDrawer();\n }\n };\n\n document.addEventListener(\"keydown\", handleEscape);\n return () => {\n document.removeEventListener(\"keydown\", handleEscape);\n };\n }, [closeDrawer, section]);\n\n if (!section) {\n return null;\n }\n\n const isFullBleedBody =\n section === CONVERSATION_OVERVIEW_DRAWER_SECTION.pull_requests ||\n section === CONVERSATION_OVERVIEW_DRAWER_SECTION.issues ||\n section === CONVERSATION_OVERVIEW_DRAWER_SECTION.secrets;\n\n return (\n <aside\n data-testid=\"conversation-overview-drawer-content\"\n aria-label={t(getSectionTitleKey(section))}\n className={cn(\n \"flex h-full w-full min-h-0 flex-col overflow-hidden bg-base-secondary\",\n className,\n )}\n >\n <header className={CONVERSATION_SECONDARY_DRAWER_HEADER_CLASSNAME}>\n <button\n type=\"button\"\n data-testid=\"conversation-overview-drawer-close\"\n aria-label={t(I18nKey.BUTTON$CLOSE)}\n onClick={closeDrawer}\n className={CONVERSATION_SECONDARY_DRAWER_CLOSE_BUTTON_CLASSNAME}\n >\n <XMarkIcon className=\"size-4\" aria-hidden />\n </button>\n <div className=\"flex min-w-0 flex-1 items-center gap-2\">\n <h2 className=\"truncate text-sm font-medium text-content\">\n {t(getSectionTitleKey(section))}\n </h2>\n {workspaceName ? (\n <p\n data-testid=\"conversation-overview-drawer-workspace\"\n className=\"truncate text-xs text-muted\"\n >\n {workspaceName}\n </p>\n ) : null}\n </div>\n <div className=\"shrink-0\">\n <ConversationOverviewDrawerHeaderAddAction section={section} />\n </div>\n </header>\n\n <div\n className={cn(\n \"min-h-0 flex-1 custom-scrollbar-always\",\n isFullBleedBody\n ? \"flex flex-col overflow-hidden\"\n : \"overflow-y-auto px-4 py-4\",\n )}\n >\n <ConversationOverviewDrawerBody section={section} openAdd={openAdd} />\n </div>\n </aside>\n );\n}\n"],"mappings":"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"}

package/dist/components/features/conversation/conversation-overview-drawer-content.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+import React from "react";
+interface ConversationOverviewDrawerContentProps {
+    className?: string;
+}
+export declare function ConversationOverviewDrawerContent({ className, }: ConversationOverviewDrawerContentProps): React.JSX.Element | null;
+export {};