Invalidate lints when creating or deleting policies

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

@@ -1,4 +1,5 @@
 import type { PostgresPolicy } from '@supabase/postgres-meta'
+import { useQueryClient } from '@tanstack/react-query'
 import { isEmpty } from 'lodash'
 import { HelpCircle } from 'lucide-react'
 import { useRouter } from 'next/router'
@@ -16,6 +17,7 @@ import NoSearchResults from 'components/to-be-cleaned/NoSearchResults'
 import ProductEmptyState from 'components/to-be-cleaned/ProductEmptyState'
 import InformationBox from 'components/ui/InformationBox'
 import { useDatabasePolicyDeleteMutation } from 'data/database-policies/database-policy-delete-mutation'
+import { lintKeys } from 'data/lint/keys'
 import { useTableUpdateMutation } from 'data/tables/table-update-mutation'
 import ConfirmModal from 'ui-patterns/Dialogs/ConfirmDialog'
 
@@ -38,6 +40,7 @@ const Policies = ({
 }: PoliciesProps) => {
   const router = useRouter()
   const { ref } = useParams()
+  const queryClient = useQueryClient()
   const { project } = useProjectContext()
 
   const [selectedTableToToggleRLS, setSelectedTableToToggleRLS] = useState<{
@@ -57,8 +60,9 @@ const Policies = ({
     },
   })
   const { mutate: deleteDatabasePolicy } = useDatabasePolicyDeleteMutation({
-    onSuccess: () => {
+    onSuccess: async () => {
       toast.success('Successfully deleted policy!')
+      await queryClient.invalidateQueries(lintKeys.lint(ref))
     },
     onSettled: () => {
       closeConfirmModal()

apps/studio/components/interfaces/Auth/Policies/PolicyEditorPanel/index.tsx

@@ -14,6 +14,7 @@ import { IStandaloneCodeEditor } from 'components/interfaces/SQLEditor/SQLEditor
 import { ButtonTooltip } from 'components/ui/ButtonTooltip'
 import { useDatabasePolicyUpdateMutation } from 'data/database-policies/database-policy-update-mutation'
 import { databasePoliciesKeys } from 'data/database-policies/keys'
+import { lintKeys } from 'data/lint/keys'
 import { QueryResponseError, useExecuteSqlMutation } from 'data/sql/execute-sql-mutation'
 import { useCheckPermissions } from 'hooks/misc/useCheckPermissions'
 import { useSelectedProject } from 'hooks/misc/useSelectedProject'
@@ -33,9 +34,9 @@ import {
   cn,
 } from 'ui'
 import ConfirmationModal from 'ui-patterns/Dialogs/ConfirmationModal'
-import { checkIfPolicyHasChanged, generateCreatePolicyQuery } from './PolicyEditorPanel.utils'
 import { LockedCreateQuerySection, LockedRenameQuerySection } from './LockedQuerySection'
 import { PolicyDetailsV2 } from './PolicyDetailsV2'
+import { checkIfPolicyHasChanged, generateCreatePolicyQuery } from './PolicyEditorPanel.utils'
 import { PolicyEditorPanelHeader } from './PolicyEditorPanelHeader'
 import { PolicyTemplates } from './PolicyTemplates'
 import { QueryError } from './QueryError'
@@ -122,7 +123,10 @@ export const PolicyEditorPanel = memo(function ({
   const { mutate: executeMutation, isLoading: isExecuting } = useExecuteSqlMutation({
     onSuccess: async () => {
       // refresh all policies
-      await queryClient.invalidateQueries(databasePoliciesKeys.list(ref))
+      await Promise.all([
+        queryClient.invalidateQueries(databasePoliciesKeys.list(ref)),
+        queryClient.invalidateQueries(lintKeys.lint(ref)),
+      ])
       toast.success('Successfully created new policy')
       onSelectCancel()
     },

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

@@ -78,7 +78,12 @@ export const PolicyTableRow = ({
             policies.length === 0 ? '' : 'border-b'
           )}
         >
-          <div className="w-1.5 h-1.5 bg-warning-600 rounded-full" />
+          <div
+            className={cn(
+              'w-1.5 h-1.5 rounded-full',
+              rlsLint.level === 'ERROR' ? 'bg-warning-600' : 'bg-selection'
+            )}
+          />
           <span className={cn('font-bold', rlsLint.level === 'ERROR' ? 'text-warning-600' : '')}>
             {rlsLint.level === 'ERROR' ? 'Warning' : 'Note'}:
           </span>{' '}