Implement searchWindow search parameter

client-next/src/components/SearchBar/SearchBar.tsx

@@ -4,6 +4,7 @@ import { LocationInputField } from './LocationInputField.tsx';
 import { DepartureArrivalSelect } from './DepartureArrivalSelect.tsx';
 import { TimeInputField } from './TimeInputField.tsx';
 import { DateInputField } from './DateInputField.tsx';
+import { SearchWindowInput } from './SearchWindowInput.tsx';
 
 export function SearchBar({
   onRoute,
@@ -22,6 +23,7 @@ export function SearchBar({
         <DepartureArrivalSelect tripQueryVariables={tripQueryVariables} setTripQueryVariables={setTripQueryVariables} />
         <TimeInputField tripQueryVariables={tripQueryVariables} setTripQueryVariables={setTripQueryVariables} />
         <DateInputField tripQueryVariables={tripQueryVariables} setTripQueryVariables={setTripQueryVariables} />
+        <SearchWindowInput tripQueryVariables={tripQueryVariables} setTripQueryVariables={setTripQueryVariables} />
         <Button variant="primary" onClick={onRoute}>
           Route
         </Button>

client-next/src/components/SearchBar/SearchWindowInput.tsx

@@ -0,0 +1,29 @@
+import { Form } from 'react-bootstrap';
+import { TripQueryVariables } from '../../gql/graphql.ts';
+
+export function SearchWindowInput({
+  tripQueryVariables,
+  setTripQueryVariables,
+}: {
+  tripQueryVariables: TripQueryVariables;
+  setTripQueryVariables: (tripQueryVariables: TripQueryVariables) => void;
+}) {
+  return (
+    <Form.Group>
+      <Form.Label htmlFor="searchWindowInput">Search window (seconds)</Form.Label>
+      <Form.Control
+        type="number"
+        id="searchWindowInput"
+        size="sm"
+        placeholder="3600"
+        value={tripQueryVariables.searchWindow || undefined}
+        onChange={(event) =>
+          setTripQueryVariables({
+            ...tripQueryVariables,
+            searchWindow: Number(event.target.value),
+          })
+        }
+      />
+    </Form.Group>
+  );
+}

client-next/src/hooks/useTripQuery.ts

@@ -11,8 +11,8 @@ const endpoint = `https://api.entur.io/journey-planner/v3/graphql`;
   TODO: should live in a separate file, and split into fragments for readability
  */
 const query = graphql(`
-  query trip($from: Location!, $to: Location!, $arriveBy: Boolean, $dateTime: DateTime) {
-    trip(from: $from, to: $to, arriveBy: $arriveBy, dateTime: $dateTime) {
+  query trip($from: Location!, $to: Location!, $arriveBy: Boolean, $dateTime: DateTime, $searchWindow: Int) {
+    trip(from: $from, to: $to, arriveBy: $arriveBy, dateTime: $dateTime, searchWindow: $searchWindow) {
       tripPatterns {
         aimedStartTime
         aimedEndTime