Add feature to download sample or original images and fix deprecation warning

src/components/grabber/Lightbox.tsx

@@ -25,17 +25,39 @@ export function Lightbox({ post, onClose }: { post: NormalizedPost | null; onClo
                 {post.rating && <Badge variant="outline">{post.rating}</Badge>}
                 {post.score !== undefined && <Badge variant="secondary">★ {post.score}</Badge>}
               </div>
-              {post.source && (
-                <a
-                  href={post.source}
-                  target="_blank"
-                  rel="noreferrer"
-                  className="text-primary underline break-all block"
-                >
-                  source
-                </a>
-              )}
-              <div className="text-xs text-muted-foreground">tags</div>
+              <div className="space-y-1">
+                {post.fileUrl && (
+                  <a
+                    href={post.fileUrl}
+                    target="_blank"
+                    rel="noreferrer"
+                    className="text-primary underline text-xs block"
+                  >
+                    View Original Image ({post.width && post.height ? `${post.width}x${post.height}` : "Original"})
+                  </a>
+                )}
+                {post.sampleUrl && (
+                  <a
+                    href={post.sampleUrl}
+                    target="_blank"
+                    rel="noreferrer"
+                    className="text-primary underline text-xs block"
+                  >
+                    View Sample Image
+                  </a>
+                )}
+                {post.source && (
+                  <a
+                    href={post.source}
+                    target="_blank"
+                    rel="noreferrer"
+                    className="text-primary underline text-xs break-all block"
+                  >
+                    Source Link
+                  </a>
+                )}
+              </div>
+              <div className="text-xs text-muted-foreground pt-2">tags</div>
               <div className="flex gap-1 flex-wrap max-h-96 overflow-y-auto">
                 {post.tags.map((t) => (
                   <Badge key={t} variant="outline" className="font-normal">

src/lib/grabber/search.functions.ts

@@ -46,7 +46,7 @@ export type SearchResult = {
 };
 
 export const searchPosts = createServerFn({ method: "POST" })
-  .inputValidator((input: unknown) => InputSchema.parse(input))
+  .validator((input: unknown) => InputSchema.parse(input))
   .handler(async ({ data }): Promise<SearchResult> => {
     const { site, tags, page, limit, login, apiKey } = data;
     const pageParam = (site.pageStartsAt ?? 1) === 0 ? page - 1 : page;

src/routes/api/download-zip.ts

@@ -26,6 +26,7 @@ const BodySchema = z.object({
   posts: z.array(PostSchema).min(1).max(200),
   excludeTags: z.array(z.string()).default([]),
   zipName: z.string().optional(),
+  downloadType: z.enum(["original", "sample"]).default("original"),
 });
 
 function sanitize(s: string) {
@@ -107,9 +108,23 @@ export const Route = createFileRoute("/api/download-zip")({
         await Promise.all(
           body.posts.map(async (post) => {
             const idSafe = sanitize(post.id);
-            const extSafe = sanitize(post.ext || "jpg");
             const base = `${siteName}_${idSafe}`;
 
+            // Determine image URL and file extension based on downloadType
+            let targetUrl = post.fileUrl;
+            if (body.downloadType === "sample" && post.sampleUrl) {
+              targetUrl = post.sampleUrl;
+            }
+
+            let extSafe = sanitize(post.ext || "jpg");
+            // If fetching sample, attempt to detect extension from sampleUrl if available
+            if (body.downloadType === "sample" && post.sampleUrl) {
+              const parsedExt = post.sampleUrl.split(".").pop()?.split("?")[0];
+              if (parsedExt && parsedExt.length <= 5) {
+                extSafe = sanitize(parsedExt);
+              }
+            }
+
             // Filter out tags that user specified to be missing
             const filteredTags = post.tags.filter((t) => !excludeSet.has(t.toLowerCase()));
 
@@ -121,7 +136,7 @@ export const Route = createFileRoute("/api/download-zip")({
 
             // fetch the image itself
             try {
-              const res = await fetch(post.fileUrl, {
+              const res = await fetch(targetUrl, {
                 headers: { "User-Agent": "LovableGrabber/1.0" },
               });
               if (!res.ok) {

src/routes/api/upload-to-dataset.ts

@@ -31,6 +31,7 @@ const BodySchema = z.object({
   datasetName: z.string().min(1, "Dataset name is required"),
   zipName: z.string().optional(),
   subfolder: z.string().optional(),
+  downloadType: z.enum(["original", "sample"]).default("original"),
 });
 
 function sanitize(s: string) {
@@ -113,16 +114,28 @@ export const Route = createFileRoute("/api/upload-to-dataset")({
         await Promise.all(
           body.posts.map(async (post) => {
             const idSafe = sanitize(post.id);
-            const extSafe = sanitize(post.ext || "jpg");
             const base = `${siteName}_${idSafe}`;
 
+            let targetUrl = post.fileUrl;
+            if (body.downloadType === "sample" && post.sampleUrl) {
+              targetUrl = post.sampleUrl;
+            }
+
+            let extSafe = sanitize(post.ext || "jpg");
+            if (body.downloadType === "sample" && post.sampleUrl) {
+              const parsedExt = post.sampleUrl.split(".").pop()?.split("?")[0];
+              if (parsedExt && parsedExt.length <= 5) {
+                extSafe = sanitize(parsedExt);
+              }
+            }
+
             const filteredTags = post.tags.filter((t) => !excludeSet.has(t.toLowerCase()));
 
             files[`${base}.txt`] = strToU8(filteredTags.join(" "));
             files[`${idSafe}.md`] = strToU8(buildMarkdown(post, excludeSet));
 
             try {
-              const res = await fetch(post.fileUrl, {
+              const res = await fetch(targetUrl, {
                 headers: { "User-Agent": "LovableGrabber/1.0" },
               });
               if (!res.ok) {

src/routes/index.tsx

@@ -48,6 +48,7 @@ function Grabber() {
   const [lightbox, setLightbox] = useState<NormalizedPost | null>(null);
   const [downloading, setDownloading] = useState(false);
   const [excludeTags, setExcludeTags] = useState("");
+  const [downloadType, setDownloadType] = useState<"original" | "sample">("original");
   const [hfToken, setHfToken] = useState("");
   const [datasetName, setDatasetName] = useState("");
   const [uploading, setUploading] = useState(false);
@@ -280,6 +281,7 @@ function Grabber() {
             .map((t) => t.trim().toLowerCase())
             .filter(Boolean),
           zipName: customFilename.trim() || undefined,
+          downloadType,
         }),
       });
       if (!res.ok) {
@@ -339,6 +341,7 @@ function Grabber() {
           datasetName: datasetName.trim(),
           zipName: customFilename.trim() || undefined,
           subfolder: customSubfolder.trim() || undefined,
+          downloadType,
         }),
       });
       const data = await res.json();
@@ -473,6 +476,15 @@ function Grabber() {
             {selected.size === posts.length && posts.length > 0 ? "Deselect all" : "Select all"}
           </Button>
           <span className="text-sm text-muted-foreground">selected: {selected.size}</span>
+          <Select value={downloadType} onValueChange={(val: "original" | "sample") => setDownloadType(val)}>
+            <SelectTrigger className="w-36">
+              <SelectValue />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="original">Original Image</SelectItem>
+              <SelectItem value="sample">Sample Image</SelectItem>
+            </SelectContent>
+          </Select>
           <Input
             placeholder="Custom ZIP / Filename"
             value={customFilename}