feat(new tools): iCal Generator/Merger/Parser

iCal file generator, merger and parser

src/tools/ical-merger/ical-merger.service.test.ts

@@ -0,0 +1,82 @@
+import { describe, expect, it } from 'vitest';
+import { mergeIcals } from './ical-merger.service';
+
+describe('ical-merger', () => {
+  describe('mergeIcals', () => {
+    it('merge correctly', () => {
+      expect(mergeIcals([
+`BEGIN:VCALENDAR
+PRODID:-//xyz Corp//NONSGML PDA Calendar Version 1.0//EN
+VERSION:2.0
+BEGIN:VEVENT
+DTSTAMP:19960704T120000Z
+UID:uid1@example.com
+ORGANIZER:mailto:jsmith@example.com
+DTSTART:19960918T143000Z
+DTEND:19960920T220000Z
+STATUS:CONFIRMED
+CATEGORIES:CONFERENCE
+SUMMARY:Networld+Interop Conference
+DESCRIPTION:Networld+Interop Conference
+  and Exhibit\\nAtlanta World Congress Center\\n
+ Atlanta\\, Georgia
+END:VEVENT
+END:VCALENDAR`,
+ `BEGIN:VCALENDAR
+METHOD:xyz
+VERSION:2.0
+PRODID:-//ABC Corporation//NONSGML My Product//EN
+BEGIN:VEVENT
+DTSTAMP:19970324T120000Z
+SEQUENCE:0
+UID:uid3@example.com
+ORGANIZER:mailto:jdoe@example.com
+ATTENDEE;RSVP=TRUE:mailto:jsmith@example.com
+DTSTART:19970324T123000Z
+DTEND:19970324T210000Z
+CATEGORIES:MEETING,PROJECT
+CLASS:PUBLIC
+SUMMARY:Calendaring Interoperability Planning Meeting
+DESCRIPTION:Discuss how we can test c&s interoperability\\n
+ using iCalendar and other IETF standards.
+LOCATION:LDB Lobby
+ATTACH;FMTTYPE=application/postscript:ftp://example.com/pub/
+ conf/bkgrnd.ps
+END:VEVENT
+END:VCALENDAR`,
+      ])).to.eq(
+`BEGIN:VCALENDAR
+PRODID:it-tools-ical-merger
+VERSION:1.0
+BEGIN:VEVENT
+DTSTAMP:19960704T120000Z
+UID:uid1@example.com
+ORGANIZER:mailto:jsmith@example.com
+DTSTART:19960918T143000Z
+DTEND:19960920T220000Z
+STATUS:CONFIRMED
+CATEGORIES:CONFERENCE
+SUMMARY:Networld+Interop Conference
+DESCRIPTION:Networld+Interop Conference and Exhibit\\nAtlanta World Congress
+  Center\\nAtlanta\\, Georgia
+END:VEVENT
+BEGIN:VEVENT
+DTSTAMP:19970324T120000Z
+SEQUENCE:0
+UID:uid3@example.com
+ORGANIZER:mailto:jdoe@example.com
+ATTENDEE;RSVP=TRUE:mailto:jsmith@example.com
+DTSTART:19970324T123000Z
+DTEND:19970324T210000Z
+CATEGORIES:MEETING,PROJECT
+CLASS:PUBLIC
+SUMMARY:Calendaring Interoperability Planning Meeting
+DESCRIPTION:Discuss how we can test c&s interoperability\\nusing iCalendar a
+ nd other IETF standards.
+LOCATION:LDB Lobby
+ATTACH;FMTTYPE=application/postscript:ftp://example.com/pub/conf/bkgrnd.ps
+END:VEVENT
+END:VCALENDAR`.replace(/\n/g, '\r\n'));
+    });
+  });
+});

src/tools/ical-merger/ical-merger.service.ts

