harryagasi commited on
Commit
6b435ec
·
1 Parent(s): cac20f9

fix: keep suggested questions reachable, simplify sources control, fix dark-mode logo contrast

Browse files

Adds a persistent chip strip above the chat input so business-question
suggestions stay clickable after the first message instead of disappearing,
merges the header's source-count pill and Edit sources button into one
control, and fixes disabled database-type logos being nearly invisible in
dark mode by extending the existing .knowledge-surface dark override.

src/app/components/KnowledgeManagement.tsx CHANGED
@@ -746,7 +746,7 @@ export default function KnowledgeManagement({
746
  <img
747
  src={LOGO_MAP[info.logo] ?? ""}
748
  alt={info.display_name}
749
- className={`w-8 h-8 object-contain ${!active ? "opacity-30 grayscale" : ""}`}
750
  />
751
  <span>{info.display_name}</span>
752
  {!active && (
 
746
  <img
747
  src={LOGO_MAP[info.logo] ?? ""}
748
  alt={info.display_name}
749
+ className={`w-8 h-8 object-contain ${!active ? "db-logo-disabled opacity-30 grayscale" : ""}`}
750
  />
751
  <span>{info.display_name}</span>
752
  {!active && (
src/app/components/analysis/AnalysisHeader.tsx CHANGED
@@ -49,17 +49,14 @@ export function AnalysisHeader({ analysis, staleSources = [], onUpdateDataBind }
49
  {analysis.analysis_title}
50
  </h1>
51
  <div className="flex flex-shrink-0 items-center gap-2 text-xs text-slate-500">
52
- <span className="inline-flex items-center gap-1 rounded-md border border-slate-200 px-2 py-1">
53
- <Database className="h-3.5 w-3.5" />
54
- {analysis.data_bind.length} source{analysis.data_bind.length !== 1 ? "s" : ""}
55
- </span>
56
  <button
57
  type="button"
58
  title="Update bound knowledge sources for this analysis"
59
  onClick={openSourceEditor}
60
- className="rounded-md border border-slate-200 px-2 py-1 font-medium text-slate-700 hover:bg-slate-50"
61
  >
62
- Edit sources
 
63
  </button>
64
  </div>
65
  </div>
 
49
  {analysis.analysis_title}
50
  </h1>
51
  <div className="flex flex-shrink-0 items-center gap-2 text-xs text-slate-500">
 
 
 
 
52
  <button
53
  type="button"
54
  title="Update bound knowledge sources for this analysis"
55
  onClick={openSourceEditor}
56
+ className="inline-flex items-center gap-1 rounded-md border border-slate-200 px-2 py-1 hover:bg-slate-50 hover:text-slate-800"
57
  >
58
+ <Database className="h-3.5 w-3.5" />
59
+ {analysis.data_bind.length} source{analysis.data_bind.length !== 1 ? "s" : ""}
60
  </button>
61
  </div>
62
  </div>
src/app/components/analysis/AnalysisShell.tsx CHANGED
@@ -26,6 +26,7 @@ import { MessageList } from "./MessageList";
26
  import { NewAnalysisDialog } from "./NewAnalysisDialog";
27
  import { ReportSidebar } from "./ReportSidebar";
28
  import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "../ui/resizable";
 
29
  import { clearSession, getCurrentSession } from "./session";
30
  import type { StreamState, UiMessage } from "./types";
31
  import { cx, makeLocalId } from "./utils";
@@ -347,6 +348,9 @@ export function AnalysisShell() {
347
  />
348
  )}
349
  </div>
 
 
 
350
  <ChatInput disabled={!activeAnalysis} streaming={streamState !== "idle"} onSend={handleSend} onHelp={handleHelp} />
351
  </main>
352
  );
 
26
  import { NewAnalysisDialog } from "./NewAnalysisDialog";
27
  import { ReportSidebar } from "./ReportSidebar";
28
  import { ResizableHandle, ResizablePanel, ResizablePanelGroup } from "../ui/resizable";
29
+ import { SuggestedQuestionsBar } from "./SuggestedQuestionsBar";
30
  import { clearSession, getCurrentSession } from "./session";
31
  import type { StreamState, UiMessage } from "./types";
32
  import { cx, makeLocalId } from "./utils";
 
348
  />
349
  )}
350
  </div>
351
+ {messages.length > 0 && (
352
+ <SuggestedQuestionsBar questions={activeAnalysis?.business_questions ?? []} onSelect={handleSend} />
353
+ )}
354
  <ChatInput disabled={!activeAnalysis} streaming={streamState !== "idle"} onSend={handleSend} onHelp={handleHelp} />
355
  </main>
356
  );
src/app/components/analysis/SuggestedQuestionsBar.tsx ADDED
@@ -0,0 +1,31 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ import { Lightbulb } from "lucide-react";
2
+ import { compactQuestions } from "./utils";
3
+
4
+ interface SuggestedQuestionsBarProps {
5
+ questions: string[];
6
+ onSelect: (question: string) => void;
7
+ }
8
+
9
+ export function SuggestedQuestionsBar({ questions, onSelect }: SuggestedQuestionsBarProps) {
10
+ const filtered = compactQuestions(questions);
11
+ if (filtered.length === 0) return null;
12
+
13
+ return (
14
+ <div className="flex flex-shrink-0 items-center gap-2 border-t border-slate-200 bg-white px-4 py-2">
15
+ <Lightbulb className="h-3.5 w-3.5 flex-shrink-0 text-amber-500" />
16
+ <div className="flex min-w-0 flex-1 items-center gap-1.5 overflow-x-auto">
17
+ {filtered.map((question) => (
18
+ <button
19
+ key={question}
20
+ type="button"
21
+ onClick={() => onSelect(question)}
22
+ title={question}
23
+ className="flex-shrink-0 whitespace-nowrap rounded-full border border-slate-200 bg-white px-3 py-1 text-xs text-slate-600 transition hover:border-emerald-300 hover:bg-emerald-50 hover:text-emerald-800"
24
+ >
25
+ {question}
26
+ </button>
27
+ ))}
28
+ </div>
29
+ </div>
30
+ );
31
+ }
src/styles/theme.css CHANGED
@@ -263,6 +263,12 @@
263
  background-color: #1e293b !important;
264
  }
265
 
 
 
 
 
 
 
266
  .dark .workspace-shell .bg-emerald-50,
267
  .dark .workspace-shell .bg-emerald-50\/60,
268
  .dark .knowledge-surface .bg-emerald-50,
 
263
  background-color: #1e293b !important;
264
  }
265
 
266
+ .dark .workspace-shell .db-logo-disabled,
267
+ .dark .knowledge-surface .db-logo-disabled {
268
+ opacity: 0.65 !important;
269
+ filter: grayscale(0.5) brightness(1.4) !important;
270
+ }
271
+
272
  .dark .workspace-shell .bg-emerald-50,
273
  .dark .workspace-shell .bg-emerald-50\/60,
274
  .dark .knowledge-surface .bg-emerald-50,