diff --git a/webapp/src/App.tsx b/webapp/src/App.tsx index e415fb1c..bb072855 100644 --- a/webapp/src/App.tsx +++ b/webapp/src/App.tsx @@ -20,6 +20,7 @@ import BlogList from '@/pages/BlogList' import BlogPost from '@/pages/BlogPost' import QnAList from '@/pages/QnAList' import QnAPost from '@/pages/QnAPost' +import Profile from '@/pages/Profile' function App() { return ( @@ -64,6 +65,7 @@ function App() { } /> } /> } /> + } /> } /> diff --git a/webapp/src/components/help/HelpPanel.tsx b/webapp/src/components/help/HelpPanel.tsx index 240e6402..7b461052 100644 --- a/webapp/src/components/help/HelpPanel.tsx +++ b/webapp/src/components/help/HelpPanel.tsx @@ -1,7 +1,103 @@ +import { useState } from 'react' import { useLocation, Link } from 'react-router-dom' -import { X, BookOpen, ArrowRight } from 'lucide-react' +import { X, BookOpen, ArrowRight, HelpCircle, Send, CheckCircle2, ChevronDown, ChevronUp } from 'lucide-react' +import { useMutation } from '@tanstack/react-query' import { HELP_MAP } from './helpContent' import { useHelp } from '@/hooks/useHelp' +import { useProfile } from '@/hooks/useProfile' +import { qnaApi } from '@/api/client' + +function pageTag(pathname: string): string { + const seg = pathname.replace(/^\//, '').split('/')[0] + return seg || 'general' +} + +function AskQuestionForm({ pathname }: { pathname: string }) { + const { profile } = useProfile() + const [open, setOpen] = useState(false) + const [title, setTitle] = useState('') + const [postedId, setPostedId] = useState(null) + + const tag = pageTag(pathname) + + const mutation = useMutation({ + mutationFn: () => qnaApi.create({ + title: title.trim(), + content: { + type: 'doc', + content: [{ type: 'paragraph', content: [{ type: 'text', text: title.trim() }] }], + }, + author_name: profile.name, + tags: [tag], + }), + onSuccess: (post) => { + setPostedId(post.id) + setTitle('') + }, + }) + + if (postedId) { + return ( +
+ + Question posted! + + View it + + +
+ ) + } + + return ( +
+ + + {open && ( +
+ setTitle(e.target.value)} + onKeyDown={e => e.key === 'Enter' && title.trim() && mutation.mutate()} + placeholder="What's your question?" + className="ne-HelpPanel__ask-input" + /> +
+ #{tag} + +
+ {mutation.error && ( +

{String(mutation.error)}

+ )} +
+ )} +
+ ) +} export function HelpPanel() { const { helpOpen, closeHelp } = useHelp() @@ -84,7 +180,8 @@ export function HelpPanel() {
- + + Full documentation diff --git a/webapp/src/components/layout/Navbar.tsx b/webapp/src/components/layout/Navbar.tsx index b93167cc..0a3ad60f 100644 --- a/webapp/src/components/layout/Navbar.tsx +++ b/webapp/src/components/layout/Navbar.tsx @@ -3,6 +3,7 @@ import { Link, useLocation } from 'react-router-dom' import { cn } from '@/lib/utils' import { useTheme } from '@/theme' import { useHelp } from '@/hooks/useHelp' +import { useProfile } from '@/hooks/useProfile' import { ToolsPanel } from './ToolsPanel' import { Activity, @@ -48,6 +49,7 @@ export function Navbar() { const { pathname } = useLocation() const { theme, toggleWithTransition } = useTheme() const { openHelp, helpOpen } = useHelp() + const { profile } = useProfile() const [overflowOpen, setOverflowOpen] = useState(false) const overflowRef = useRef(null) const [toolsOpen, setToolsOpen] = useState(false) @@ -157,6 +159,17 @@ export function Navbar() { > + + {profile.avatar + ? {profile.name} + : {profile.name.split(' ').map(w => w[0]).join('').slice(0, 2).toUpperCase()} + } + + + )} +
+
+
+ {myQuestions.length} + Questions +
+
+ {myPosts.length} + Blog posts +
+
+ + + + {/* ── Tabs ─────────────────────────────────────── */} +
+ + +
+ + {/* ── Questions tab ────────────────────────────── */} + {tab === 'questions' && ( + <> + {qnaLoading && } + {qnaError && } + {!qnaLoading && !qnaError && myQuestions.length === 0 && ( + } + message={`No questions yet from "${profile.name}". Open the help panel (?) on any page to ask contextually.`} + /> + )} +
+ {myQuestions.map(post => ( + + ))} +
+ + )} + + {/* ── Blog posts tab ───────────────────────────── */} + {tab === 'posts' && ( + <> + {blogLoading && } + {blogError && } + {!blogLoading && !blogError && myPosts.length === 0 && ( + } + message={`No blog posts yet from "${profile.name}". Head to Blog to create one.`} + /> + )} +
+ {myPosts.map(post => ( + + ))} +
+ + )} + + + ) +}