feat: add support for custom interval. closes #12

package.json

@@ -50,6 +50,8 @@
     "@trpc/server": "^10.0.0-proxy-beta.23",
     "bullmq": "^2.3.2",
     "contrast-color": "^1.0.1",
+    "cron-parser": "^4.6.0",
+    "cronstrue": "^2.14.0",
     "dayjs": "^1.11.5",
     "execa": "5.1.1",
     "express": "^4.18.2",

prisma/migrations/20221027101522_fix_intervals/migration.sql

@@ -0,0 +1,3 @@
+update "Manga" set interval = '0 0 * * *' where interval = 'daily';
+update "Manga" set interval = '0 * * * *' where interval = 'hourly';
+update "Manga" set interval = '0 0 * * 7' where interval = 'weekly';

src/components/addManga/form.tsx

@@ -4,6 +4,7 @@ import { showNotification } from '@mantine/notifications';
 import { IconCheck, IconX } from '@tabler/icons';
 import { useState } from 'react';
 import { z } from 'zod';
+import { isCronValid } from '../../utils';
 import { trpc } from '../../utils/trpc';
 import AddMangaSteps from './steps';
 
@@ -28,7 +29,14 @@ const schema = z.object({
   source: z.string().min(1, { message: 'You must select a source' }),
   query: z.string().min(1, { message: 'Cannot be empty' }),
   mangaTitle: z.string().min(1, { message: 'Please select a manga' }),
-  interval: z.string().min(1, { message: 'Please select an interval' }),
+  interval: z
+    .string({
+      invalid_type_error: 'Invalid interval',
+    })
+    .min(1, { message: 'Please select an interval' })
+    .refine((value) => isCronValid(value), {
+      message: 'Invalid interval',
+    }),
 });
 
 export type FormType = z.TypeOf<typeof schema>;