@@ -0,0 +1,45 @@
+import ICAL from 'ical.js';
+
+export function mergeIcals(inputs: Array<string>, options: {
+  calname?: string
+  timezone?: string
+  caldesc?: string
+} = {}) {
+  let calendar;
+  for (const input of inputs) {
+    try {
+      const jcal = ICAL.parse(input);
+      const cal = new ICAL.Component(jcal);
+
+      if (!calendar) {
+        calendar = cal;
+        calendar.updatePropertyWithValue('prodid', 'it-tools-ical-merger');
+        calendar.updatePropertyWithValue('version', '1.0');
+
+        if (options.calname) {
+          calendar.updatePropertyWithValue('x-wr-calname', options.calname);
+        }
+        if (options.timezone) {
+          calendar.updatePropertyWithValue('x-wr-timezone', options.timezone);
+        }
+        if (options.caldesc) {
+          calendar.updatePropertyWithValue('x-wr-caldesc', options.caldesc);
+        }
+      }
+      else {
+        for (const vevent of cal.getAllSubcomponents('vevent')) {
+          calendar.addSubcomponent(vevent);
+        }
+      }
+    }
+    catch (e) {
+      throw new Error(`Failed to merge: ${e}\n\nWith input: ${input}`);
+    }
+  }
+
+  if (!calendar) {
+    throw new Error('No icals parsed successfully');
+  }
+
+  return calendar.toString();
+}

src/tools/ical-merger/ical-merger.vue

@@ -0,0 +1,96 @@
+<script setup lang="ts">
+import { mergeIcals } from './ical-merger.service';
+
+const fileInputs = ref<Array<File>>([]);
+const mergedOutput = ref('');
+const calendarName = ref('');
+const calendarDescription = ref('');
+const errors = ref('');
+
+function onUploads(files: Array<File>) {
+  fileInputs.value = [...fileInputs.value, ...files];
+}
+function deleteFile(index: number) {
+  fileInputs.value.splice(index, 1);
+}
+async function mergeFiles() {
+  const fileBuffers: Array<string> = [];
+  for (const file of fileInputs.value) {
+    fileBuffers.push(await readFileAsString(file));
+  }
+  errors.value = '';
+  mergedOutput.value = '';
+  try {
+    mergedOutput.value = mergeIcals(fileBuffers);
+  }
+  catch (e: any) {
+    errors.value = e.toString();
+  }
+}
+
+function readFileAsString(file: File) {
+  return new Promise<string>((resolve, reject) => {
+    const fr = new FileReader();
+    fr.onload = () => {
+      resolve(fr.result as string || '');
+    };
+    fr.onerror = reject;
+    fr.readAsText(file);
+  });
+}
+</script>
+
+<template>
+  <div>
+    <c-file-upload
+      title="Drag and drop iCal file here, or click to select a file"
+      multiple
+      mb-2
+      @files-upload="onUploads"
+    />
+
+    <n-form-item label="Title:" label-placement="left">
+      <n-input v-model:value="calendarName" placeholder="Please input merge calendar title..." />
+    </n-form-item>
+
+    <n-form-item label="Description:">
+      <n-input v-model:value="calendarDescription" placeholder="Please input merged calendar description..." />
+    </n-form-item>
+
+    <ul>
+      <li v-for="(file, index) in fileInputs" :key="index" mb-1>
+        <n-button mr-2 @click="deleteFile(index)">
+          Delete
+        </n-button>
+        File to merge: {{ file.name }}
+      </li>
+    </ul>
+
+    <div flex justify-center>
+      <n-button @click="mergeFiles">
+        Merge iCal files
+      </n-button>
+    </div>
+
+    <n-divider />
+
+    <c-alert v-if="errors" mb-2>
+      {{ errors }}
+    </c-alert>
+
+    <textarea-copyable
+      v-if="mergedOutput"
+      v-model:value="mergedOutput"
+      download-file-name="merge.ics"
+      download-button-text="Download merged iCal"
+      label="Merged ICAL"
+      mb-2
+    />
+  </div>
+</template>
+
+<style lang="less" scoped>
+::v-deep(.n-upload-trigger) {
+  width: 100%;
+}
+</style>

src/tools/ical-merger/index.ts

@@ -0,0 +1,12 @@
+import { CalendarPlus } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'iCal Merger',
+  path: '/ical-merger',
+  description: 'Merge many iCal file to a single',
+  keywords: ['ical', 'ics', 'merger'],
+  component: () => import('./ical-merger.vue'),
+  icon: CalendarPlus,
+  createdAt: new Date('2024-08-15'),
+});