[pull] master from supabase:master

apps/studio/components/interfaces/Account/Preferences/HotkeySettings.tsx

@@ -1,4 +1,5 @@
 import { LOCAL_STORAGE_KEYS } from 'common'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
 import Panel from 'components/ui/Panel'
 import { useLocalStorageQuery } from 'hooks/misc/useLocalStorage'
 import { KeyboardShortcut, Toggle } from 'ui'
@@ -13,7 +14,7 @@ export const HotkeySettings = () => {
     true
   )
   const [aiAssistantEnabled, setAiAssistantEnabled] = useLocalStorageQuery(
-    LOCAL_STORAGE_KEYS.HOTKEY_AI_ASSISTANT,
+    LOCAL_STORAGE_KEYS.HOTKEY_SIDEBAR(SIDEBAR_KEYS.AI_ASSISTANT),
     true
   )
 

apps/studio/components/interfaces/Auth/Overview/OverviewLearnMore.tsx

@@ -6,13 +6,16 @@ import { Logs } from 'icons'
 import { BASE_PATH } from 'lib/constants'
 import { useParams } from 'common'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 import { useTheme } from 'next-themes'
 import { useEffect, useState } from 'react'
 
 export const OverviewLearnMore = () => {
   const [isMounted, setIsMounted] = useState(false)
   const { ref } = useParams()
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
   const { theme, resolvedTheme } = useTheme()
 
   useEffect(() => {
@@ -48,9 +51,9 @@ export const OverviewLearnMore = () => {
         {
           label: 'Ask Assistant',
           onClick: () => {
+            openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
             aiSnap.newChat({
               name: 'Auth Help',
-              open: true,
               initialInput:
                 'Look at my logs related to Supabase Auth and help me debug the recent errors.',
               suggestions: {

apps/studio/components/interfaces/Auth/Policies/PolicyTableRow/PolicyRow.tsx

@@ -8,6 +8,8 @@ import { useAuthConfigQuery } from 'data/auth/auth-config-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
 import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 import {
   Button,
   DropdownMenu,
@@ -37,6 +39,7 @@ export const PolicyRow = ({
   onSelectDeletePolicy = noop,
 }: PolicyRowProps) => {
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
   const { can: canUpdatePolicies } = useAsyncCheckPermissions(
     PermissionAction.TENANT_SQL_ADMIN_WRITE,
     'policies'
@@ -119,9 +122,9 @@ export const PolicyRow = ({
                 className="space-x-2"
                 onClick={() => {
                   const sql = generatePolicyUpdateSQL(policy)
+                  openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
                   aiSnap.newChat({
                     name: `Update policy ${policy.name}`,
-                    open: true,
                     sqlSnippets: [sql],
                     initialInput: `Update the policy with name \"${policy.name}\" in the ${policy.schema} schema on the ${policy.table} table. It should...`,
                     suggestions: {

apps/studio/components/interfaces/Auth/Policies/PolicyTableRow/PolicyTableRowHeader.tsx

@@ -9,6 +9,8 @@ import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
 import { AiIconAnimation, Badge, CardTitle } from 'ui'
 import type { PolicyTable } from './PolicyTableRow.types'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 
 interface PolicyTableRowHeaderProps {
   table: PolicyTable
@@ -25,6 +27,7 @@ export const PolicyTableRowHeader = ({
 }: PolicyTableRowHeaderProps) => {
   const { ref } = useParams()
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
 
   const { can: canCreatePolicies } = useAsyncCheckPermissions(
     PermissionAction.TENANT_SQL_ADMIN_WRITE,
@@ -101,9 +104,9 @@ export const PolicyTableRowHeader = ({
               type="default"
               className="px-1"
               onClick={() => {
+                openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
                 aiSnap.newChat({
                   name: 'Create new policy',
-                  open: true,
                   initialInput: `Create and name a new policy for the ${table.schema} schema on the ${table.name} table that ...`,
                 })
               }}

apps/studio/components/interfaces/BranchManagement/ReviewWithAI.tsx

@@ -6,6 +6,8 @@ import { useSendEventMutation } from 'data/telemetry/send-event-mutation'
 import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
 import { tablesToSQL } from 'lib/helpers'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 import { AiIconAnimation } from 'ui'
 
 interface ReviewWithAIProps {
@@ -24,6 +26,7 @@ export const ReviewWithAI = ({
   disabled = false,
 }: ReviewWithAIProps) => {
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
   const { data: selectedOrg } = useSelectedOrganizationQuery()
   const { mutate: sendEvent } = useSendEventMutation()
 
@@ -75,9 +78,9 @@ export const ReviewWithAI = ({
       })
     }
 
+    openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
     aiSnap.newChat({
       name: `Review merge: ${currentBranch.name} → ${mainBranch.name}`,
-      open: true,
       sqlSnippets: sqlSnippets.length > 0 ? sqlSnippets : undefined,
       initialInput: `I want to run the attached database changes on my production database branch as part of a branch merge from "${currentBranch.name}" into "${mainBranch.name || 'main'}". I've included the current production database schema as extra context. Please analyze the proposed schema changes and provide concise feedback on their impact on the production schema including any migration concerns and potential conflicts.`,
       suggestions: {

apps/studio/components/interfaces/Database/Functions/FunctionsList/FunctionList.tsx

@@ -5,10 +5,12 @@ import Link from 'next/link'
 import { useRouter } from 'next/router'
 
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
 import { useDatabaseFunctionsQuery } from 'data/database-functions/database-functions-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
 import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 import {
   Button,
   DropdownMenu,
@@ -44,6 +46,7 @@ const FunctionList = ({
   const router = useRouter()
   const { data: selectedProject } = useSelectedProjectQuery()
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
 
   const { data: functions } = useDatabaseFunctionsQuery({
     projectRef: selectedProject?.ref,
@@ -168,9 +171,9 @@ const FunctionList = ({
                         <DropdownMenuItem
                           className="space-x-2"
                           onClick={() => {
+                            openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
                             aiSnap.newChat({
                               name: `Update function ${x.name}`,
-                              open: true,
                               initialInput: 'Update this function to do...',
                               suggestions: {
                                 title:

apps/studio/components/interfaces/Database/Functions/FunctionsList/FunctionsList.tsx

@@ -11,13 +11,15 @@ import AlertError from 'components/ui/AlertError'
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
 import SchemaSelector from 'components/ui/SchemaSelector'
 import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
 import { useDatabaseFunctionsQuery } from 'data/database-functions/database-functions-query'
 import { useSchemasQuery } from 'data/database/schemas-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
 import { useQuerySchemaState } from 'hooks/misc/useSchemaQueryState'
 import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
 import { useIsProtectedSchema } from 'hooks/useProtectedSchemas'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 import {
   AiIconAnimation,
   Card,
@@ -52,6 +54,7 @@ const FunctionsList = ({
   const { search } = useParams()
   const { data: project } = useSelectedProjectQuery()
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
   const { selectedSchema, setSelectedSchema } = useQuerySchemaState()
 
   const filterString = search ?? ''
@@ -200,13 +203,13 @@ const FunctionsList = ({
                     disabled={!canCreateFunctions}
                     className="px-1 pointer-events-auto"
                     icon={<AiIconAnimation size={16} />}
-                    onClick={() =>
+                    onClick={() => {
+                      openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
                       aiSnap.newChat({
                         name: 'Create new function',
-                        open: true,
                         initialInput: `Create a new function for the schema ${selectedSchema} that does ...`,
                       })
-                    }
+                    }}
                     tooltip={{
                       content: {
                         side: 'bottom',

apps/studio/components/interfaces/Database/Privileges/Privileges.utils.ts

@@ -300,14 +300,14 @@ export function useApplyPrivilegeOperations(callback?: () => void) {
         .map((op) => ({
           column_id: String(op.id),
           grantee: op.grantee,
-          privilege_type: op.privilege_type as ColumnPrivilegesRevoke[number]['privilege_type'],
+          privilege_type: op.privilege_type as ColumnPrivilegesRevoke['privilege_type'],
         }))
       const revokeColumnOperations = columnOperations
         .filter((op) => op.type === 'revoke')
         .map((op) => ({
           column_id: String(op.id),
           grantee: op.grantee,
-          privilege_type: op.privilege_type as ColumnPrivilegesRevoke[number]['privilege_type'],
+          privilege_type: op.privilege_type as ColumnPrivilegesRevoke['privilege_type'],
         }))
 
       // annoyingly these can't be run all at once

apps/studio/components/interfaces/Database/Triggers/TriggersList/TriggerList.tsx

@@ -3,10 +3,12 @@ import { includes, sortBy } from 'lodash'
 import { Check, Copy, Edit, Edit2, MoreVertical, Trash, X } from 'lucide-react'
 
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
 import { useDatabaseTriggersQuery } from 'data/database-triggers/database-triggers-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
 import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 import {
   Badge,
   Button,
@@ -43,6 +45,7 @@ const TriggerList = ({
 }: TriggerListProps) => {
   const { data: project } = useSelectedProjectQuery()
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
 
   const { data: triggers } = useDatabaseTriggersQuery({
     projectRef: project?.ref,
@@ -171,9 +174,9 @@ const TriggerList = ({
                         className="space-x-2"
                         onClick={() => {
                           const sql = generateTriggerCreateSQL(x)
+                          openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
                           aiSnap.newChat({
                             name: `Update trigger ${X.name}`,
-                            open: true,
                             initialInput: `Update this trigger which exists on the ${x.schema}.${x.table} table to...`,
                             suggestions: {
                               title:

apps/studio/components/interfaces/Database/Triggers/TriggersList/TriggersList.tsx

@@ -10,13 +10,15 @@ import AlertError from 'components/ui/AlertError'
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
 import SchemaSelector from 'components/ui/SchemaSelector'
 import { GenericSkeletonLoader } from 'components/ui/ShimmeringLoader'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
 import { useDatabaseTriggersQuery } from 'data/database-triggers/database-triggers-query'
 import { useTablesQuery } from 'data/tables/tables-query'
 import { useAsyncCheckPermissions } from 'hooks/misc/useCheckPermissions'
 import { useQuerySchemaState } from 'hooks/misc/useSchemaQueryState'
 import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject'
 import { useIsProtectedSchema, useProtectedSchemas } from 'hooks/useProtectedSchemas'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 import {
   AiIconAnimation,
   Button,
@@ -49,6 +51,7 @@ const TriggersList = ({
 }: TriggersListProps) => {
   const { data: project } = useSelectedProjectQuery()
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
   const { selectedSchema, setSelectedSchema } = useQuerySchemaState()
 
   const [filterString, setFilterString] = useQueryState(
@@ -138,10 +141,10 @@ const TriggersList = ({
                 disabled={!hasTables || !canCreateTriggers}
                 className="px-1 pointer-events-auto"
                 icon={<AiIconAnimation size={16} />}
-                onClick={() =>
+                onClick={() => {
+                  openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
                   aiSnap.newChat({
                     name: 'Create new trigger',
-                    open: true,
                     initialInput: `Create a new trigger for the schema ${selectedSchema} that does ...`,
                     suggestions: {
                       title:
@@ -162,7 +165,7 @@ const TriggersList = ({
                       ],
                     },
                   })
-                }
+                }}
                 tooltip={{
                   content: {
                     side: 'bottom',

apps/studio/components/interfaces/EdgeFunctions/DeployEdgeFunctionButton.tsx

@@ -19,13 +19,15 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from 'ui'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 
 export const DeployEdgeFunctionButton = () => {
   const router = useRouter()
   const { ref } = useParams()
   const { data: org } = useSelectedOrganizationQuery()
   const snap = useAiAssistantStateSnapshot()
-
+  const { openSidebar } = useSidebarManagerSnapshot()
   const { mutate: sendEvent } = useSendEventMutation()
 
   return (
@@ -85,9 +87,9 @@ export const DeployEdgeFunctionButton = () => {
         <DropdownMenuItem
           className="gap-4"
           onSelect={() => {
+            openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
             snap.newChat({
               name: 'Create new edge function',
-              open: true,
               initialInput: `Create a new edge function that ...`,
               suggestions: {
                 title:

apps/studio/components/interfaces/Functions/FunctionsEmptyState.tsx

@@ -8,11 +8,13 @@ import { ScaffoldSectionTitle } from 'components/layouts/Scaffold'
 import { DocsButton } from 'components/ui/DocsButton'
 import { ResourceItem } from 'components/ui/Resource/ResourceItem'
 import { ResourceList } from 'components/ui/Resource/ResourceList'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
 import { useSendEventMutation } from 'data/telemetry/send-event-mutation'
 import { useIsFeatureEnabled } from 'hooks/misc/useIsFeatureEnabled'
 import { useSelectedOrganizationQuery } from 'hooks/misc/useSelectedOrganization'
 import { DOCS_URL } from 'lib/constants'
 import { useAiAssistantStateSnapshot } from 'state/ai-assistant-state'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 import {
   AiIconAnimation,
   Button,
@@ -38,6 +40,7 @@ export const FunctionsEmptyState = () => {
   const { ref } = useParams()
   const router = useRouter()
   const aiSnap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
 
   const { mutate: sendEvent } = useSendEventMutation()
   const { data: org } = useSelectedOrganizationQuery()
@@ -95,9 +98,9 @@ export const FunctionsEmptyState = () => {
             <Button
               type="default"
               onClick={() => {
+                openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
                 aiSnap.newChat({
                   name: 'Create new edge function',
-                  open: true,
                   initialInput: 'Create a new edge function that ...',
                   suggestions: {
                     title:

apps/studio/components/interfaces/Home/AdvisorWidget.tsx

@@ -27,6 +27,8 @@ import {
   TabsTrigger_Shadcn_ as TabsTrigger,
 } from 'ui'
 import ShimmeringLoader from 'ui-patterns/ShimmeringLoader'
+import { SIDEBAR_KEYS } from 'components/layouts/ProjectLayout/LayoutSidebar/LayoutSidebarProvider'
+import { useSidebarManagerSnapshot } from 'state/sidebar-manager-state'
 
 interface SlowQuery {
   rolname: string
@@ -45,6 +47,7 @@ export const AdvisorWidget = () => {
     }
   )
   const snap = useAiAssistantStateSnapshot()
+  const { openSidebar } = useSidebarManagerSnapshot()
 
   const securityLints = useMemo(
     () => (lints ?? []).filter((lint: Lint) => lint.categories.includes('SECURITY')),
@@ -147,9 +150,9 @@ export const AdvisorWidget = () => {
                       onClick={(e) => {
                         e.stopPropagation()
                         e.preventDefault()
+                        openSidebar(SIDEBAR_KEYS.AI_ASSISTANT)
                         snap.newChat({
                           name: 'Summarize lint',
-                          open: true,
                           initialInput: `Summarize the issue and suggest fixes for the following lint item:
   Title: ${lintInfoMap.find((item) => item.name === lint.name)?.title ?? lint.title}
   Entity: ${(lint.metadata && (lint.metadata.entity || (lint.metadata.schema && lint.metadata.name && `${lint.metadata.schema}.${lint.metadata.name}`))) ?? 'N/A'}