diff --git a/packages/ui/shared/src/ui/schemas.ts b/packages/ui/shared/src/ui/schemas.ts
index 6ca99e78..26995fdc 100644
--- a/packages/ui/shared/src/ui/schemas.ts
+++ b/packages/ui/shared/src/ui/schemas.ts
@@ -16,7 +16,8 @@ export const WidgetTypeSchema = z.enum([
     'gallery-widget',
     'page-card',
     'markdown-text',
-    'layout-container-widget'
+    'layout-container-widget',
+    'file-browser'
 ]);
 
 export type WidgetType = z.infer<typeof WidgetTypeSchema>;
@@ -155,6 +156,23 @@ export const LayoutContainerWidgetSchema = z.object({
 
 export type LayoutContainerWidgetProps = z.infer<typeof LayoutContainerWidgetSchema>;
 
+// =========================================
+//  File Browser Widget
+// =========================================
+export const FileBrowserWidgetSchema = z.object({
+    mount: z.string().default('test'),
+    path: z.string().default('/'),
+    glob: z.string().default('*.*'),
+    mode: z.enum(['simple', 'advanced']).default('simple'),
+    viewMode: z.enum(['list', 'thumbs']).default('list'),
+    sortBy: z.enum(['name', 'ext', 'date', 'type']).default('name'),
+    showToolbar: z.boolean().default(true),
+    variables: WidgetVariablesSchema,
+});
+
+export type FileBrowserWidgetProps = z.infer<typeof FileBrowserWidgetSchema>;
+
+
 // =========================================
 //  Union of All Widget Props (Optional Helper)
 // =========================================
diff --git a/packages/ui/src/components/MediaCard.tsx b/packages/ui/src/components/MediaCard.tsx
index 46a93bc5..ba9613bd 100644
--- a/packages/ui/src/components/MediaCard.tsx
+++ b/packages/ui/src/components/MediaCard.tsx
@@ -158,6 +158,7 @@ const MediaCard: React.FC<MediaCardProps> = ({
       variant={variant}
       apiUrl={apiUrl}
       versionCount={versionCount}
+      preset={preset}
     />
   );
 };
diff --git a/packages/ui/src/components/PhotoCard.tsx b/packages/ui/src/components/PhotoCard.tsx
index 7df09838..38f0352b 100644
--- a/packages/ui/src/components/PhotoCard.tsx
+++ b/packages/ui/src/components/PhotoCard.tsx
@@ -1,4 +1,5 @@
 import { Heart, Download, Share2, User, MessageCircle, Edit3, Trash2, Maximize, Layers, ExternalLink } from "lucide-react";
+import type { CardPreset } from "@/modules/pages/PageCard";
 import { Button } from "@/components/ui/button";
 import { useAuth } from "@/hooks/useAuth";
 import { toast } from "sonner";
@@ -44,6 +45,7 @@ interface PhotoCardProps {
   isExternal?: boolean;
   imageFit?: 'contain' | 'cover';
   className?: string; // Allow custom classes from parent
+  preset?: CardPreset;
 }
 
 const PhotoCard = ({
@@ -72,7 +74,8 @@ const PhotoCard = ({
   versionCount,
   isExternal = false,
   imageFit = 'cover',
-  className
+  className,
+  preset
 }: PhotoCardProps) => {
   const { user } = useAuth();
   const navigate = useNavigate();
@@ -359,6 +362,18 @@ const PhotoCard = ({
         )}
       </div>
 
+      {/* Info bar below image (preset-driven, desktop only) */}
+      {variant === 'grid' && (preset?.showTitle || preset?.showDescription) && (title || description) && (
+        <div className="hidden md:block px-2.5 py-2 border-t">
+          {preset?.showTitle && title && !isLikelyFilename(title) && (
+            <h3 className="text-sm font-medium truncate">{title}</h3>
+          )}
+          {preset?.showDescription && description && (
+            <p className="text-xs text-muted-foreground line-clamp-2 mt-0.5">{description}</p>
+          )}
+        </div>
+      )}
+
       {/* Desktop Hover Overlay - hidden on mobile, and hidden in feed variant */}
       {showContent && variant === 'grid' && (
         <div className={`hidden md:block absolute inset-0 bg-gradient-to-t from-black/80 via-transparent to-transparent ${overlayMode === 'always' ? 'opacity-100' : 'opacity-0 group-hover:opacity-100'} transition-opacity duration-300 pointer-events-none`}>