feat: allow future dates for Google Calendar and Luma connectors

- Updated date handling in indexing functions to permit future dates for Google Calendar and Luma connectors.
- Enhanced UI components to support future date selection, including a new button for selecting the next 30 days.
- Adjusted documentation and descriptions to clarify date range options for users.

surfsense_web/components/assistant-ui/connector-popup/components/date-range-selector.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { format, subDays, subYears } from "date-fns";
+import { addDays, format, subDays, subYears } from "date-fns";
 import { Calendar as CalendarIcon } from "lucide-react";
 import type { FC } from "react";
 import { Button } from "@/components/ui/button";
@@ -14,6 +14,7 @@ interface DateRangeSelectorProps {
 	endDate: Date | undefined;
 	onStartDateChange: (date: Date | undefined) => void;
 	onEndDateChange: (date: Date | undefined) => void;
+	allowFutureDates?: boolean; // Allow future dates for calendar connectors
 }
 
 export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
@@ -21,6 +22,7 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
 	endDate,
 	onStartDateChange,
 	onEndDateChange,
+	allowFutureDates = false,
 }) => {
 	const handleLast30Days = () => {
 		const today = new Date();
@@ -28,6 +30,12 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
 		onEndDateChange(today);
 	};
 
+	const handleNext30Days = () => {
+		const today = new Date();
+		onStartDateChange(today);
+		onEndDateChange(addDays(today, 30));
+	};
+
 	const handleLastYear = () => {
 		const today = new Date();
 		onStartDateChange(subYears(today, 1));
@@ -43,8 +51,9 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
 		<div className="rounded-xl bg-slate-400/5 dark:bg-white/5 p-3 sm:p-6">
 			<h3 className="font-medium text-sm sm:text-base mb-4">Select Date Range</h3>
 			<p className="text-xs sm:text-sm text-muted-foreground mb-6">
-				Choose how far back you want to sync your data. You can always re-index later with different
-				dates.
+				{allowFutureDates
+					? "Choose the date range to sync your data. You can select future dates to index upcoming events."
+					: "Choose how far back you want to sync your data. You can always re-index later with different dates."}
 			</p>
 
 			<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
@@ -72,7 +81,7 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
 								mode="single"
 								selected={startDate}
 								onSelect={onStartDateChange}
-								disabled={(date) => date > new Date()}
+								disabled={allowFutureDates ? false : (date) => date > new Date()}
 							/>
 						</PopoverContent>
 					</Popover>
@@ -93,8 +102,10 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
 									!endDate && "text-muted-foreground"
 								)}
 							>
-								<CalendarIcon className="mr-2 h-4 w-4" />
-								{endDate ? format(endDate, "PPP") : "Default (Today)"}
+							<CalendarIcon className="mr-2 h-4 w-4" />
+							{endDate
+								? format(endDate, "PPP")
+								: "Default (Today)"}
 							</Button>
 						</PopoverTrigger>
 						<PopoverContent className="w-auto p-0 z-[100]" align="start">
@@ -102,7 +113,11 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
 								mode="single"
 								selected={endDate}
 								onSelect={onEndDateChange}
-								disabled={(date) => date > new Date() || (startDate ? date < startDate : false)}
+								disabled={
+									allowFutureDates
+										? (date) => (startDate ? date < startDate : false)
+										: (date) => date > new Date() || (startDate ? date < startDate : false)
+								}
 							/>
 						</PopoverContent>
 					</Popover>
@@ -129,6 +144,17 @@ export const DateRangeSelector: FC<DateRangeSelectorProps> = ({
 				>
 					Last 30 Days
 				</Button>
+				{allowFutureDates && (
+					<Button
+						type="button"
+						variant="outline"
+						size="sm"
+						onClick={handleNext30Days}
+						className="text-xs sm:text-sm bg-slate-400/5 dark:bg-slate-400/5 border-slate-400/20 hover:bg-slate-400/10 dark:hover:bg-slate-400/10"
+					>
+						Next 30 Days
+					</Button>
+				)}
 				<Button
 					type="button"
 					variant="outline"

surfsense_web/components/assistant-ui/connector-popup/connect-forms/components/luma-connect-form.tsx

@@ -173,6 +173,7 @@ export const LumaConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting }
 								endDate={endDate}
 								onStartDateChange={setStartDate}
 								onEndDateChange={setEndDate}
+								allowFutureDates={true}
 							/>
 
 							{/* Periodic Sync Config */}

surfsense_web/components/assistant-ui/connector-popup/connector-configs/views/connector-edit-view.tsx

@@ -209,6 +209,10 @@ export const ConnectorEditView: FC<ConnectorEditViewProps> = ({
 											endDate={endDate}
 											onStartDateChange={onStartDateChange}
 											onEndDateChange={onEndDateChange}
+											allowFutureDates={
+												connector.connector_type === "GOOGLE_CALENDAR_CONNECTOR" ||
+												connector.connector_type === "LUMA_CONNECTOR"
+											}
 										/>
 									)}
 

surfsense_web/components/assistant-ui/connector-popup/connector-configs/views/indexing-configuration-view.tsx

@@ -150,6 +150,10 @@ export const IndexingConfigurationView: FC<IndexingConfigurationViewProps> = ({
 											endDate={endDate}
 											onStartDateChange={onStartDateChange}
 											onEndDateChange={onEndDateChange}
+											allowFutureDates={
+												config.connectorType === "GOOGLE_CALENDAR_CONNECTOR" ||
+												config.connectorType === "LUMA_CONNECTOR"
+											}
 										/>
 									)}