Michael Chihlas
307a6285e6
Replace 15 feature-dump guides with 43 problem-oriented how-tos grouped under 10 categories. Drop Maintenance Flows / AI Assistant / Flow Assist Sparkles — those surfaces no longer exist post-FlowPilot pivot. Rename Step Library → Solutions Library throughout. Correct every "click X in the sidebar" reference to match live labels (Home, History, Tickets, Flows, Scripts, Data, Acct). Schema: add `category: CategoryId` and optional `relatedSlugs` to Guide; new Category type and `categories` const drive hub ordering. GuidesHubPage renders category sections (auto-hides empty); GuideDetailPage renders a related-guides footer when set; GuideCard drops the misleading "N sections" subtitle. Fix step.tip markdown rendering — `**bold**` rendered literally because tip used plain text instead of the same regex replacement used on instruction. 14 net-new how-tos for FlowPilot-era surfaces with no prior coverage: tasklane keyboard flow, view-what-we-know, ask-AI mid-session, pause-and-leave, resolve, record-fix-outcome, escalate (Escalation Mode), post-docs-to-ticket, send-client-update, build-script-from-scratch, open-suggested-flow, pin-a-flow, invite-teammate. Browser-verified against engineer + owner test users (sidebar labels, account sub-pages, pilot-screen header buttons, Tasks panel, integration form). tsc clean. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
50 lines
1.8 KiB
TypeScript
50 lines
1.8 KiB
TypeScript
import { BookOpen } from 'lucide-react'
|
|
import { PageMeta } from '@/components/common/PageMeta'
|
|
import { categories, guides } from '@/data/guides'
|
|
import { GuideCard } from '@/components/guides/GuideCard'
|
|
|
|
export default function GuidesHubPage() {
|
|
return (
|
|
<div className="overflow-y-auto h-full">
|
|
<PageMeta title="Guides" />
|
|
<div className="p-6 max-w-5xl mx-auto">
|
|
{/* Header */}
|
|
<div className="mb-8">
|
|
<div className="flex items-center gap-3 mb-2">
|
|
<div className="flex h-10 w-10 items-center justify-center rounded-xl bg-accent-dim">
|
|
<BookOpen size={20} className="text-primary" />
|
|
</div>
|
|
<h1 className="text-2xl font-heading font-bold text-foreground">User Guides</h1>
|
|
</div>
|
|
<p className="text-sm text-muted-foreground ml-[52px]">
|
|
Learn how to use ResolutionFlow with step-by-step instructions for every feature.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Category sections */}
|
|
<div className="space-y-10">
|
|
{categories.map(category => {
|
|
const categoryGuides = guides.filter(g => g.category === category.id)
|
|
if (categoryGuides.length === 0) return null
|
|
return (
|
|
<section key={category.id}>
|
|
<div className="mb-3">
|
|
<h2 className="text-base font-heading font-semibold text-foreground">
|
|
{category.label}
|
|
</h2>
|
|
<p className="text-xs text-muted-foreground mt-0.5">{category.description}</p>
|
|
</div>
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
|
{categoryGuides.map(guide => (
|
|
<GuideCard key={guide.slug} guide={guide} />
|
|
))}
|
|
</div>
|
|
</section>
|
|
)
|
|
})}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|