@@ -96,6 +104,9 @@ export function AddMangaForm({ onClose }: { onClose: () => void }) {
   };
 
   const onSubmit = form.onSubmit(async (values) => {
+    if (active !== 3) {
+      return;
+    }
     setVisible((v) => !v);
     const { mangaTitle, source, interval } = values;
     try {

src/components/addManga/steps/downloadStep.tsx

@@ -1,19 +1,22 @@
 import { Box, LoadingOverlay, Select, Stack, TextInput } from '@mantine/core';
 import { UseFormReturnType } from '@mantine/form';
 import { IconFolderPlus } from '@tabler/icons';
-import { sanitizer } from '../../../utils/sanitize';
+import { useState } from 'react';
+import { getCronLabel, isCronValid, sanitizer } from '../../../utils';
 import { trpc } from '../../../utils/trpc';
 import type { FormType } from '../form';
 
-const availableIntervals = ['daily', 'hourly', 'weekly'];
-
 export function DownloadStep({ form }: { form: UseFormReturnType<FormType> }) {
+  const [data, setData] = useState(
+    ['0 0 * * *', '0 * * * *', '0 0 * * 7', 'never'].map((value) => ({
+      label: getCronLabel(value),
+      value,
+    })),
+  );
   const libraryQuery = trpc.library.query.useQuery();
 
   const libraryPath = libraryQuery.data?.path;
 
-  const intervalSelectData = availableIntervals.map((k) => ({ label: k, value: k }));
-
   if (libraryQuery.isLoading) {
     return <LoadingOverlay visible />;
   }
@@ -25,10 +28,29 @@ export function DownloadStep({ form }: { form: UseFormReturnType<FormType> }) {
       <Stack>
         <Select
           data-autofocus
+          searchable
+          clearable
+          creatable
           size="sm"
-          data={intervalSelectData}
+          data={data}
           label="Download Interval"
-          placeholder="Select an interval"
+          placeholder="Select or create an interval"
+          getCreateLabel={(query) => {
+            if (isCronValid(query)) {
+              return `+ Download ${getCronLabel(query)}`;
+            }
+
+            return `+ Create ${query}`;
+          }}
+          onCreate={(query) => {
+            if (!isCronValid(query)) {
+              form.setFieldError('interval', 'Invalid interval');
+              return null;
+            }
+            const item = { value: query, label: getCronLabel(query) };
+            setData((current) => [...current.filter((i) => i.value !== query), item]);
+            return item;
+          }}
           {...form.getInputProps('interval')}
         />
         <TextInput

src/components/addManga/steps/index.tsx

@@ -1,6 +1,7 @@
 import { createStyles, Stepper } from '@mantine/core';
 import { UseFormReturnType } from '@mantine/form';
 import { Dispatch, SetStateAction } from 'react';
+import { getCronLabel } from '../../../utils';
 import type { FormType } from '../form';
 import { DownloadStep } from './downloadStep';
 import { ReviewStep } from './reviewStep';
@@ -65,7 +66,7 @@ export default function AddMangaSteps({
       </Stepper.Step>
       <Stepper.Step
         label="Download"
-        description={form.values.interval || 'Select an interval'}
+        description={form.values.interval ? getCronLabel(form.values.interval) : 'Select an interval'}
         allowStepSelect={false}
         color={active > 2 ? 'teal' : 'blue'}
       >

src/components/mangaDetail.tsx

@@ -4,6 +4,7 @@ import { Prisma } from '@prisma/client';
 import { IconExternalLink } from '@tabler/icons';
 import { contrastColor } from 'contrast-color';
 import stc from 'string-to-color';
+import { getCronLabel } from '../utils';
 
 const useStyles = createStyles((theme) => ({
   root: {
@@ -108,14 +109,8 @@ export function MangaDetail({ manga }: { manga: MangaWithMetadataAndChapters })
             })}
           >
             Checking{' '}
-            <Badge
-              component="span"
-              color="cyan"
-              variant="filled"
-              size="xs"
-              sx={{ backgroundColor: stc(manga.interval), color: contrastColor({ bgColor: stc(manga.interval) }) }}
-            >
-              {manga.interval}
+            <Badge component="span" color="blue" variant="filled" size="xs">
+              {getCronLabel(manga.interval)}
             </Badge>{' '}
             from{' '}
             <Badge

src/server/queue/checkChapters.ts

@@ -2,18 +2,11 @@ import { Prisma } from '@prisma/client';
 import { Job, Queue, Worker } from 'bullmq';
 import path from 'path';
 import { logger } from '../../utils/logging';
-import { sanitizer } from '../../utils/sanitize';
+import { sanitizer } from '../../utils';
 import { prisma } from '../db/client';
 import { findMissingChapterFiles, getChaptersFromLocal } from '../utils/mangal';
 import { downloadQueue } from './download';
 
-const cronMap = {
-  daily: '0 0 * * *',
-  hourly: '0 * * * *',
-  minutely: '* * * * *',
-  weekly: '0 * * * 7',
-};
-
 const mangaWithLibraryAndMetadata = Prisma.validator<Prisma.MangaArgs>()({
   include: { library: true, metadata: true },
 });
@@ -149,7 +142,7 @@ export const schedule = async (manga: MangaWithLibraryAndMetadata) => {
       jobId,
       repeatJobKey: jobId,
       repeat: {
-        pattern: cronMap[manga.interval as keyof typeof cronMap],
+        pattern: manga.interval,
       },
     },
   );

src/server/queue/download.ts

@@ -1,6 +1,6 @@
 import { Prisma } from '@prisma/client';
 import { Job, Queue, Worker } from 'bullmq';
-import { sanitizer } from '../../utils/sanitize';
+import { sanitizer } from '../../utils';
 import { prisma } from '../db/client';
 import { downloadChapter, getChapterFromLocal } from '../utils/mangal';
 import { notificationQueue } from './notify';

src/server/trpc/router/manga.ts

@@ -1,7 +1,7 @@
 import { TRPCError } from '@trpc/server';
 import path from 'path';
 import { z } from 'zod';
-import { sanitizer } from '../../../utils/sanitize';
+import { isCronValid, sanitizer } from '../../../utils';
 import { checkChaptersQueue, removeJob, schedule } from '../../queue/checkChapters';
 import { downloadQueue } from '../../queue/download';
 import { getAvailableSources, getMangaDetail, Manga, removeManga, search } from '../../utils/mangal';
@@ -95,7 +95,13 @@ export const mangaRouter = t.router({
       z.object({
         source: z.string().trim().min(1),
         title: z.string().trim().min(1),
-        interval: z.string().trim().min(1),
+        interval: z
+          .string()
+          .trim()
+          .min(1)
+          .refine((value) => isCronValid(value), {
+            message: 'Invalid interval',
+          }),
       }),
     )
     .mutation(async ({ input, ctx }) => {

src/server/utils/mangal.ts

@@ -2,7 +2,7 @@ import execa from 'execa';
 import fs from 'fs/promises';
 import path from 'path';
 import { logger } from '../../utils/logging';
-import { sanitizer } from '../../utils/sanitize';
+import { sanitizer } from '../../utils';
 
 interface IOutput {
   Manga: Manga[];