open when click data-issues-open

vercel · Jan 18, 2025 · 2004aad · 2004aad
1 parent 44d03f6
commit 2004aad
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 6 deletions.
diff --git a/...rlay/_experimental/internal/components/errors/dev-tools-indicator/dev-tools-indicator.tsx b/...rlay/_experimental/internal/components/errors/dev-tools-indicator/dev-tools-indicator.tsx
@@ -115,6 +115,9 @@ const DevToolsPopover = ({
   }, [])
 
   const togglePopover = () => setIsPopoverOpen((prev) => !prev)
+  const openIssues = () => {
+    issueCount > 0 && setIsErrorOverlayOpen(true)
+  }
 
   return (
     <Toast
@@ -126,10 +129,11 @@ const DevToolsPopover = ({
       <div ref={buttonRef}>
         <NextLogo
           issueCount={issueCount}
-          onClick={() => {
-            issueCount > 0 && setIsErrorOverlayOpen(true)
+          onClickLogo={() => {
+            openIssues()
             togglePopover()
           }}
+          openIssues={openIssues}
           isDevBuilding={useIsDevBuilding()}
           isDevRendering={useIsDevRendering()}
           aria-haspopup="true"

diff --git a/...erlay/_experimental/internal/components/errors/dev-tools-indicator/internal/next-logo.tsx b/...erlay/_experimental/internal/components/errors/dev-tools-indicator/internal/next-logo.tsx
@@ -3,7 +3,8 @@ import { noop as css } from '../../../../../../internal/helpers/noop-template'
 
 interface Props extends React.ComponentProps<'button'> {
   issueCount: number
-  onClick: () => void
+  onClickLogo: () => void
+  openIssues: () => void
   isDevBuilding: boolean
   isDevRendering: boolean
 }
@@ -12,7 +13,8 @@ const SIZE = 36
 
 export const NextLogo = ({
   issueCount,
-  onClick,
+  onClickLogo,
+  openIssues,
   isDevBuilding,
   isDevRendering,
   ...props
@@ -220,12 +222,16 @@ export const NextLogo = ({
       >
         <div ref={ref}>
           {/* Children */}
-          <button data-next-mark onClick={onClick} {...props}>
+          <button data-next-mark onClick={onClickLogo} {...props}>
             <NextMark isLoading={isLoading} />
           </button>
           {hasError && (
             <div data-issues>
-              <button data-issues-open aria-label="Open issues overlay">
+              <button
+                data-issues-open
+                aria-label="Open issues overlay"
+                onClick={openIssues}
+              >
                 {issueCount} {issueCount === 1 ? 'Issue' : 'Issues'}
               </button>
               <button data-issues-close aria-label="Clear issues">