diff --git a/frontend/src/pages/FileManagerPage.tsx b/frontend/src/pages/FileManagerPage.tsx
index bab940d95..3c1f1a6e5 100644
--- a/frontend/src/pages/FileManagerPage.tsx
+++ b/frontend/src/pages/FileManagerPage.tsx
@@ -37,6 +37,7 @@ import {
Pencil,
Play,
Image,
+ User,
} from 'lucide-react';
import { api } from '../api/client';
import type {
@@ -963,7 +964,7 @@ function FileCard({ file, isSelected, isMobile, onSelect, onDelete, onDownload,
)}
{file.sliced_for_model && (
-
+
@@ -974,8 +975,9 @@ function FileCard({ file, isSelected, isMobile, onSelect, onDelete, onDownload,
)}
{file.created_by_username && (
-
- {t('fileManager.uploadedBy', { name: file.created_by_username })}
+
+
+ {file.created_by_username}
)}
@@ -1163,6 +1165,7 @@ export function FileManagerPage() {
// Filter and sort state (persist sort preferences to localStorage)
const [searchQuery, setSearchQuery] = useState('');
const [filterType, setFilterType] = useState('all');
+ const [filterUsername, setFilterUsername] = useState('');
const [sortField, setSortField] = useState(() => {
const saved = localStorage.getItem('library-sort-field');
return (saved as SortField) || 'name';
@@ -1204,6 +1207,12 @@ export function FileManagerPage() {
queryFn: () => api.getLibraryStats(),
});
+ // Get users for the username filter autocomplete
+ const { data: users } = useQuery({
+ queryKey: ['users'],
+ queryFn: () => api.getUsers(),
+ });
+
// Get unique file types for filter dropdown
const fileTypes = useMemo(() => {
if (!files) return [];
@@ -1232,6 +1241,14 @@ export function FileManagerPage() {
result = result.filter((f) => f.file_type === filterType);
}
+ // Apply username filter
+ if (filterUsername.trim()) {
+ const query = filterUsername.toLowerCase();
+ result = result.filter(
+ (f) => f.created_by_username && f.created_by_username.toLowerCase().includes(query)
+ );
+ }
+
// Apply sorting
result.sort((a, b) => {
let comparison = 0;
@@ -1256,7 +1273,7 @@ export function FileManagerPage() {
});
return result;
- }, [files, searchQuery, filterType, sortField, sortDirection]);
+ }, [files, searchQuery, filterType, filterUsername, sortField, sortDirection]);
// Check if disk space is low
const isDiskSpaceLow = useMemo(() => {
@@ -1745,6 +1762,31 @@ export function FileManagerPage() {
+ {/* Username filter with autocomplete */}
+
+ setFilterUsername(e.target.value)}
+ list="usernames-list"
+ className="w-32 sm:w-40 px-2 py-1.5 bg-bambu-dark border border-bambu-dark-tertiary rounded text-sm text-white placeholder-bambu-gray focus:outline-none focus:border-bambu-green"
+ />
+ {filterUsername && (
+
+ )}
+
+
+
{/* Sort */}