diff --git a/frontend/src/components/ExportFiltersToCalendar.tsx b/frontend/src/components/ExportFiltersToCalendar.tsx new file mode 100644 index 0000000..44f29ae --- /dev/null +++ b/frontend/src/components/ExportFiltersToCalendar.tsx @@ -0,0 +1,39 @@ +import { Button } from "@/components/ui/button.tsx"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogHeader, + DialogTitle, + DialogTrigger, +} from "@/components/ui/dialog.tsx"; +import { Filters } from "@/lib/types.ts"; +import { CalendarPlus } from "lucide-react"; + +export function ExportFiltersToCalendar({ filters }: { filters: Filters }) { + return ( + + + + + + + Экспорт в приложение календаря + + Вы можете добавить все события из данной подборки по фильтрам в свой + календарь (например, Яндекс Календарь, Google Календарь или Apple + Календарь). + + + При обновлениях мероприятий в подборке, они также будут обновляться + в вашем календаре. + + Скопируйте ссылку ниже: + + + + ); +} diff --git a/frontend/src/components/GetUrlToFilters.tsx b/frontend/src/components/GetUrlToFilters.tsx new file mode 100644 index 0000000..c59aff9 --- /dev/null +++ b/frontend/src/components/GetUrlToFilters.tsx @@ -0,0 +1,33 @@ +import { Button } from "@/components/ui/button.tsx"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogHeader, + DialogTitle, + DialogTrigger, +} from "@/components/ui/dialog.tsx"; +import { Filters } from "@/lib/types.ts"; +import { Share2 } from "lucide-react"; + +export function GetUrlToFilters({ filters }: { filters: Filters }) { + return ( + + + + + + + Отправьте ссылку на текущую подборку + + Чтобы поделиться подборкой с кем-то, отправьте ему ссылку на неё. + + Скопируйте ссылку ниже: + + + + ); +} diff --git a/frontend/src/routes/search.tsx b/frontend/src/routes/search.tsx index 692f625..314bd2b 100644 --- a/frontend/src/routes/search.tsx +++ b/frontend/src/routes/search.tsx @@ -1,6 +1,8 @@ import { $api } from "@/api"; import { EventCard } from "@/components/EventCard.tsx"; +import { ExportFiltersToCalendar } from "@/components/ExportFiltersToCalendar.tsx"; import { AllFilters } from "@/components/filters/AllFilters"; +import { GetUrlToFilters } from "@/components/GetUrlToFilters.tsx"; import { Input } from "@/components/ui/input"; import { Filters } from "@/lib/types"; import { createFileRoute, useNavigate } from "@tanstack/react-router"; @@ -48,9 +50,9 @@ function RouteComponent() { }; const handleQueryChange = (newQuery: string) => { - setFiltersChanging(true) - setQuery(newQuery) - } + setFiltersChanging(true); + setQuery(newQuery); + }; const { data, isLoading: dataLoading } = $api.useQuery( "post", @@ -73,12 +75,16 @@ function RouteComponent() { return (
-