chore: entitlement audit logs (supabase#40022)

Author: ignaciodob

apps/studio/components/interfaces/Settings/Logs/Logs.utils.ts

@@ -291,6 +291,19 @@ export const maybeShowUpgradePrompt = (from: string | null | undefined, planId?:
   )
 }
 
+/**
+ * Determine if we should show the user an upgrade prompt while browsing logs
+ * This method should replace maybeShowUpgradePrompt once we have migrated all usage to the Entitlements API.
+ */
+export const maybeShowUpgradePromptIfNotEntitled = (
+  from: string | null | undefined,
+  entitledToDays: number | undefined
+) => {
+  if (!entitledToDays) return false
+  const day = Math.abs(dayjs().diff(dayjs(from), 'day'))
+  return day > entitledToDays
+}
+
 export const genCountQuery = (table: LogsTableName, filters: Filters): string => {
   let where = genWhereStatement(table, filters)
   // pg_cron logs are a subset of postgres logs

apps/studio/components/interfaces/Settings/Logs/LogsPreviewer.tsx

@@ -26,9 +26,10 @@ import {
   PREVIEWER_DATEPICKER_HELPERS,
 } from './Logs.constants'
 import type { Filters, LogSearchCallback, LogTemplate, QueryType } from './Logs.types'
-import { maybeShowUpgradePrompt } from './Logs.utils'
+import { maybeShowUpgradePromptIfNotEntitled } from './Logs.utils'
 import { PreviewFilterPanelWithUniversal } from './PreviewFilterPanelWithUniversal'
 import UpgradePrompt from './UpgradePrompt'
+import { useCheckEntitlements } from 'hooks/misc/useCheckEntitlements'
 
 /**
  * Calculates the appropriate time range for bar click filtering based on the current time range duration.
@@ -206,15 +207,20 @@ export const LogsPreviewer = ({
     refresh()
   }
 
+  const { getEntitlementNumericValue } = useCheckEntitlements('log.retention_days')
+  const entitledToAuditLogDays = getEntitlementNumericValue()
+
   const handleSearch: LogSearchCallback = async (event, { query, to, from }) => {
     if (event === 'search-input-change') {
       setSearch(query || '')
       setSelectedLogId(null)
     } else if (event === 'event-chart-bar-click') {
       setTimeRange(from || '', to || '')
     } else if (event === 'datepicker-change') {
-      const shouldShowUpgradePrompt = maybeShowUpgradePrompt(from || '', organization?.plan?.id)
-
+      const shouldShowUpgradePrompt = maybeShowUpgradePromptIfNotEntitled(
+        from || '',
+        entitledToAuditLogDays
+      )
       if (shouldShowUpgradePrompt) {
         setShowUpgradePrompt(!showUpgradePrompt)
       } else {
@@ -226,7 +232,10 @@ export const LogsPreviewer = ({
   // Show the prompt on page load based on query params
   useEffect(() => {
     if (timestampStart) {
-      const shouldShowUpgradePrompt = maybeShowUpgradePrompt(timestampStart, organization?.plan?.id)
+      const shouldShowUpgradePrompt = maybeShowUpgradePromptIfNotEntitled(
+        timestampStart,
+        entitledToAuditLogDays
+      )
       if (shouldShowUpgradePrompt) {
         setShowUpgradePrompt(!showUpgradePrompt)
       }

apps/studio/hooks/misc/useUpgradePrompt.tsx

@@ -1,12 +1,13 @@
-import { maybeShowUpgradePrompt } from 'components/interfaces/Settings/Logs/Logs.utils'
+import { maybeShowUpgradePromptIfNotEntitled } from 'components/interfaces/Settings/Logs/Logs.utils'
 import { useEffect, useState } from 'react'
-import { useSelectedOrganizationQuery } from './useSelectedOrganization'
+import { useCheckEntitlements } from './useCheckEntitlements'
 
 export const useUpgradePrompt = (from: string) => {
-  const { data: organization } = useSelectedOrganizationQuery()
   const [showUpgradePrompt, setShowUpgradePrompt] = useState(false)
+  const { getEntitlementNumericValue } = useCheckEntitlements('log.retention_days')
+  const entitledToAuditLogDays = getEntitlementNumericValue()
 
-  const shouldShowUpgradePrompt = maybeShowUpgradePrompt(from, organization?.plan?.id)
+  const shouldShowUpgradePrompt = maybeShowUpgradePromptIfNotEntitled(from, entitledToAuditLogDays)
 
   useEffect(() => {
     if (shouldShowUpgradePrompt) {

apps/studio/pages/project/[ref]/logs/explorer/index.tsx

@@ -18,7 +18,7 @@ import {
   LogsWarning,
 } from 'components/interfaces/Settings/Logs/Logs.types'
 import {
-  maybeShowUpgradePrompt,
+  maybeShowUpgradePromptIfNotEntitled,
   useEditorHints,
 } from 'components/interfaces/Settings/Logs/Logs.utils'
 import LogsQueryPanel from 'components/interfaces/Settings/Logs/LogsQueryPanel'
@@ -52,6 +52,7 @@ import {
   ResizablePanel,
   ResizablePanelGroup,
 } from 'ui'
+import { useCheckEntitlements } from 'hooks/misc/useCheckEntitlements'
 
 const LOCAL_PLACEHOLDER_QUERY =
   'select\n  timestamp, event_message, metadata\n  from edge_logs limit 5'
@@ -66,7 +67,6 @@ export const LogsExplorerPage: NextPageWithLayout = () => {
   const { profile } = useProfile()
   const { ref, q, queryId } = useParams()
   const projectRef = ref as string
-  const { data: organization } = useSelectedOrganizationQuery()
   const { logsShowMetadataIpTemplate } = useIsFeatureEnabled(['logs:show_metadata_ip_template'])
 
   const allTemplates = useMemo(() => {
@@ -93,6 +93,9 @@ export const LogsExplorerPage: NextPageWithLayout = () => {
     []
   )
 
+  const { getEntitlementNumericValue } = useCheckEntitlements('log.retention_days')
+  const entitledToAuditLogDays = getEntitlementNumericValue()
+
   const { data: content } = useContentQuery({
     projectRef: ref,
     type: 'log_sql',
@@ -253,7 +256,10 @@ export const LogsExplorerPage: NextPageWithLayout = () => {
   }
 
   const handleDateChange = ({ to, from }: DatePickerToFrom) => {
-    const shouldShowUpgradePrompt = maybeShowUpgradePrompt(from, organization?.plan?.id)
+    const shouldShowUpgradePrompt = maybeShowUpgradePromptIfNotEntitled(
+      from,
+      entitledToAuditLogDays
+    )
 
     if (shouldShowUpgradePrompt) {
       setShowUpgradePrompt(!showUpgradePrompt)
@@ -288,12 +294,15 @@ export const LogsExplorerPage: NextPageWithLayout = () => {
   // Show the prompt on page load based on query params
   useEffect(() => {
     if (timestampStart) {
-      const shouldShowUpgradePrompt = maybeShowUpgradePrompt(timestampStart, organization?.plan?.id)
+      const shouldShowUpgradePrompt = maybeShowUpgradePromptIfNotEntitled(
+        timestampStart,
+        entitledToAuditLogDays
+      )
       if (shouldShowUpgradePrompt) {
         setShowUpgradePrompt(!showUpgradePrompt)
       }
     }
-  }, [timestampStart, organization])
+  }, [timestampStart, entitledToAuditLogDays])
 
   return (
     <div className="w-full h-full mx-auto">