URL was missing from some calendar formats

We now prepend it to the description for the formats in question.

Author: hartman

src/composables/__tests__/useCalendarLinks.test.ts

@@ -39,6 +39,28 @@ describe('useCalendarLinks', () => {
       })
       expect(googleUrl.value).toContain('Event')
     })
+
+    it('includes url in details when no description', () => {
+      const { googleUrl } = useCalendarLinks({
+        title: ref('Test Event'),
+        startTs: ref(START_TS),
+        endTs: ref(null),
+        url: ref('https://example.com'),
+      })
+      expect(googleUrl.value).toContain('example.com')
+    })
+
+    it('prepends url before description in details', () => {
+      const { googleUrl } = useCalendarLinks({
+        title: ref('Test Event'),
+        startTs: ref(START_TS),
+        endTs: ref(null),
+        description: ref('A description'),
+        url: ref('https://example.com'),
+      })
+      const details = new URL(googleUrl.value).searchParams.get('details')!
+      expect(details.indexOf('example.com')).toBeLessThan(details.indexOf('A description'))
+    })
   })
 
   describe('Outlook.com URL', () => {
@@ -82,6 +104,28 @@ describe('useCalendarLinks', () => {
       expect(outlookUrl.value).toContain('location=Amsterdam')
     })
 
+    it('includes url in body when no description', () => {
+      const { outlookUrl } = useCalendarLinks({
+        title: ref('Test Event'),
+        startTs: ref(START_TS),
+        endTs: ref(null),
+        url: ref('https://example.com'),
+      })
+      expect(outlookUrl.value).toContain('example.com')
+    })
+
+    it('prepends url before description in body', () => {
+      const { outlookUrl } = useCalendarLinks({
+        title: ref('Test Event'),
+        startTs: ref(START_TS),
+        endTs: ref(null),
+        description: ref('A description'),
+        url: ref('https://example.com'),
+      })
+      const body = new URL(outlookUrl.value).searchParams.get('body')!
+      expect(body.indexOf('example.com')).toBeLessThan(body.indexOf('A description'))
+    })
+
     it('points to outlook.live.com', () => {
       const { outlookUrl } = useCalendarLinks({
         title: ref('Test Event'),
@@ -114,6 +158,30 @@ describe('useCalendarLinks', () => {
     })
   })
 
+  describe('Yahoo Calendar URL', () => {
+    it('includes url in desc when no description', () => {
+      const { yahooUrl } = useCalendarLinks({
+        title: ref('Test Event'),
+        startTs: ref(START_TS),
+        endTs: ref(null),
+        url: ref('https://example.com'),
+      })
+      expect(yahooUrl.value).toContain('example.com')
+    })
+
+    it('prepends url before description in desc', () => {
+      const { yahooUrl } = useCalendarLinks({
+        title: ref('Test Event'),
+        startTs: ref(START_TS),
+        endTs: ref(null),
+        description: ref('A description'),
+        url: ref('https://example.com'),
+      })
+      const desc = new URL(yahooUrl.value).searchParams.get('desc')!
+      expect(desc.indexOf('example.com')).toBeLessThan(desc.indexOf('A description'))
+    })
+  })
+
   describe('ICS content', () => {
     it('contains VCALENDAR wrapper', () => {
       const { icsContent } = useCalendarLinks({
@@ -152,6 +220,30 @@ describe('useCalendarLinks', () => {
       expect(icsContent.value).toContain('SUMMARY:My Event')
     })
 
+    it('includes URL property when url is provided', () => {
+      const { icsContent } = useCalendarLinks({
+        title: ref('Test Event'),
+        startTs: ref(START_TS),
+        endTs: ref(null),
+        url: ref('https://example.com'),
+      })
+      expect(icsContent.value).toContain('URL:https://example.com')
+    })
+
+    it('does not duplicate url in DESCRIPTION when both are provided', () => {
+      const { icsContent } = useCalendarLinks({
+        title: ref('Test Event'),
+        startTs: ref(START_TS),
+        endTs: ref(null),
+        description: ref('A description'),
+        url: ref('https://example.com'),
+      })
+      expect(icsContent.value).toContain('URL:https://example.com')
+      expect(icsContent.value).toContain('DESCRIPTION:A description')
+      // url should appear exactly once (in URL: property, not also in DESCRIPTION)
+      expect(icsContent.value.split('example.com').length - 1).toBe(1)
+    })
+
     it('works across midnight (next-day end time)', () => {
       const { icsContent } = useCalendarLinks({
         title: ref('Late Event'),

src/composables/useCalendarLinks.ts

@@ -17,6 +17,12 @@ function toUtcIso(date: Date): string {
   return date.toISOString().replace(/\.\d{3}/, '')
 }
 
+// Google/Yahoo/Outlook have no dedicated URL field — prepend it before the description.
+function descriptionWithUrl(description?: string, url?: string): string | undefined {
+  if (!url) return description || undefined
+  return description ? `${url}\n\n${description}` : url
+}
+
 function outlookUrl(params: URLSearchParams, base: string): string {
   return `${base}?${params.toString()}`
 }
@@ -27,6 +33,7 @@ function buildOutlookParams(
   title: string,
   description?: string,
   location?: string,
+  url?: string,
 ): URLSearchParams {
   const p = new URLSearchParams({
     path: '/calendar/action/compose',
@@ -36,39 +43,56 @@ function buildOutlookParams(
     subject: title,
     allday: 'false',
   })
-  if (description) p.set('body', description)
+  const body = descriptionWithUrl(description, url)
+  if (body) p.set('body', body)
   if (location) p.set('location', location)
   return p
 }
 
 export function useCalendarLinks(opts: CalendarLinkOptions) {
   const startDate = computed(() => new Date(opts.startTs.value * 1000))
 
-  const event = computed((): CalendarEvent => ({
+  const timingFields = computed(() =>
+    opts.endTs.value !== null
+      ? { end: new Date(opts.endTs.value * 1000) }
+      : { duration: [1, 'hour'] as [number, 'hour'] },
+  )
+
+  // ICS has a native URL property — keep url as a separate field.
+  const icsEvent = computed((): CalendarEvent => ({
     title: opts.title.value || 'Event',
     start: startDate.value,
-    ...(opts.endTs.value !== null
-      ? { end: new Date(opts.endTs.value * 1000) }
-      : { duration: [1, 'hour'] as [number, 'hour'] }),
+    ...timingFields.value,
     ...(opts.description?.value ? { description: opts.description.value } : {}),
     ...(opts.location?.value ? { location: opts.location.value } : {}),
     ...(opts.url?.value ? { url: opts.url.value } : {}),
   }))
 
+  // Google/Yahoo have no dedicated URL field — append it to description.
+  const webEvent = computed((): CalendarEvent => ({
+    title: opts.title.value || 'Event',
+    start: startDate.value,
+    ...timingFields.value,
+    ...(descriptionWithUrl(opts.description?.value, opts.url?.value)
+      ? { description: descriptionWithUrl(opts.description?.value, opts.url?.value) }
+      : {}),
+    ...(opts.location?.value ? { location: opts.location.value } : {}),
+  }))
+
   const endDate = computed(() =>
     opts.endTs.value !== null
       ? new Date(opts.endTs.value * 1000)
       : new Date(opts.startTs.value * 1000 + 3600_000),
   )
 
-  const googleUrl = computed(() => google(event.value))
-  const yahooUrl = computed(() => yahoo(event.value))
+  const googleUrl = computed(() => google(webEvent.value))
+  const yahooUrl = computed(() => yahoo(webEvent.value))
 
   // ics() returns a data URI — decode it to get the raw ICS string so the
   // component can create a Blob URL, which browsers open in Calendar.app
   // rather than rendering as text.
   const icsContent = computed(() => {
-    const dataUri = ics(event.value)
+    const dataUri = ics(icsEvent.value)
     return decodeURIComponent(dataUri.replace('data:text/calendar;charset=utf8,', ''))
   })
 
@@ -79,6 +103,7 @@ export function useCalendarLinks(opts: CalendarLinkOptions) {
       opts.title.value || 'Event',
       opts.description?.value,
       opts.location?.value,
+      opts.url?.value,
     ),
   )