diff options
Diffstat (limited to 'apps/web/src/app')
| -rw-r--r-- | apps/web/src/app/projects/page.tsx | 31 |
1 files changed, 30 insertions, 1 deletions
diff --git a/apps/web/src/app/projects/page.tsx b/apps/web/src/app/projects/page.tsx index 4ebecafb..16722815 100644 --- a/apps/web/src/app/projects/page.tsx +++ b/apps/web/src/app/projects/page.tsx @@ -15,6 +15,7 @@ import { Loader2, X, Trash2, + Search, } from "lucide-react"; import { TProject } from "@/types/project"; import Image from "next/image"; @@ -248,8 +249,13 @@ export default function ProjectsPage() { <div className="flex items-center justify-center py-16"> <Loader2 className="h-8 w-8 text-muted-foreground animate-spin" /> </div> - ) : sortedProjects.length === 0 ? ( + ) : savedProjects.length === 0 ? ( <NoProjects onCreateProject={handleCreateProject} /> + ) : sortedProjects.length === 0 ? ( + <NoResults + searchQuery={searchQuery} + onClearSearch={() => setSearchQuery("")} + /> ) : ( <div className="grid grid-cols-1 xs:grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-6"> {sortedProjects.map((project) => ( @@ -618,3 +624,26 @@ function NoProjects({ onCreateProject }: { onCreateProject: () => void }) { </div> ); } + +function NoResults({ + searchQuery, + onClearSearch, +}: { + searchQuery: string; + onClearSearch: () => void; +}) { + return ( + <div className="flex flex-col items-center justify-center py-16 text-center"> + <div className="w-16 h-16 rounded-full bg-muted/30 flex items-center justify-center mb-4"> + <Search className="h-8 w-8 text-muted-foreground" /> + </div> + <h3 className="text-lg font-medium mb-2">No results found</h3> + <p className="text-muted-foreground mb-6 max-w-md"> + Your search for "{searchQuery}" did not return any results. + </p> + <Button onClick={onClearSearch} variant="outline"> + Clear Search + </Button> + </div> + ); +} |
