mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-08-28 05:25:33 +00:00
memory graph loader (#1072)
## Summary - Replace the memory graph page's top-left package loading indicator with a centered Supermemory loader overlay. - Reuse the same SuperLoader animation in the graph preview card loading state.
This commit is contained in:
parent
c71acbe8ae
commit
7418abbe8d
2 changed files with 22 additions and 4 deletions
|
|
@ -4,6 +4,7 @@ import { memo, useMemo } from "react"
|
|||
import { cn } from "@lib/utils"
|
||||
import { dmSansClassName } from "@/lib/fonts"
|
||||
import { Expand } from "lucide-react"
|
||||
import { SuperLoader } from "@/components/superloader"
|
||||
import { useGraphApi } from "./hooks/use-graph-api"
|
||||
import { useViewMode } from "@/lib/view-mode-context"
|
||||
|
||||
|
|
@ -157,7 +158,12 @@ export const GraphCard = memo<GraphCardProps>(
|
|||
<div className="flex-1 w-full relative overflow-hidden rounded-lg">
|
||||
{isLoading ? (
|
||||
<div className="absolute inset-0 flex items-center justify-center">
|
||||
<div className="size-6 border-2 border-blue-400/30 border-t-blue-400 rounded-full animate-spin" />
|
||||
<SuperLoader
|
||||
label="Loading graph..."
|
||||
size={40}
|
||||
colorClassName="text-[#4BA0FA]"
|
||||
className="[&>span]:text-[#A8B0BD]"
|
||||
/>
|
||||
</div>
|
||||
) : documentCount > 0 || memoryCount > 0 ? (
|
||||
<StaticGraphPreview
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
|
||||
import { MemoryGraph as MemoryGraphBase } from "@supermemory/memory-graph"
|
||||
import type { GraphThemeColors } from "@supermemory/memory-graph"
|
||||
import { SuperLoader } from "@/components/superloader"
|
||||
import { useGraphApi } from "./hooks/use-graph-api"
|
||||
|
||||
export interface MemoryGraphWrapperProps {
|
||||
|
|
@ -46,14 +47,15 @@ export function MemoryGraph({
|
|||
documentIds,
|
||||
maxNodes,
|
||||
})
|
||||
const isInitialLoading = externalIsLoading || apiIsLoading
|
||||
|
||||
return (
|
||||
<div className="absolute inset-0 [&>div]:!h-full [&>div]:!bg-none">
|
||||
<MemoryGraphBase
|
||||
documents={documents}
|
||||
isLoading={externalIsLoading || apiIsLoading}
|
||||
isLoadingMore={isLoadingMore}
|
||||
onLoadMore={hasMore ? () => loadMore() : undefined}
|
||||
isLoading={false}
|
||||
isLoadingMore={false}
|
||||
onLoadMore={hasMore && !isLoadingMore ? () => loadMore() : undefined}
|
||||
hasMore={hasMore}
|
||||
error={externalError || apiError}
|
||||
variant={variant}
|
||||
|
|
@ -70,6 +72,16 @@ export function MemoryGraph({
|
|||
>
|
||||
{children}
|
||||
</MemoryGraphBase>
|
||||
{isInitialLoading && (
|
||||
<div className="pointer-events-none absolute inset-0 z-40 flex items-center justify-center">
|
||||
<SuperLoader
|
||||
label="Loading memory graph..."
|
||||
size={72}
|
||||
colorClassName="text-[#4BA0FA]"
|
||||
className="[&>span]:text-slate-100"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue