mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-07-06 22:12:12 +02:00
feat(artifacts): enhance ArtifactsLibrary UI and add artifacts page detection
- Introduced a new state for detecting the artifacts page in LayoutDataProvider. - Simplified the EmptyState component in ArtifactsLibrary for a cleaner presentation. - Improved header layout in ArtifactsLibrary for better responsiveness and visual clarity.
This commit is contained in:
parent
a94a2976f6
commit
2a020629c5
3 changed files with 15 additions and 23 deletions
|
|
@ -698,6 +698,7 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
|
|||
const isSearchSpaceSettingsPage = pathname?.includes("/workspace-settings") === true;
|
||||
const isTeamPage = pathname?.endsWith("/team") === true;
|
||||
const isAutomationsPage = pathname?.includes("/automations") === true;
|
||||
const isArtifactsPage = pathname?.endsWith("/artifacts") === true;
|
||||
const isAllChatsPage = pathname?.endsWith("/chats") === true;
|
||||
const handleViewAllChats = useCallback(() => {
|
||||
setActiveSlideoutPanel(null);
|
||||
|
|
@ -713,6 +714,7 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
|
|||
isSearchSpaceSettingsPage ||
|
||||
isTeamPage ||
|
||||
isAutomationsPage ||
|
||||
isArtifactsPage ||
|
||||
isAllChatsPage;
|
||||
|
||||
return (
|
||||
|
|
@ -757,6 +759,7 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
|
|||
isSearchSpaceSettingsPage ||
|
||||
isTeamPage ||
|
||||
isAutomationsPage ||
|
||||
isArtifactsPage ||
|
||||
isAllChatsPage
|
||||
? "items-start justify-center px-6 py-8 md:px-10 md:pb-10 md:pt-16"
|
||||
: undefined
|
||||
|
|
@ -766,7 +769,7 @@ export function LayoutDataProvider({ searchSpaceId, children }: LayoutDataProvid
|
|||
? "max-w-none select-none"
|
||||
: isAllChatsPage
|
||||
? "max-w-5xl"
|
||||
: isUserSettingsPage || isSearchSpaceSettingsPage || isTeamPage
|
||||
: isUserSettingsPage || isSearchSpaceSettingsPage || isTeamPage || isArtifactsPage
|
||||
? "max-w-5xl"
|
||||
: undefined
|
||||
}
|
||||
|
|
|
|||
|
|
@ -249,7 +249,7 @@ function AllChatsContent({ searchSpaceId, className }: AllChatsContentProps) {
|
|||
variant="secondary"
|
||||
className="h-7 gap-1.5 rounded-md px-2.5 text-xs font-medium"
|
||||
>
|
||||
<span className="text-muted-foreground">Filter by</span>
|
||||
<span className="font-semibold text-muted-foreground">Filter by</span>
|
||||
<span>{selectedFilterLabel}</span>
|
||||
<ChevronDown className="h-3 w-3 text-muted-foreground" />
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
"use client";
|
||||
|
||||
import { useSetAtom } from "jotai";
|
||||
import { Boxes, RefreshCw, TriangleAlert } from "lucide-react";
|
||||
import { RefreshCw, TriangleAlert } from "lucide-react";
|
||||
import { useMemo, useState } from "react";
|
||||
import { openReportPanelAtom } from "@/atoms/chat/report-panel.atom";
|
||||
import { MobileReportPanel } from "@/components/report-panel/report-panel";
|
||||
|
|
@ -46,16 +46,8 @@ function ErrorState({ onRetry }: { onRetry: () => void }) {
|
|||
|
||||
function EmptyState() {
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center gap-3 rounded-xl border border-dashed py-20 text-center">
|
||||
<span className="flex size-12 items-center justify-center rounded-full bg-muted text-muted-foreground">
|
||||
<Boxes className="size-6" />
|
||||
</span>
|
||||
<div>
|
||||
<p className="font-medium text-foreground">No artifacts yet</p>
|
||||
<p className="mt-1 text-sm text-muted-foreground">
|
||||
Reports, resumes, podcasts, presentations, and images you generate appear here.
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex items-center justify-center py-20 text-center">
|
||||
<p className="font-medium text-foreground">No artifacts yet</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -90,17 +82,14 @@ export function ArtifactsLibrary({ workspaceId }: { workspaceId: number }) {
|
|||
};
|
||||
|
||||
return (
|
||||
<div className="mx-auto w-full max-w-5xl px-6 py-8">
|
||||
<header className="mb-6 flex items-center justify-between gap-4">
|
||||
<div>
|
||||
<h1 className="text-xl font-semibold text-foreground">Artifacts</h1>
|
||||
<p className="mt-1 text-sm text-muted-foreground">
|
||||
Every deliverable created across this search space.
|
||||
</p>
|
||||
<div className="w-full space-y-6">
|
||||
<header className="flex items-center justify-between gap-4 flex-wrap">
|
||||
<div className="flex items-baseline gap-3">
|
||||
<h1 className="text-xl md:text-2xl font-semibold text-foreground">Artifacts</h1>
|
||||
{!loading && artifacts.length > 0 ? (
|
||||
<span className="text-sm text-muted-foreground">{artifacts.length} total</span>
|
||||
) : null}
|
||||
</div>
|
||||
{!loading && artifacts.length > 0 ? (
|
||||
<span className="shrink-0 text-sm text-muted-foreground">{artifacts.length} total</span>
|
||||
) : null}
|
||||
</header>
|
||||
|
||||
{loading ? (
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue