useContextSearchCommands() — supabase Function Reference

Architecture documentation for the useContextSearchCommands() function in ContextSearchCommands.tsx from the supabase codebase.

Function tsx ContentManagement Collections called by 1

Entity Profile

ContentManagement→ Collections→ useContextSearchCommands() — supabase Function Reference

Dependency Diagram

graph TD
  35e23075_6462_5656_5e49_24665c0bc1d4["useContextSearchCommands()"]
  7902296a_39c1_2b01_0b22_d5c1b0ad688b["StudioCommandMenu()"]
  7902296a_39c1_2b01_0b22_d5c1b0ad688b -->|calls| 35e23075_6462_5656_5e49_24665c0bc1d4
  style 35e23075_6462_5656_5e49_24665c0bc1d4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/studio/components/interfaces/App/CommandMenu/ContextSearchCommands.tsx lines 83–152

export function useContextSearchCommands() {
  const enableSearchEntitiesCommandMenu = useFlag('enableSearchEntitiesCommandMenu')
  const { data: project } = useSelectedProjectQuery()
  const setPage = useSetPage()

  const {
    projectAuthAll: authEnabled,
    projectEdgeFunctionAll: edgeFunctionsEnabled,
    projectStorageAll: storageEnabled,
  } = useIsFeatureEnabled(['project_auth:all', 'project_edge_function:all', 'project_storage:all'])

  const pageDefinitions = [
    { title: 'Search Database Tables', context: 'database-tables' as const },
    { title: 'Search RLS Policies', context: 'auth-policies' as const },
    { title: 'Search Edge Functions', context: 'edge-functions' as const },
    { title: 'Search Storage', context: 'storage' as const },
  ]

  // Register pages - pageDefinitions is constant, so hooks are called in consistent order
  for (const { title, context } of pageDefinitions) {
    const placeholder =
      SEARCH_CONTEXT_OPTIONS.find((opt) => opt.value === context)?.placeholder ?? ''
    // eslint-disable-next-line react-hooks/rules-of-hooks
    useRegisterPage(title, {
      type: PageType.Component,
      component: () => <ContextSearchPage context={context} placeholder={placeholder} />,
    })
  }

  const contextCommands = useMemo(() => {
    return SEARCH_CONTEXT_OPTIONS.filter((option) => {
      let isFeatureEnabled = false
      switch (option.value) {
        case 'database-tables':
          isFeatureEnabled = true
          break
        case 'auth-policies':
          isFeatureEnabled = authEnabled
          break
        case 'edge-functions':
          isFeatureEnabled = edgeFunctionsEnabled
          break
        case 'storage':
          isFeatureEnabled = storageEnabled
          break
      }

      if (!isFeatureEnabled) return false

      // If self-hosted, show if feature is enabled
      if (!IS_PLATFORM) {
        return true
      }

      // only show when inside a project if not self-hosted
      return !!project
    }).map((option) => ({
      id: `search-${option.value}`,
      name: `Search ${option.label}...`,
      action: () => setPage(option.pageName),
      icon: () => <option.icon className="h-4 w-4" strokeWidth={1.5} />,
    })) as ICommand[]
  }, [setPage, authEnabled, edgeFunctionsEnabled, storageEnabled, project])

  useRegisterCommands(COMMAND_MENU_SECTIONS.QUERY, contextCommands, {
    orderSection: orderCommandSectionsByPriority,
    sectionMeta: { priority: 3 },
    enabled: !IS_PLATFORM || (enableSearchEntitiesCommandMenu && !!project),
  })
}