feat: restore request flow in dashboard
This commit is contained in:
@@ -0,0 +1,104 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useState } from "react";
|
||||||
|
import { toast } from "sonner";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogDescription,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
} from "@/components/ui/dialog";
|
||||||
|
import { Input } from "@/components/ui/input";
|
||||||
|
import { api } from "@/lib/api";
|
||||||
|
|
||||||
|
export function SearchRequestModal({
|
||||||
|
open,
|
||||||
|
onOpenChange,
|
||||||
|
costs,
|
||||||
|
}: {
|
||||||
|
open: boolean;
|
||||||
|
onOpenChange: (open: boolean) => void;
|
||||||
|
costs: { movie: number; tv: number };
|
||||||
|
}) {
|
||||||
|
const [query, setQuery] = useState("");
|
||||||
|
const [results, setResults] = useState<any[]>([]);
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
|
||||||
|
const search = async () => {
|
||||||
|
setLoading(true);
|
||||||
|
try {
|
||||||
|
const res = await api.get(
|
||||||
|
`/overseer/search?query=${encodeURIComponent(query)}`,
|
||||||
|
);
|
||||||
|
setResults(res.data?.results || res.data || []);
|
||||||
|
} catch {
|
||||||
|
toast.error("Search failed");
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const request = async (item: any, mediaType: string) => {
|
||||||
|
try {
|
||||||
|
await api.post("/overseer/request", {
|
||||||
|
mediaType,
|
||||||
|
mediaId: item.id || item.tmdbId,
|
||||||
|
title: item.title || item.name,
|
||||||
|
seasons: item.seasons,
|
||||||
|
});
|
||||||
|
toast.success("Request sent");
|
||||||
|
onOpenChange(false);
|
||||||
|
} catch (e: any) {
|
||||||
|
toast.error(e?.response?.data?.error || "Request failed");
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||||
|
<DialogContent>
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Request content</DialogTitle>
|
||||||
|
<DialogDescription>
|
||||||
|
Search and send request. Movie cost {costs.movie}. TV cost{" "}
|
||||||
|
{costs.tv}.
|
||||||
|
</DialogDescription>
|
||||||
|
</DialogHeader>
|
||||||
|
<div className="space-y-3">
|
||||||
|
<Input
|
||||||
|
value={query}
|
||||||
|
onChange={(e) => setQuery(e.target.value)}
|
||||||
|
placeholder="Search movie or show"
|
||||||
|
/>
|
||||||
|
<Button onClick={search} disabled={loading || !query}>
|
||||||
|
Search
|
||||||
|
</Button>
|
||||||
|
<div className="max-h-72 overflow-auto space-y-2">
|
||||||
|
{results.map((r) => (
|
||||||
|
<div
|
||||||
|
key={r.id || r.tmdbId}
|
||||||
|
className="flex items-center justify-between gap-2 border p-2 rounded"
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<div className="font-medium">{r.title || r.name}</div>
|
||||||
|
<div className="text-xs text-muted-foreground">
|
||||||
|
{r.media_type || r.mediaType}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<Button
|
||||||
|
size="sm"
|
||||||
|
onClick={() =>
|
||||||
|
request(r, r.media_type || r.mediaType || "movie")
|
||||||
|
}
|
||||||
|
>
|
||||||
|
Request
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -10,6 +10,7 @@ import {
|
|||||||
CardHeader,
|
CardHeader,
|
||||||
CardTitle,
|
CardTitle,
|
||||||
} from "@/components/ui/card";
|
} from "@/components/ui/card";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
||||||
import { api, overseerApi } from "@/lib/api";
|
import { api, overseerApi } from "@/lib/api";
|
||||||
import { useSocket } from "@/lib/socket";
|
import { useSocket } from "@/lib/socket";
|
||||||
@@ -18,6 +19,7 @@ import { formatNumber } from "@/lib/utils";
|
|||||||
import { ActivityFeed } from "./components/ActivityFeed";
|
import { ActivityFeed } from "./components/ActivityFeed";
|
||||||
import { Leaderboard } from "./components/Leaderboard";
|
import { Leaderboard } from "./components/Leaderboard";
|
||||||
import { RequestHistory } from "./components/RequestHistory";
|
import { RequestHistory } from "./components/RequestHistory";
|
||||||
|
import { SearchRequestModal } from "./components/SearchRequestModal";
|
||||||
import { WatchHistory } from "./components/WatchHistory";
|
import { WatchHistory } from "./components/WatchHistory";
|
||||||
|
|
||||||
interface WalletData {
|
interface WalletData {
|
||||||
@@ -32,6 +34,7 @@ export default function DashboardPage() {
|
|||||||
const [wallet, setWallet] = useState<WalletData | null>(null);
|
const [wallet, setWallet] = useState<WalletData | null>(null);
|
||||||
const [requestCosts, setRequestCosts] = useState({ movie: 500, tv: 1000 });
|
const [requestCosts, setRequestCosts] = useState({ movie: 500, tv: 1000 });
|
||||||
const [isLoading, setIsLoading] = useState(true);
|
const [isLoading, setIsLoading] = useState(true);
|
||||||
|
const [isSearchModalOpen, setIsSearchModalOpen] = useState(false);
|
||||||
const socket = useSocket();
|
const socket = useSocket();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
@@ -101,6 +104,11 @@ export default function DashboardPage() {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className="mt-4">
|
||||||
|
<Button onClick={() => setIsSearchModalOpen(true)}>
|
||||||
|
Request content
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
</CardContent>
|
</CardContent>
|
||||||
</Card>
|
</Card>
|
||||||
<div className="text-sm text-muted-foreground">
|
<div className="text-sm text-muted-foreground">
|
||||||
@@ -123,6 +131,11 @@ export default function DashboardPage() {
|
|||||||
</TabsContent>
|
</TabsContent>
|
||||||
</Tabs>
|
</Tabs>
|
||||||
<ActivityFeed />
|
<ActivityFeed />
|
||||||
|
<SearchRequestModal
|
||||||
|
open={isSearchModalOpen}
|
||||||
|
onOpenChange={setIsSearchModalOpen}
|
||||||
|
costs={requestCosts}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user