viktor/wrongmove
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

replace available from component with a nicer search which takes human input

Browse source
This commit is contained in:
Viktor Barzin 2025-06-21 23:43:35 +00:00
parent ce199152e2
commit fbd39bb67f
No known key found for this signature in database
GPG key ID: 4056458DBDBF8863
4 changed files with 390 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

72
crawler/frontend/src/components/Parameters.tsx
View file

@ -4,11 +4,10 @@ import { useState } from "react";
import { useForm } from "react-hook-form";
import { z } from "zod";
import { Button } from "./ui/button";
import { Calendar } from "./ui/calendar";
import { Calendar29 } from "./ui/DatePicker";
import { Dialog, DialogContent, DialogTrigger } from "./ui/dialog";
import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from "./ui/form";
import { Input } from "./ui/input";
import { Popover, PopoverContent, PopoverTrigger } from "./ui/popover";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./ui/select";
@ -47,6 +46,7 @@ export function Parameters(
register,
} = useForm<ParameterValues>()
const [action, setAction] = useState<'fetch-data' | 'visualize' | null>(null)
const [availableFromRawInput, setAvailableFromRawInput] = useState("now");
const formSchema = z.object({
metric: z.nativeEnum(Metric, { required_error: "Metric is required" }),
@ -63,11 +63,12 @@ export function Parameters(
resolver: zodResolver(formSchema),
defaultValues: {
metric: Metric.qmprice,
listing_type: ListingType.RENT,
min_bedrooms: 1,
max_bedrooms: 3,
max_price: 3000,
min_price: 2000,
min_sqm: 0,
min_sqm: 50,
last_seen_days: 7,
available_from: new Date(),
},
@ -81,7 +82,6 @@ export function Parameters(
props.onSubmit(action, values)
}
}
const now = new Date();
@ -144,6 +144,19 @@ export function Parameters(
</FormItem>
)}
/>
<FormField
control={form.control}
name="min_sqm"
render={({ field }) => (
<FormItem>
<FormLabel>Min square meters</FormLabel>
<FormControl >
<Input type="number" placeholder={"m²"} {...field} onChange={(e) => field.onChange(Number(e.target.value))} />
</FormControl>
<FormMessage />
</FormItem>
)}
/>
<FormField
control={form.control}
name="min_bedrooms"
@ -198,13 +211,16 @@ export function Parameters(
/>
<FormField
control={form.control}
name="min_sqm"
name="available_from"
render={({ field }) => (
<FormItem>
<FormLabel>Min square meters</FormLabel>
<FormControl >
<Input type="number" placeholder={"m²"} {...field} onChange={(e) => field.onChange(Number(e.target.value))} />
<FormItem className="flex flex-col">
<FormLabel>Available from</FormLabel>
<FormControl>
<Calendar29 onSelect={field.onChange} selected={field.value} rawInputValue={availableFromRawInput} onChangeRawInputValue={setAvailableFromRawInput} />
</FormControl>
<FormDescription>
Applicable for renting listings only
</FormDescription>
<FormMessage />
</FormItem>
)}
@ -222,44 +238,6 @@ export function Parameters(
</FormItem>
)}
/>
<FormField
control={form.control}
name="available_from"
render={({ field }) => (
<FormItem className="flex flex-col">
<FormLabel>Available from</FormLabel>
<Popover>
<PopoverTrigger asChild>
<FormControl>
<Button
variant={"outline"}
className={
"w-[240px] pl-3 text-left font-normal"
}
>
{/* <CalendarIcon className="ml-auto h-4 w-4 opacity-50" /> */}
</Button>
</FormControl>
</PopoverTrigger>
<PopoverContent className="w-auto p-0" align="start">
<Calendar
mode="single"
selected={field.value}
onSelect={field.onChange}
disabled={(date) =>
date < new Date() || date > new Date(now.setMonth(now.getMonth() + 3))
}
captionLayout="dropdown"
/>
</PopoverContent>
</Popover>
<FormDescription>
Applicable for renting listings only
</FormDescription>
<FormMessage />
</FormItem>
)}
/>
<Button type="submit" value={"visualize"} onClick={() => setAction("visualize")}>Visualize</Button>
<Button type="submit" value={"fetch-data"} onClick={() => setAction("fetch-data")}>Fetch data</Button>