diff --git a/ui/src/App.tsx b/ui/src/App.tsx index c34d8d966bb..a622eab15ca 100644 --- a/ui/src/App.tsx +++ b/ui/src/App.tsx @@ -50,7 +50,7 @@ import { InviteLandingPage } from "./pages/InviteLanding"; import { JoinRequestQueue } from "./pages/JoinRequestQueue"; import { NotFoundPage } from "./pages/NotFound"; import { useCompany } from "./context/CompanyContext"; -import { useDialog } from "./context/DialogContext"; +import { useDialogActions } from "./context/DialogContext"; import { loadLastInboxTab } from "./lib/inbox"; import { shouldRedirectCompanylessRouteToOnboarding } from "./lib/onboarding-route"; @@ -139,7 +139,7 @@ function LegacySettingsRedirect() { function OnboardingRoutePage() { const { companies } = useCompany(); - const { openOnboarding } = useDialog(); + const { openOnboarding } = useDialogActions(); const { companyPrefix } = useParams<{ companyPrefix?: string }>(); const matchedCompany = companyPrefix ? companies.find((company) => company.issuePrefix.toUpperCase() === companyPrefix.toUpperCase()) ?? null @@ -231,7 +231,7 @@ function UnprefixedBoardRedirect() { } function NoCompaniesStartPage() { - const { openOnboarding } = useDialog(); + const { openOnboarding } = useDialogActions(); return (
diff --git a/ui/src/components/CommandPalette.test.tsx b/ui/src/components/CommandPalette.test.tsx index b229cc96739..165f1390c20 100644 --- a/ui/src/components/CommandPalette.test.tsx +++ b/ui/src/components/CommandPalette.test.tsx @@ -39,6 +39,7 @@ vi.mock("../context/CompanyContext", () => ({ vi.mock("../context/DialogContext", () => ({ useDialog: () => dialogState, + useDialogActions: () => dialogState, })); vi.mock("../context/SidebarContext", () => ({ diff --git a/ui/src/components/CommandPalette.tsx b/ui/src/components/CommandPalette.tsx index f5a0ef750b9..28530042525 100644 --- a/ui/src/components/CommandPalette.tsx +++ b/ui/src/components/CommandPalette.tsx @@ -2,7 +2,7 @@ import { useState, useEffect, useMemo } from "react"; import { useNavigate } from "@/lib/router"; import { useQuery } from "@tanstack/react-query"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useSidebar } from "../context/SidebarContext"; import { issuesApi } from "../api/issues"; import { agentsApi } from "../api/agents"; @@ -37,7 +37,7 @@ export function CommandPalette() { const [query, setQuery] = useState(""); const navigate = useNavigate(); const { selectedCompanyId } = useCompany(); - const { openNewIssue, openNewAgent } = useDialog(); + const { openNewIssue, openNewAgent } = useDialogActions(); const { isMobile, setSidebarOpen } = useSidebar(); const searchQuery = query.trim(); diff --git a/ui/src/components/CompanyRail.tsx b/ui/src/components/CompanyRail.tsx index 496dd40a2bd..2766a16bd0e 100644 --- a/ui/src/components/CompanyRail.tsx +++ b/ui/src/components/CompanyRail.tsx @@ -17,7 +17,7 @@ import { } from "@dnd-kit/sortable"; import { CSS } from "@dnd-kit/utilities"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { cn } from "../lib/utils"; import { queryKeys } from "../lib/queryKeys"; import { sidebarBadgesApi } from "../api/sidebarBadges"; @@ -125,7 +125,7 @@ function SortableCompanyItem({ export function CompanyRail() { const { companies, selectedCompanyId, setSelectedCompanyId } = useCompany(); - const { openOnboarding } = useDialog(); + const { openOnboarding } = useDialogActions(); const navigate = useNavigate(); const location = useLocation(); const isInstanceRoute = location.pathname.startsWith("/instance/"); diff --git a/ui/src/components/IssuesList.test.tsx b/ui/src/components/IssuesList.test.tsx index 9cd0b565ebc..d9c29eae4da 100644 --- a/ui/src/components/IssuesList.test.tsx +++ b/ui/src/components/IssuesList.test.tsx @@ -48,6 +48,7 @@ vi.mock("../context/CompanyContext", () => ({ vi.mock("../context/DialogContext", () => ({ useDialog: () => dialogState, + useDialogActions: () => dialogState, })); vi.mock("@/lib/router", () => ({ diff --git a/ui/src/components/IssuesList.tsx b/ui/src/components/IssuesList.tsx index 8346b31741d..fcf2f80578e 100644 --- a/ui/src/components/IssuesList.tsx +++ b/ui/src/components/IssuesList.tsx @@ -1,7 +1,7 @@ import { startTransition, useDeferredValue, useEffect, useMemo, useState, useCallback, useRef } from "react"; import { useQueries, useQuery } from "@tanstack/react-query"; import { accessApi } from "../api/access"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useCompany } from "../context/CompanyContext"; import { Link } from "@/lib/router"; import { executionWorkspacesApi } from "../api/execution-workspaces"; @@ -481,7 +481,7 @@ export function IssuesList({ onUpdateIssue, }: IssuesListProps) { const { selectedCompanyId } = useCompany(); - const { openNewIssue } = useDialog(); + const { openNewIssue } = useDialogActions(); const { data: session } = useQuery({ queryKey: queryKeys.auth.session, queryFn: () => authApi.getSession(), diff --git a/ui/src/components/Layout.test.tsx b/ui/src/components/Layout.test.tsx index 9ea147a85b4..2dfd1a9f082 100644 --- a/ui/src/components/Layout.test.tsx +++ b/ui/src/components/Layout.test.tsx @@ -100,6 +100,10 @@ vi.mock("../context/DialogContext", () => ({ openNewIssue: vi.fn(), openOnboarding: vi.fn(), }), + useDialogActions: () => ({ + openNewIssue: vi.fn(), + openOnboarding: vi.fn(), + }), })); vi.mock("../context/PanelContext", () => ({ diff --git a/ui/src/components/Layout.tsx b/ui/src/components/Layout.tsx index b0281df7f0b..9ad6a822271 100644 --- a/ui/src/components/Layout.tsx +++ b/ui/src/components/Layout.tsx @@ -18,7 +18,7 @@ import { MobileBottomNav } from "./MobileBottomNav"; import { WorktreeBanner } from "./WorktreeBanner"; import { DevRestartBanner } from "./DevRestartBanner"; import { SidebarAccountMenu } from "./SidebarAccountMenu"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { GeneralSettingsProvider } from "../context/GeneralSettingsContext"; import { usePanel } from "../context/PanelContext"; import { useCompany } from "../context/CompanyContext"; @@ -54,7 +54,7 @@ function readRememberedInstanceSettingsPath(): string { export function Layout() { const { sidebarOpen, setSidebarOpen, toggleSidebar, isMobile } = useSidebar(); - const { openNewIssue, openOnboarding } = useDialog(); + const { openNewIssue, openOnboarding } = useDialogActions(); const { togglePanelVisible } = usePanel(); const { companies, diff --git a/ui/src/components/MobileBottomNav.tsx b/ui/src/components/MobileBottomNav.tsx index 6bfefdfa2b1..81006b59ae2 100644 --- a/ui/src/components/MobileBottomNav.tsx +++ b/ui/src/components/MobileBottomNav.tsx @@ -8,7 +8,7 @@ import { Inbox, } from "lucide-react"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { SIDEBAR_SCROLL_RESET_STATE } from "../lib/navigation-scroll"; import { cn } from "../lib/utils"; import { useInboxBadge } from "../hooks/useInboxBadge"; @@ -37,7 +37,7 @@ type MobileNavItem = MobileNavLinkItem | MobileNavActionItem; export function MobileBottomNav({ visible }: MobileBottomNavProps) { const location = useLocation(); const { selectedCompanyId } = useCompany(); - const { openNewIssue } = useDialog(); + const { openNewIssue } = useDialogActions(); const inboxBadge = useInboxBadge(selectedCompanyId); const items = useMemo( diff --git a/ui/src/components/Sidebar.test.tsx b/ui/src/components/Sidebar.test.tsx index 6d52ddc3f2f..6bfcd9aee76 100644 --- a/ui/src/components/Sidebar.test.tsx +++ b/ui/src/components/Sidebar.test.tsx @@ -35,6 +35,9 @@ vi.mock("../context/DialogContext", () => ({ useDialog: () => ({ openNewIssue: vi.fn(), }), + useDialogActions: () => ({ + openNewIssue: vi.fn(), + }), })); vi.mock("../context/CompanyContext", () => ({ diff --git a/ui/src/components/Sidebar.tsx b/ui/src/components/Sidebar.tsx index 28e8957d3f4..6828014a726 100644 --- a/ui/src/components/Sidebar.tsx +++ b/ui/src/components/Sidebar.tsx @@ -18,7 +18,7 @@ import { SidebarSection } from "./SidebarSection"; import { SidebarNavItem } from "./SidebarNavItem"; import { SidebarProjects } from "./SidebarProjects"; import { SidebarAgents } from "./SidebarAgents"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useCompany } from "../context/CompanyContext"; import { heartbeatsApi } from "../api/heartbeats"; import { instanceSettingsApi } from "../api/instanceSettings"; @@ -29,7 +29,7 @@ import { PluginSlotOutlet } from "@/plugins/slots"; import { SidebarCompanyMenu } from "./SidebarCompanyMenu"; export function Sidebar() { - const { openNewIssue } = useDialog(); + const { openNewIssue } = useDialogActions(); const { selectedCompanyId, selectedCompany } = useCompany(); const inboxBadge = useInboxBadge(selectedCompanyId); const { data: experimentalSettings } = useQuery({ diff --git a/ui/src/components/SidebarAgents.test.tsx b/ui/src/components/SidebarAgents.test.tsx index ed4b28e783f..3d28df2207b 100644 --- a/ui/src/components/SidebarAgents.test.tsx +++ b/ui/src/components/SidebarAgents.test.tsx @@ -61,6 +61,9 @@ vi.mock("../context/DialogContext", () => ({ useDialog: () => ({ openNewAgent: mockOpenNewAgent, }), + useDialogActions: () => ({ + openNewAgent: mockOpenNewAgent, + }), })); vi.mock("../context/SidebarContext", () => ({ diff --git a/ui/src/components/SidebarAgents.tsx b/ui/src/components/SidebarAgents.tsx index e0aa98bb60b..8022195e69c 100644 --- a/ui/src/components/SidebarAgents.tsx +++ b/ui/src/components/SidebarAgents.tsx @@ -10,7 +10,7 @@ import { Plus, } from "lucide-react"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useSidebar } from "../context/SidebarContext"; import { useToastActions } from "../context/ToastContext"; import { agentsApi } from "../api/agents"; @@ -146,7 +146,7 @@ export function SidebarAgents() { const [open, setOpen] = useState(true); const queryClient = useQueryClient(); const { selectedCompanyId } = useCompany(); - const { openNewAgent } = useDialog(); + const { openNewAgent } = useDialogActions(); const { isMobile, setSidebarOpen } = useSidebar(); const { pushToast } = useToastActions(); const location = useLocation(); diff --git a/ui/src/components/SidebarProjects.tsx b/ui/src/components/SidebarProjects.tsx index 2f8b2aeed03..b48bc96794b 100644 --- a/ui/src/components/SidebarProjects.tsx +++ b/ui/src/components/SidebarProjects.tsx @@ -13,7 +13,7 @@ import { import { SortableContext, arrayMove, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable"; import { CSS } from "@dnd-kit/utilities"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useSidebar } from "../context/SidebarContext"; import { authApi } from "../api/auth"; import { projectsApi } from "../api/projects"; @@ -124,7 +124,7 @@ function SortableProjectItem({ export function SidebarProjects() { const [open, setOpen] = useState(true); const { selectedCompany, selectedCompanyId } = useCompany(); - const { openNewProject } = useDialog(); + const { openNewProject } = useDialogActions(); const { isMobile, setSidebarOpen } = useSidebar(); const location = useLocation(); diff --git a/ui/src/context/DialogContext.test.tsx b/ui/src/context/DialogContext.test.tsx new file mode 100644 index 00000000000..8e4c01c6b57 --- /dev/null +++ b/ui/src/context/DialogContext.test.tsx @@ -0,0 +1,58 @@ +// @vitest-environment jsdom + +import { act } from "react"; +import { createRoot } from "react-dom/client"; +import { afterEach, describe, expect, it } from "vitest"; +import { DialogProvider, useDialogActions, useDialogState } from "./DialogContext"; + +// eslint-disable-next-line @typescript-eslint/no-explicit-any +(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true; + +describe("DialogContext", () => { + afterEach(() => { + document.body.innerHTML = ""; + }); + + it("keeps action-only consumers from rerendering when dialog state changes", () => { + const host = document.createElement("div"); + document.body.appendChild(host); + const root = createRoot(host); + let actionRenderCount = 0; + let stateRenderCount = 0; + + function ActionOnlyConsumer() { + actionRenderCount += 1; + const { openNewIssue } = useDialogActions(); + return ; + } + + function StateConsumer() { + stateRenderCount += 1; + const { newIssueOpen } = useDialogState(); + return {newIssueOpen ? "open" : "closed"}; + } + + act(() => { + root.render( + + + + , + ); + }); + + expect(actionRenderCount).toBe(1); + expect(stateRenderCount).toBe(1); + + const button = host.querySelector("button"); + act(() => { + button?.dispatchEvent(new MouseEvent("click", { bubbles: true })); + }); + + expect(host.textContent).toContain("open"); + expect(actionRenderCount).toBe(1); + expect(stateRenderCount).toBe(2); + + act(() => root.unmount()); + }); +}); diff --git a/ui/src/context/DialogContext.tsx b/ui/src/context/DialogContext.tsx index bf18c7db92d..697a68905a4 100644 --- a/ui/src/context/DialogContext.tsx +++ b/ui/src/context/DialogContext.tsx @@ -1,4 +1,4 @@ -import { createContext, useCallback, useContext, useState, type ReactNode } from "react"; +import { createContext, useCallback, useContext, useMemo, useState, type ReactNode } from "react"; interface NewIssueDefaults { status?: string; @@ -48,7 +48,22 @@ interface DialogContextValue { closeOnboarding: () => void; } -const DialogContext = createContext(null); +type DialogStateValue = Pick< + DialogContextValue, + | "newIssueOpen" + | "newIssueDefaults" + | "newProjectOpen" + | "newGoalOpen" + | "newGoalDefaults" + | "newAgentOpen" + | "onboardingOpen" + | "onboardingOptions" +>; + +type DialogActionsValue = Omit; + +const DialogStateContext = createContext(null); +const DialogActionsContext = createContext(null); export function DialogProvider({ children }: { children: ReactNode }) { const [newIssueOpen, setNewIssueOpen] = useState(false); @@ -106,38 +121,84 @@ export function DialogProvider({ children }: { children: ReactNode }) { setOnboardingOptions({}); }, []); + const stateValue = useMemo( + () => ({ + newIssueOpen, + newIssueDefaults, + newProjectOpen, + newGoalOpen, + newGoalDefaults, + newAgentOpen, + onboardingOpen, + onboardingOptions, + }), + [ + newIssueOpen, + newIssueDefaults, + newProjectOpen, + newGoalOpen, + newGoalDefaults, + newAgentOpen, + onboardingOpen, + onboardingOptions, + ], + ); + + const actionsValue = useMemo( + () => ({ + openNewIssue, + closeNewIssue, + openNewProject, + closeNewProject, + openNewGoal, + closeNewGoal, + openNewAgent, + closeNewAgent, + openOnboarding, + closeOnboarding, + }), + [ + openNewIssue, + closeNewIssue, + openNewProject, + closeNewProject, + openNewGoal, + closeNewGoal, + openNewAgent, + closeNewAgent, + openOnboarding, + closeOnboarding, + ], + ); + return ( - - {children} - + + + {children} + + ); } -export function useDialog() { - const ctx = useContext(DialogContext); +export function useDialogActions() { + const ctx = useContext(DialogActionsContext); if (!ctx) { - throw new Error("useDialog must be used within DialogProvider"); + throw new Error("useDialogActions must be used within DialogProvider"); } return ctx; } + +export function useDialogState() { + const ctx = useContext(DialogStateContext); + if (!ctx) { + throw new Error("useDialogState must be used within DialogProvider"); + } + return ctx; +} + +export function useDialog() { + return { + ...useDialogState(), + ...useDialogActions(), + }; +} diff --git a/ui/src/pages/AgentDetail.tsx b/ui/src/pages/AgentDetail.tsx index daf293e3b5b..0eca94412ba 100644 --- a/ui/src/pages/AgentDetail.tsx +++ b/ui/src/pages/AgentDetail.tsx @@ -19,7 +19,7 @@ import { usePanel } from "../context/PanelContext"; import { useSidebar } from "../context/SidebarContext"; import { useCompany } from "../context/CompanyContext"; import { useToastActions } from "../context/ToastContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useBreadcrumbs } from "../context/BreadcrumbContext"; import { queryKeys } from "../lib/queryKeys"; import { AgentConfigForm } from "../components/AgentConfigForm"; @@ -626,7 +626,7 @@ export function AgentDetail() { }>(); const { companies, selectedCompanyId, setSelectedCompanyId } = useCompany(); const { closePanel } = usePanel(); - const { openNewIssue } = useDialog(); + const { openNewIssue } = useDialogActions(); const { setBreadcrumbs } = useBreadcrumbs(); const queryClient = useQueryClient(); const navigate = useNavigate(); diff --git a/ui/src/pages/Agents.tsx b/ui/src/pages/Agents.tsx index 6e3f0f3dc50..179a7c065ea 100644 --- a/ui/src/pages/Agents.tsx +++ b/ui/src/pages/Agents.tsx @@ -4,7 +4,7 @@ import { useQuery } from "@tanstack/react-query"; import { agentsApi, type OrgNode } from "../api/agents"; import { heartbeatsApi } from "../api/heartbeats"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useBreadcrumbs } from "../context/BreadcrumbContext"; import { useSidebar } from "../context/SidebarContext"; import { queryKeys } from "../lib/queryKeys"; @@ -55,7 +55,7 @@ function filterOrgTree(nodes: OrgNode[], tab: FilterTab, showTerminated: boolean export function Agents() { const { selectedCompanyId } = useCompany(); - const { openNewAgent } = useDialog(); + const { openNewAgent } = useDialogActions(); const { setBreadcrumbs } = useBreadcrumbs(); const navigate = useNavigate(); const location = useLocation(); diff --git a/ui/src/pages/Companies.tsx b/ui/src/pages/Companies.tsx index 6844850dc82..58590d66cfa 100644 --- a/ui/src/pages/Companies.tsx +++ b/ui/src/pages/Companies.tsx @@ -1,7 +1,7 @@ import { useState, useEffect } from "react"; import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useBreadcrumbs } from "../context/BreadcrumbContext"; import { companiesApi } from "../api/companies"; import { queryKeys } from "../lib/queryKeys"; @@ -36,7 +36,7 @@ export function Companies() { loading, error, } = useCompany(); - const { openOnboarding } = useDialog(); + const { openOnboarding } = useDialogActions(); const { setBreadcrumbs } = useBreadcrumbs(); const queryClient = useQueryClient(); diff --git a/ui/src/pages/Dashboard.tsx b/ui/src/pages/Dashboard.tsx index eda0e2f8385..cf9675b6f43 100644 --- a/ui/src/pages/Dashboard.tsx +++ b/ui/src/pages/Dashboard.tsx @@ -9,7 +9,7 @@ import { agentsApi } from "../api/agents"; import { projectsApi } from "../api/projects"; import { buildCompanyUserProfileMap } from "../lib/company-members"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useBreadcrumbs } from "../context/BreadcrumbContext"; import { queryKeys } from "../lib/queryKeys"; import { MetricCard } from "../components/MetricCard"; @@ -36,7 +36,7 @@ function getRecentIssues(issues: Issue[]): Issue[] { export function Dashboard() { const { selectedCompanyId, companies } = useCompany(); - const { openOnboarding } = useDialog(); + const { openOnboarding } = useDialogActions(); const { setBreadcrumbs } = useBreadcrumbs(); const [animatedActivityIds, setAnimatedActivityIds] = useState>(new Set()); const seenActivityIdsRef = useRef>(new Set()); diff --git a/ui/src/pages/GoalDetail.tsx b/ui/src/pages/GoalDetail.tsx index 169622eb721..4d52988d61e 100644 --- a/ui/src/pages/GoalDetail.tsx +++ b/ui/src/pages/GoalDetail.tsx @@ -6,7 +6,7 @@ import { projectsApi } from "../api/projects"; import { assetsApi } from "../api/assets"; import { usePanel } from "../context/PanelContext"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useBreadcrumbs } from "../context/BreadcrumbContext"; import { queryKeys } from "../lib/queryKeys"; import { GoalProperties } from "../components/GoalProperties"; @@ -49,7 +49,7 @@ export function GoalPropertiesToggleButton({ export function GoalDetail() { const { goalId } = useParams<{ goalId: string }>(); const { selectedCompanyId, setSelectedCompanyId } = useCompany(); - const { openNewGoal } = useDialog(); + const { openNewGoal } = useDialogActions(); const { openPanel, closePanel, panelVisible, setPanelVisible } = usePanel(); const { setBreadcrumbs } = useBreadcrumbs(); const queryClient = useQueryClient(); diff --git a/ui/src/pages/Goals.tsx b/ui/src/pages/Goals.tsx index 490bb048cea..7dca9e18dd4 100644 --- a/ui/src/pages/Goals.tsx +++ b/ui/src/pages/Goals.tsx @@ -2,7 +2,7 @@ import { useEffect } from "react"; import { useQuery } from "@tanstack/react-query"; import { goalsApi } from "../api/goals"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useBreadcrumbs } from "../context/BreadcrumbContext"; import { queryKeys } from "../lib/queryKeys"; import { GoalTree } from "../components/GoalTree"; @@ -13,7 +13,7 @@ import { Target, Plus } from "lucide-react"; export function Goals() { const { selectedCompanyId } = useCompany(); - const { openNewGoal } = useDialog(); + const { openNewGoal } = useDialogActions(); const { setBreadcrumbs } = useBreadcrumbs(); useEffect(() => { diff --git a/ui/src/pages/IssueDetail.test.tsx b/ui/src/pages/IssueDetail.test.tsx index 4ae3733b05e..a926c162af7 100644 --- a/ui/src/pages/IssueDetail.test.tsx +++ b/ui/src/pages/IssueDetail.test.tsx @@ -134,6 +134,9 @@ vi.mock("../context/DialogContext", () => ({ useDialog: () => ({ openNewIssue: vi.fn(), }), + useDialogActions: () => ({ + openNewIssue: vi.fn(), + }), })); vi.mock("../context/PanelContext", () => ({ diff --git a/ui/src/pages/IssueDetail.tsx b/ui/src/pages/IssueDetail.tsx index 8038922a30d..b197aa7118e 100644 --- a/ui/src/pages/IssueDetail.tsx +++ b/ui/src/pages/IssueDetail.tsx @@ -13,7 +13,7 @@ import { agentsApi } from "../api/agents"; import { authApi } from "../api/auth"; import { projectsApi } from "../api/projects"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { usePanel } from "../context/PanelContext"; import { useSidebar } from "../context/SidebarContext"; import { useToastActions } from "../context/ToastContext"; @@ -1025,7 +1025,7 @@ function IssueDetailActivityTab({ export function IssueDetail() { const { issueId } = useParams<{ issueId: string }>(); const { selectedCompanyId } = useCompany(); - const { openNewIssue } = useDialog(); + const { openNewIssue } = useDialogActions(); const { openPanel, closePanel, panelVisible, setPanelVisible } = usePanel(); const { setBreadcrumbs, setMobileToolbar } = useBreadcrumbs(); const queryClient = useQueryClient(); diff --git a/ui/src/pages/Projects.tsx b/ui/src/pages/Projects.tsx index 886a2b6076a..08d246a8562 100644 --- a/ui/src/pages/Projects.tsx +++ b/ui/src/pages/Projects.tsx @@ -2,7 +2,7 @@ import { useEffect, useMemo } from "react"; import { useQuery } from "@tanstack/react-query"; import { projectsApi } from "../api/projects"; import { useCompany } from "../context/CompanyContext"; -import { useDialog } from "../context/DialogContext"; +import { useDialogActions } from "../context/DialogContext"; import { useBreadcrumbs } from "../context/BreadcrumbContext"; import { queryKeys } from "../lib/queryKeys"; import { EntityRow } from "../components/EntityRow"; @@ -15,7 +15,7 @@ import { Hexagon, Plus } from "lucide-react"; export function Projects() { const { selectedCompanyId } = useCompany(); - const { openNewProject } = useDialog(); + const { openNewProject } = useDialogActions(); const { setBreadcrumbs } = useBreadcrumbs(); useEffect(() => {