New: Release type options for Calendar Feed

frontend/src/Calendar/iCal/CalendarLinkModalContent.tsx

@@ -4,6 +4,7 @@ import FormGroup from 'Components/Form/FormGroup';
 import FormInputButton from 'Components/Form/FormInputButton';
 import FormInputGroup from 'Components/Form/FormInputGroup';
 import FormLabel from 'Components/Form/FormLabel';
+import { EnhancedSelectInputValue } from 'Components/Form/Select/EnhancedSelectInput';
 import Icon from 'Components/Icon';
 import Button from 'Components/Link/Button';
 import ClipboardButton from 'Components/Link/ClipboardButton';
@@ -15,6 +16,27 @@ import { icons, inputTypes, kinds, sizes } from 'Helpers/Props';
 import { InputChanged } from 'typings/inputs';
 import translate from 'Utilities/String/translate';
 
+const releaseTypeOptions: EnhancedSelectInputValue<string>[] = [
+  {
+    key: 'cinemaRelease',
+    get value() {
+      return translate('CinemaRelease');
+    },
+  },
+  {
+    key: 'digitalRelease',
+    get value() {
+      return translate('DigitalRelease');
+    },
+  },
+  {
+    key: 'physicalRelease',
+    get value() {
+      return translate('PhysicalRelease');
+    },
+  },
+];
+
 interface CalendarLinkModalContentProps {
   onModalClose: () => void;
 }
@@ -22,13 +44,19 @@ interface CalendarLinkModalContentProps {
 function CalendarLinkModalContent({
   onModalClose,
 }: CalendarLinkModalContentProps) {
-  const [state, setState] = useState({
+  const [state, setState] = useState<{
+    unmonitored: boolean;
+    asAllDay: boolean;
+    releaseTypes: string[];
+    tags: number[];
+  }>({
     unmonitored: false,
     asAllDay: false,
+    releaseTypes: [],
     tags: [],
   });
 
-  const { unmonitored, asAllDay, tags } = state;
+  const { unmonitored, asAllDay, releaseTypes, tags } = state;
 
   const handleInputChange = useCallback(({ name, value }: InputChanged) => {
     setState((prevState) => ({ ...prevState, [name]: value }));
@@ -52,6 +80,12 @@ function CalendarLinkModalContent({
       icalUrl += 'asAllDay=true&';
     }
 
+    if (releaseTypes.length) {
+      releaseTypes.forEach((releaseType) => {
+        icalUrl += `releaseTypes=${releaseType}&`;
+      });
+    }
+
     if (tags.length) {
       icalUrl += `tags=${tags.toString()}&`;
     }
@@ -62,7 +96,7 @@ function CalendarLinkModalContent({
       iCalHttpUrl: `${window.location.protocol}//${icalUrl}`,
       iCalWebCalUrl: `webcal://${icalUrl}`,
     };
-  }, [unmonitored, asAllDay, tags]);
+  }, [unmonitored, asAllDay, releaseTypes, tags]);
 
   return (
     <ModalContent onModalClose={onModalClose}>
@@ -94,6 +128,19 @@ function CalendarLinkModalContent({
             />
           </FormGroup>
 
+          <FormGroup>
+            <FormLabel>{translate('ICalReleaseTypes')}</FormLabel>
+
+            <FormInputGroup
+              type={inputTypes.SELECT}
+              name="releaseTypes"
+              value={releaseTypes}
+              values={releaseTypeOptions}
+              helpText={translate('ICalReleaseTypesMoviesHelpText')}
+              onChange={handleInputChange}
+            />
+          </FormGroup>
+
           <FormGroup>
             <FormLabel>{translate('Tags')}</FormLabel>