From f6768edde71cd657e7eb3134496342baa2f463c9 Mon Sep 17 00:00:00 2001
From: Charis <26616127+charislam@users.noreply.github.com>
Date: Mon, 16 Sep 2024 22:08:37 -0400
Subject: [PATCH] fix(cmdk): empty state shows up when it shouldn't (#29272)

* fix(cmdk): empty state shows up when it shouldn't

Can't remember why on earth I put this in a useMemo instead of a
useEffect...

* fix(command menu): switch branch command not showing up
---
 .../interfaces/BranchManagement/Branch.Commands.tsx |  2 +-
 .../CommandMenu/internal/CommandEmpty.tsx           | 13 ++++---------
 2 files changed, 5 insertions(+), 10 deletions(-)

diff --git a/apps/studio/components/interfaces/BranchManagement/Branch.Commands.tsx b/apps/studio/components/interfaces/BranchManagement/Branch.Commands.tsx
index 6979b223324..40a6f0b94cc 100644
--- a/apps/studio/components/interfaces/BranchManagement/Branch.Commands.tsx
+++ b/apps/studio/components/interfaces/BranchManagement/Branch.Commands.tsx
@@ -17,7 +17,7 @@ export function useBranchCommands() {
 
   let { data: branches } = useBranchesQuery(
     {
-      projectRef: selectedProject?.ref,
+      projectRef: selectedProject?.parentRef,
     },
     { enabled: isBranchingEnabled }
   )
diff --git a/packages/ui-patterns/CommandMenu/internal/CommandEmpty.tsx b/packages/ui-patterns/CommandMenu/internal/CommandEmpty.tsx
index 2128bbba340..0a98790ac60 100644
--- a/packages/ui-patterns/CommandMenu/internal/CommandEmpty.tsx
+++ b/packages/ui-patterns/CommandMenu/internal/CommandEmpty.tsx
@@ -1,6 +1,6 @@
 'use client'
 
-import { type PropsWithChildren, type RefObject, useMemo, useState } from 'react'
+import { type PropsWithChildren, type RefObject, useEffect, useState } from 'react'
 
 import { cn } from 'ui'
 
@@ -24,14 +24,9 @@ const CommandEmpty = ({
   const query = useQuery()
 
   const [render, setRender] = useState(false)
-  useMemo(() => {
-    if (!query) setRender(false)
-    /**
-     * In a timeout so the DOM update happens before we query.
-     */
-    setTimeout(() => {
-      setRender(!listRef?.current?.querySelector('[cmdk-item]'))
-    })
+  useEffect(() => {
+    if (!query) return setRender(false)
+    setRender(!listRef?.current?.querySelector('[cmdk-item]'))
   }, [query])
 
   return (