fix(studio): support pg_cron $ syntax for last day of month in schedule parsing (supabase#42340)

Bug fix

## What is the current behavior?
Cron jobs using pg_cron's `$` syntax (representing 'last day of month')
show 'Unable to parse next run for job' in the dashboard's Next run
column, even though these are valid pg_cron schedules.

## What is the new behavior?
The dashboard now correctly parses schedules using `$` and displays the
proper next run time.

## Root Cause
pg_cron uses `$` for 'last day of month', but the `cron-parser` library
used by Studio uses `L` for the same purpose. The `$` character was
causing the parsing to fail.

## Fix
Normalize pg_cron's `$` syntax to cron-parser's `L` syntax before
parsing. Both represent 'last day of month' - it's just a syntax
difference between the two systems.

Fixes supabase#42176

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Bug Fixes**
* Improved cron job scheduling to correctly calculate next-run times for
pg_cron-compatible schedule expressions.

---------

Co-authored-by: Charis <26616127+charislam@users.noreply.github.com>

Author: jonathan-fulton

apps/studio/components/interfaces/Integrations/CronJobs/CreateCronJobSheet/CreateCronJobSheet.constants.ts

@@ -6,9 +6,10 @@ import { httpEndpointUrlSchema } from '@/lib/validation/http-url'
 
 const convertCronToString = (schedule: string) => {
   // pg_cron can also use "30 seconds" format for schedule. Cronstrue doesn't understand that format so just use the
-  // original schedule when cronstrue throws
+  // original schedule when cronstrue throws.
+  // pg_cron uses '$' for "last day of month"; cronstrue uses 'L' — normalize before parsing.
   try {
-    return CronToString(schedule)
+    return CronToString(schedule.replace(/\$/g, 'L'))
   } catch (error) {
     return schedule
   }

apps/studio/components/interfaces/Integrations/CronJobs/CronJobPage.tsx

@@ -70,7 +70,7 @@ export const CronJobPage = () => {
           <span className="cursor-pointer underline decoration-dotted lowercase">
             {isSecondsFormat(job.schedule)
               ? job.schedule.toLowerCase()
-              : CronToString(job.schedule.toLowerCase())}
+              : CronToString(job.schedule.toLowerCase().replace(/\$/g, 'L'))}
           </span>
         </TooltipTrigger>
         <TooltipContent side="bottom" align="center">

apps/studio/components/interfaces/Integrations/CronJobs/CronJobTableCell.tsx

@@ -46,9 +46,12 @@ const getNextRun = (schedule: string, lastRun?: string) => {
   // cron-parser can only deal with the traditional cron syntax but technically users can also
   // use strings like "30 seconds" now, For the latter case, we try our best to parse the next run
   // (can't guarantee as scope is quite big)
-  if (schedule.includes('*')) {
+  if (schedule.includes('*') || schedule.includes('$')) {
     try {
-      const interval = parser.parseExpression(schedule, { tz: 'UTC' })
+      // pg_cron uses '$' for "last day of month", but cron-parser uses 'L'
+      // Convert pg_cron syntax to cron-parser syntax before parsing
+      const normalizedSchedule = schedule.replace(/\$/g, 'L')
+      const interval = parser.parseExpression(normalizedSchedule, { tz: 'UTC' })
       return interval.next().getTime()
     } catch (error) {
       return undefined
@@ -89,7 +92,6 @@ export const CronJobTableCell = ({
   const [showToggleModal, setShowToggleModal] = useState(false)
 
   const value = row?.[col.id]
-  const hasValue = col.id in row
   const { jobid, schedule, latest_run, status, active, jobname } = row
 
   const formattedValue =
@@ -103,6 +105,8 @@ export const CronJobTableCell = ({
           ? getNextRun(schedule, latest_run)
           : value
 
+  const hasValue = col.id === 'next_run' ? !!formattedValue : col.id in row
+
   const { mutate: runCronJob, isPending: isRunning } = useDatabaseCronJobRunCommandMutation({
     onSuccess: () => {
       toast.success(`Command from "${jobname}" ran successfully`)

apps/studio/components/interfaces/Integrations/CronJobs/CronJobs.constants.tsx

@@ -1,8 +1,11 @@
 import { EdgeFunctions, RESTApi, SqlEditor } from 'icons'
 import { ScrollText } from 'lucide-react'
 
-export const cronPattern =
-  /^(\*|(\d+|\*\/\d+)|\d+\/\d+|\d+-\d+|\d+(,\d+)*)(\s+(\*|(\d+|\*\/\d+)|\d+\/\d+|\d+-\d+|\d+(,\d+)*)){4}$/
+const cronField = /(\*|(\d+|\*\/\d+)|\d+\/\d+|\d+-\d+|\d+(,\d+)*)/
+const cronDayOfMonth = /(\*|\$|(\d+|\*\/\d+)|\d+\/\d+|\d+-\d+|\d+(,\d+)*)/
+export const cronPattern = new RegExp(
+  `^${cronField.source}\\s+${cronField.source}\\s+${cronDayOfMonth.source}\\s+${cronField.source}\\s+${cronField.source}$`
+)
 
 // detect seconds like "10 seconds" or normal cron syntax like "*/5 * * * *"
 export const secondsPattern = /^\d+\s+seconds*$/

apps/studio/components/interfaces/Integrations/CronJobs/CronJobs.utils.test.ts

@@ -270,8 +270,23 @@ describe('parseCronJobCommand', () => {
     { description: 'every weekend at 10 AM', command: '0 10 * * 0,6' },
     { description: 'every quarter hour', command: '*/15 * * * *' },
     { description: 'twice daily at 8 AM and 8 PM', command: '0 8,20 * * *' },
+    { description: 'last day of every month at midnight (pg_cron $ syntax)', command: '0 0 $ * *' },
+    { description: 'last day of every month at noon (pg_cron $ syntax)', command: '0 12 $ * *' },
   ]
 
+  const cronPatternRejectTests = [
+    { description: '$ in minute field', command: '$ * * * *' },
+    { description: '$ in hour field', command: '* $ * * *' },
+    { description: '$ in month field', command: '* * * $ *' },
+    { description: '$ in day-of-week field', command: '* * * * $' },
+  ]
+
+  cronPatternRejectTests.forEach(({ description, command }) => {
+    it(`should not match the regex for a cronPattern with "${description}"`, () => {
+      expect(command).not.toMatch(cronPattern)
+    })
+  })
+
   // Replace the single cronPattern test with forEach
   cronPatternTests.forEach(({ description, command }) => {
     it(`should match the regex for a cronPattern with "${description}"`, () => {