mirror of
https://github.com/MacRimi/ProxMenux.git
synced 2026-06-01 13:04:42 +00:00
MacRimi
5ca3463bf6
Full rewrite of the docs site under app/[locale]/ with next-intl in localePrefix:"always" mode. Every page now exists at both /en/<path> and /es/<path>; the root / shows a meta-refresh + JS redirect to /<defaultLocale>/ so GitHub Pages serves something on the apex URL. Highlights: - 107 doc pages migrated to file-per-page JSON namespaces under messages/en/ and messages/es/. Spanish content is fully translated (no copy-of-English placeholders). - New documentation for the Active Suppressions section in the Settings tab and the per-event Dismiss dropdown in the Health Monitor modal. - New screenshots: dismiss-duration-dropdown.png and an updated health-suppression-settings.png. - Pagefind integrated for client-side search; index is built on every CI deploy (not committed). - RSS feeds: per-locale at /<locale>/rss.xml plus root /rss.xml for backward compat. - Removed the dead app/[locale]/guides/[slug]/ route — every guide now has its own static page and no markdown source remains. - Fixed orphan link /guides/nvidia -> /guides/nvidia-manual in docs/hardware/nvidia-host. - Removed obsolete components (footer2, calendar, drawer). Verified locally with `npm ci && npm run build`: 2804 files in out/, 231 pages indexed by pagefind, root redirect intact, both locale roots and the new Active Suppressions docs render OK.
100 lines
2.9 KiB
TypeScript
100 lines
2.9 KiB
TypeScript
import React, { Fragment } from "react"
|
|
import { ArrowRight, ArrowDown, ArrowLeftRight, ArrowUpDown } from "lucide-react"
|
|
import { cn } from "@/lib/utils"
|
|
|
|
type NodeVariant = "source" | "bridge" | "target"
|
|
|
|
export interface DataFlowNode {
|
|
label: string
|
|
detail?: string
|
|
variant?: NodeVariant
|
|
}
|
|
|
|
export interface DataFlowDiagramProps {
|
|
nodes: DataFlowNode[]
|
|
arrowLabel?: string
|
|
bidirectional?: boolean
|
|
command?: string
|
|
caption?: string
|
|
className?: string
|
|
}
|
|
|
|
const variantStyles: Record<NodeVariant, string> = {
|
|
source: "border-blue-300 bg-blue-50",
|
|
bridge: "border-gray-300 bg-gray-50",
|
|
target: "border-amber-300 bg-amber-50",
|
|
}
|
|
|
|
const variantLabel: Record<NodeVariant, string> = {
|
|
source: "text-blue-800",
|
|
bridge: "text-gray-700",
|
|
target: "text-amber-800",
|
|
}
|
|
|
|
export const DataFlowDiagram: React.FC<DataFlowDiagramProps> = ({
|
|
nodes,
|
|
arrowLabel,
|
|
bidirectional = false,
|
|
command,
|
|
caption,
|
|
className,
|
|
}) => {
|
|
const HorizArrow = bidirectional ? ArrowLeftRight : ArrowRight
|
|
const VertArrow = bidirectional ? ArrowUpDown : ArrowDown
|
|
return (
|
|
<div className={cn("my-6 not-prose", className)}>
|
|
<div className="flex flex-col md:flex-row md:items-stretch gap-3">
|
|
{nodes.map((node, i) => {
|
|
const variant = node.variant ?? "bridge"
|
|
return (
|
|
<Fragment key={i}>
|
|
<div
|
|
className={cn(
|
|
"flex-1 min-w-0 rounded-lg border-2 p-4 flex flex-col",
|
|
variantStyles[variant],
|
|
)}
|
|
>
|
|
<div
|
|
className={cn(
|
|
"text-xs font-semibold uppercase tracking-wide mb-2",
|
|
variantLabel[variant],
|
|
)}
|
|
>
|
|
{node.label}
|
|
</div>
|
|
{node.detail && (
|
|
<div className="font-mono text-sm text-gray-800 whitespace-pre-line leading-relaxed">
|
|
{node.detail}
|
|
</div>
|
|
)}
|
|
</div>
|
|
|
|
{i < nodes.length - 1 && (
|
|
<div className="flex md:flex-col items-center justify-center text-gray-500 px-2">
|
|
<HorizArrow className="hidden md:block h-5 w-5" aria-hidden />
|
|
<VertArrow className="md:hidden h-5 w-5" aria-hidden />
|
|
{arrowLabel && (
|
|
<span className="ml-2 md:ml-0 md:mt-1 text-xs font-semibold tracking-wide">
|
|
{arrowLabel}
|
|
</span>
|
|
)}
|
|
</div>
|
|
)}
|
|
</Fragment>
|
|
)
|
|
})}
|
|
</div>
|
|
|
|
{command && (
|
|
<pre className="mt-4 rounded-md bg-gray-100 p-3 overflow-x-auto text-xs font-mono text-gray-800 leading-relaxed border border-gray-200">
|
|
{command}
|
|
</pre>
|
|
)}
|
|
|
|
{caption && (
|
|
<p className="mt-2 text-xs text-gray-500 text-center">{caption}</p>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|