From 3c305148186c311db7ec03f2e17e91ff94de1200 Mon Sep 17 00:00:00 2001
From: Monica Khoury <99693443+monicakh@users.noreply.github.com>
Date: Thu, 30 Jul 2026 17:15:52 +0300
Subject: [PATCH] =?UTF-8?q?fix:=20open=20integrated=20support=20form=20fro?=
 =?UTF-8?q?m=20Feedback=20=E2=86=92=20Issue=20=E2=86=92=20Contact=20sup?=
 =?UTF-8?q?=E2=80=A6=20(#48488)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

PR description:

## Summary

- Clicking Feedback → Issue → Contact support was navigating to
`/support/new` (the old full-page form) instead of opening the
integrated sidebar support form
- Fixed by setting a `helpPanelState.requestedView` signal before
opening the Help sidebar, so it opens directly at the support form view
- Added a small valtio store (`state/help-panel-state.ts`) to
communicate the desired view between `FeedbackDropdown` and `HelpPanel`

## Test plan

- [ ] Feedback → Issue → Contact support opens the Help sidebar at the
support form (not `/support/new`)
- [ ] Help button → Contact support still works as before
- [ ] Closing and reopening the Help sidebar via the Help button opens
at the home view

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **New Features**
* Selecting **Support** from the Help menu now opens the Help Panel
directly to the Support view.
* The Help Panel automatically updates to the requested section when
opened.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 .../FeedbackDropdown/FeedbackDropdown.tsx         |  8 +++++++-
 apps/studio/components/ui/HelpPanel/HelpPanel.tsx | 15 +++++++++++++--
 apps/studio/state/help-panel-state.ts             |  7 +++++++
 3 files changed, 27 insertions(+), 3 deletions(-)
 create mode 100644 apps/studio/state/help-panel-state.ts

diff --git a/apps/studio/components/layouts/Navigation/LayoutHeader/FeedbackDropdown/FeedbackDropdown.tsx b/apps/studio/components/layouts/Navigation/LayoutHeader/FeedbackDropdown/FeedbackDropdown.tsx
index f0df629c90c..96f4df3b314 100644
--- a/apps/studio/components/layouts/Navigation/LayoutHeader/FeedbackDropdown/FeedbackDropdown.tsx
+++ b/apps/studio/components/layouts/Navigation/LayoutHeader/FeedbackDropdown/FeedbackDropdown.tsx
@@ -13,6 +13,7 @@ import { useSelectedOrganizationQuery } from '@/hooks/misc/useSelectedOrganizati
 import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
 import { useTrack } from '@/lib/telemetry/track'
 import { useAiAssistantStateSnapshot } from '@/state/ai-assistant-state'
+import { helpPanelState } from '@/state/help-panel-state'
 import { useSidebarManagerSnapshot } from '@/state/sidebar-manager-state'
 
 export const FeedbackDropdown = ({ className }: { className?: string }) => {
@@ -98,7 +99,12 @@ export const FeedbackDropdown = ({ className }: { className?: string }) => {
                   snap.newChat(ASSISTANT_SUGGESTIONS)
                   setIsOpen(false)
                 }}
-                onSupportClick={() => setIsOpen(false)}
+                onSupportClick={() => {
+                  helpPanelState.requestedView = 'support'
+                  setIsOpen(false)
+                  openSidebar(SIDEBAR_KEYS.HELP_PANEL)
+                  return false
+                }}
               />
             </div>
             <PopoverSeparator />
diff --git a/apps/studio/components/ui/HelpPanel/HelpPanel.tsx b/apps/studio/components/ui/HelpPanel/HelpPanel.tsx
index 211639e3e9b..c5f0a90da1b 100644
--- a/apps/studio/components/ui/HelpPanel/HelpPanel.tsx
+++ b/apps/studio/components/ui/HelpPanel/HelpPanel.tsx
@@ -2,9 +2,10 @@ import { IS_PLATFORM } from 'common'
 import { ChevronLeft, X } from 'lucide-react'
 import Image from 'next/image'
 import { useRouter } from 'next/router'
-import { useState } from 'react'
+import { useEffect, useState } from 'react'
 import SVG from 'react-inlinesvg'
 import { Button } from 'ui'
+import { useSnapshot } from 'valtio'
 
 import { ASSISTANT_SUGGESTIONS } from './HelpPanel.constants'
 import { HelpSection } from './HelpSection'
@@ -16,6 +17,7 @@ import {
 import { SIDEBAR_KEYS } from '@/components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
 import { ButtonTooltip } from '@/components/ui/ButtonTooltip'
 import { useAiAssistantStateSnapshot } from '@/state/ai-assistant-state'
+import { helpPanelState } from '@/state/help-panel-state'
 import { useSidebarManagerSnapshot } from '@/state/sidebar-manager-state'
 
 export const HelpPanel = ({
@@ -30,7 +32,16 @@ export const HelpPanel = ({
   const snap = useAiAssistantStateSnapshot()
   const { openSidebar, closeSidebar } = useSidebarManagerSnapshot()
   const router = useRouter()
-  const [view, setView] = useState<'home' | 'support'>('home')
+  const helpSnap = useSnapshot(helpPanelState)
+  const [view, setView] = useState<'home' | 'support'>(() => helpPanelState.requestedView)
+
+  useEffect(() => {
+    if (helpSnap.requestedView !== 'home') {
+      setView(helpSnap.requestedView)
+      helpPanelState.requestedView = 'home'
+    }
+  }, [helpSnap.requestedView])
+
   const isSupportView = view === 'support'
   const openAssistant = () => {
     onClose()
diff --git a/apps/studio/state/help-panel-state.ts b/apps/studio/state/help-panel-state.ts
new file mode 100644
index 00000000000..100959fa74b
--- /dev/null
+++ b/apps/studio/state/help-panel-state.ts
@@ -0,0 +1,7 @@
+import { proxy } from 'valtio'
+
+export const helpPanelState = proxy<{
+  requestedView: 'home' | 'support'
+}>({
+  requestedView: 'home',
+})