Skip to content

Commit 08e547a

Browse files
committed
load real examples
1 parent 0c5b895 commit 08e547a

File tree

9 files changed

+148
-163
lines changed

9 files changed

+148
-163
lines changed

static/app/views/issueList/pages/missionControl.tsx

Lines changed: 40 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -78,61 +78,69 @@ const EXAMPLE_CARDS: MissionControlCard[] = [
7878
priority: 11,
7979
data: {
8080
purpose:
81-
'Improve observability for the fixability endpoint to better track intermittent failures when called from Seer Scanner.',
81+
'Quantify input size causing OOM to verify root cause and inform input handling.',
8282
observability_requests: [
8383
{
8484
description:
85-
'Add detailed tracing spans around the ML model inference pipeline to track processing time and identify bottlenecks in the fixability assessment workflow.',
86-
instrument_type: 'tracing',
87-
location:
88-
'getsentry/seer/src/seer/automation/fixpoint/api.py in the process_fixability_request function',
89-
},
90-
{
91-
description:
92-
'Implement profiling to identify memory usage patterns and CPU hotspots during model loading and inference phases.',
93-
instrument_type: 'profiling',
94-
location:
95-
'getsentry/seer/src/seer/automation/models/ module, specifically in model initialization and prediction methods',
96-
},
97-
{
98-
description:
99-
'Add structured logging with correlation IDs to track requests through the entire pipeline and capture error context.',
100-
instrument_type: 'logging',
101-
location:
102-
'getsentry/seer/src/seer/automation/fixpoint/api.py throughout the request lifecycle',
103-
},
104-
{
105-
description:
106-
'Tag requests with metadata like model version, request size, and processing mode to enable better filtering and analysis.',
85+
'To quantify the size of problematic inputs and verify the hypothesis that large inputs cause OOM.',
10786
instrument_type: 'tagging',
108-
location:
109-
'getsentry/seer/src/seer/automation/fixpoint/api.py at the entry point of each request handler',
11087
},
11188
],
112-
sourceIssueId: '6678410850',
89+
sourceIssueId: '6810613041',
11390
},
114-
url: '/issues/6678410850/?seerDrawer=true',
91+
url: '/issues/6810613041/?seerDrawer=true',
11592
metadata: {
11693
source: 'hardcoded-demo',
11794
tags: ['instrumentation', 'setup'],
11895
},
11996
},
97+
12098
{
121-
id: '8',
99+
id: '9',
122100
type: 'ultragroup',
123101
createdAt: '2024-01-23T10:15:00Z',
124-
priority: 13,
102+
priority: 14,
125103
data: {
126-
title: 'Bad GitHub branch state issues',
104+
title: 'psycopg connection reused concurrently in SQLAlchemy session',
127105
description:
128-
'These issues are all caused by a bad GitHub branch state in automation agents within Seer, such as Autofix and Bug Predictor.',
129-
issueIds: [6559383058, 6770107969, 6275476616, 6723171750, 6723094719],
106+
"Multiple concurrent DB operations are issued on the same PostgreSQL connection, causing 'another command is already in progress' and autocommit state errors; some requests also hit soft time limits and dropped connections. Affected components use SQLAlchemy sessions to read/update run state and memory.",
107+
issueIds: [
108+
6621297713, 6705193811, 6705205294, 6705824065, 6724478613, 6707911641,
109+
6725125568, 6732544529,
110+
],
130111
},
131112
metadata: {
132113
source: 'hardcoded-demo',
133114
tags: ['error-cluster', 'high-priority'],
134115
},
135116
},
117+
{
118+
id: '8',
119+
type: 'missing-instrumentation',
120+
createdAt: '2024-02-22T14:30:00Z',
121+
priority: 12,
122+
data: {
123+
purpose: 'Identify bottleneck in repo initialization and affected repositories.',
124+
observability_requests: [
125+
{
126+
description:
127+
'Pinpoint exact bottleneck (download, extract, clone, sync) and identify if large repos are the cause.',
128+
instrument_type: 'tracing',
129+
},
130+
{
131+
description:
132+
'Identify if specific repositories consistently cause timeouts, helping to narrow down the problem.',
133+
instrument_type: 'tagging',
134+
},
135+
],
136+
sourceIssueId: '6603629005',
137+
},
138+
url: '/issues/6603629005/?seerDrawer=true',
139+
metadata: {
140+
source: 'hardcoded-demo',
141+
tags: ['instrumentation', 'setup'],
142+
},
143+
},
136144
];
137145

138146
function MissionControl() {

static/app/views/issueList/pages/missionControl/cards/issueCard.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -496,11 +496,13 @@ function IssueCardRenderer({card, onSetPrimaryAction}: CardRendererProps<IssueCa
496496
<Content>
497497
<RowContainer>
498498
<TitleSection>
499-
<Text size="xl" bold>
499+
<Text size="xl" variant="muted">
500500
{getReasonMessage(reason)}
501501
</Text>
502502

503-
<Text size="xl">{issue.metadata.type}</Text>
503+
<Text size="xl" bold>
504+
{issue.metadata.type}
505+
</Text>
504506

505507
<Text size="lg">{issue.metadata.value}</Text>
506508
<MetadataValueContainer>

static/app/views/issueList/pages/missionControl/cards/missingInstrumentationCard.tsx

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -200,12 +200,14 @@ function MissingInstrumentationCardRenderer({
200200
<Content>
201201
<RequestsSection>
202202
<HeaderSection>
203-
<Text size="xl" bold>
204-
{t('Observability Gap Detected')}
203+
<Text size="xl" variant="muted">
204+
{t('Seer detected an observability gap')}
205205
</Text>
206206
</HeaderSection>
207207

208-
<Text size="xl">{purpose}</Text>
208+
<Text size="xl" bold>
209+
{purpose}
210+
</Text>
209211

210212
<IssueSection>
211213
<Text size="lg" variant="muted" bold>
@@ -246,7 +248,7 @@ function MissingInstrumentationCardRenderer({
246248
</IssueSection>
247249

248250
<Text size="lg" variant="muted" bold>
249-
{t('%s recommended additions', observability_requests.length)}
251+
{t('%s recommended addition(s)', observability_requests.length)}
250252
</Text>
251253

252254
<RequestsList>
@@ -287,6 +289,8 @@ const CardContainer = styled('div')<{backgroundImage: string}>`
287289
right: 0;
288290
bottom: 0;
289291
border-radius: ${p => p.theme.borderRadius};
292+
background-color: ${p => p.theme.backgroundElevated};
293+
opacity: 0.3;
290294
}
291295
`;
292296

@@ -323,7 +327,7 @@ const RequestsSection = styled('div')`
323327
border-radius: ${p => p.theme.borderRadius};
324328
border: 1px solid ${p => p.theme.border};
325329
justify-content: center;
326-
box-shadow: ${p => p.theme.dropShadowMedium};
330+
box-shadow: ${p => p.theme.dropShadowHeavy};
327331
`;
328332

329333
const RequestsList = styled('div')`

static/app/views/issueList/pages/missionControl/cards/ultragroupCard.tsx

Lines changed: 31 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -136,10 +136,10 @@ function UltragroupCardRenderer({
136136
<CardContainer>
137137
<Content>
138138
<HeaderSection>
139+
<Text size="xl">{t('A core problem has been detected')}</Text>
139140
<Text size="xl" bold>
140-
{t('A core problem has been detected')}
141+
{title}
141142
</Text>
142-
<Text size="xl">{title}</Text>
143143
<Text size="md">{description}</Text>
144144
</HeaderSection>
145145
<LoadingError onRetry={refetch} />
@@ -153,18 +153,20 @@ function UltragroupCardRenderer({
153153
<CardContainer>
154154
<Content>
155155
<HeaderSection>
156+
<Text size="xl">{t('A core problem has been detected')}</Text>
156157
<Text size="xl" bold>
157-
{t('A core problem has been detected')}
158+
{title}
159+
</Text>
160+
<Text size="lg" density="comfortable">
161+
{description}
158162
</Text>
159-
<Text size="xl">{title}</Text>
160-
<Text size="md">{description}</Text>
161163
</HeaderSection>
162164
<IssuesPanel>
163-
<PanelBody>
165+
<ScrollablePanelBody>
164166
<EmptyStateWarning>
165167
<p>{t('No issues found matching the specified criteria.')}</p>
166168
</EmptyStateWarning>
167-
</PanelBody>
169+
</ScrollablePanelBody>
168170
</IssuesPanel>
169171
</Content>
170172
</CardContainer>
@@ -175,19 +177,23 @@ function UltragroupCardRenderer({
175177
<CardContainer>
176178
<Content>
177179
<HeaderSection>
180+
<Text size="xl" variant="muted">
181+
{t('Seer detected a core problem')}
182+
</Text>
178183
<Text size="xl" bold>
179-
{t('A core problem has been detected')}
184+
{title}
185+
</Text>
186+
<Text size="lg" density="comfortable">
187+
{description}
180188
</Text>
181-
<Text size="xl">{title}</Text>
182-
<Text size="md">{description}</Text>
183189
</HeaderSection>
184190

185191
<IssuesSection>
186192
<IssuesPanel>
187193
<HeaderContainer>
188194
<GroupListHeader withChart withColumns={COLUMNS} />
189195
</HeaderContainer>
190-
<PanelBody>
196+
<ScrollablePanelBody>
191197
{isPending
192198
? [...new Array(Math.min(issueIds.length, 4))].map((_, i) => (
193199
<GroupPlaceholder key={i}>
@@ -209,7 +215,7 @@ function UltragroupCardRenderer({
209215
/>
210216
);
211217
})}
212-
</PanelBody>
218+
</ScrollablePanelBody>
213219
</IssuesPanel>
214220
</IssuesSection>
215221
</Content>
@@ -231,13 +237,15 @@ const Content = styled('div')`
231237
display: flex;
232238
flex-direction: column;
233239
padding: ${space(3)};
234-
gap: ${space(3)};
240+
overflow: hidden;
235241
`;
236242

237243
const HeaderSection = styled('div')`
238244
display: flex;
239245
flex-direction: column;
240-
gap: ${space(1)};
246+
gap: ${space(2)};
247+
margin-bottom: ${space(3)};
248+
flex-shrink: 0;
241249
`;
242250

243251
const IssuesSection = styled('div')`
@@ -249,10 +257,12 @@ const IssuesSection = styled('div')`
249257

250258
const IssuesPanel = styled(Panel)`
251259
min-width: 0;
252-
overflow-y: auto;
260+
overflow: hidden;
253261
margin-bottom: 0 !important;
254262
flex: 1;
255263
container-type: inline-size;
264+
display: flex;
265+
flex-direction: column;
256266
`;
257267

258268
const GroupPlaceholder = styled('div')`
@@ -270,5 +280,11 @@ const HeaderContainer = styled('div')`
270280
background: ${p => p.theme.background};
271281
`;
272282

283+
const ScrollablePanelBody = styled(PanelBody)`
284+
overflow-y: auto;
285+
flex: 1;
286+
min-height: 0;
287+
`;
288+
273289
export default UltragroupCardRenderer;
274290
export type {UltragroupCard, UltragroupCardData};

static/app/views/issueList/pages/missionControl/components/themeCard.tsx

Lines changed: 12 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -22,19 +22,15 @@ function getIssueCountColor(count: number, theme: any) {
2222
return theme.red300;
2323
}
2424

25-
// Helper function to get color based on event count
26-
function getEventCountColor(count: number, theme: any) {
27-
// Events: Higher thresholds since events can occur frequently
28-
if (count < 10) return theme.gray300;
29-
if (count < 100) return theme.yellow300;
30-
if (count < 1000) return theme.red400;
31-
return theme.red300;
32-
}
33-
3425
function ThemeCard({data, onClick, isCoreProblem}: ThemeCardProps) {
35-
const {ultragroup, issueCount, totalEvents} = data;
26+
const {ultragroup, issueCount} = data;
3627
const {title, description} = ultragroup;
3728

29+
let truncatedDescription = description;
30+
if (description.length > 100) {
31+
truncatedDescription = description.slice(0, 100) + '...';
32+
}
33+
3834
return (
3935
<CardContainer
4036
onClick={onClick}
@@ -57,7 +53,7 @@ function ThemeCard({data, onClick, isCoreProblem}: ThemeCardProps) {
5753
<Title size="lg" bold isCoreProblem={isCoreProblem}>
5854
{title}
5955
</Title>
60-
<Description>{description}</Description>
56+
<Description>{truncatedDescription}</Description>
6157
</TextSection>
6258

6359
<StatsSection>
@@ -67,13 +63,6 @@ function ThemeCard({data, onClick, isCoreProblem}: ThemeCardProps) {
6763
</StatValue>
6864
<StatLabel size="xs">{tn('issue', 'Issues', issueCount)}</StatLabel>
6965
</StatItem>
70-
71-
<StatItem>
72-
<StatValue size="lg" bold count={totalEvents} type="event">
73-
<Count value={totalEvents} />
74-
</StatValue>
75-
<StatLabel size="xs">{tn('event', 'Events', totalEvents)}</StatLabel>
76-
</StatItem>
7766
</StatsSection>
7867
</Content>
7968
</CardContainer>
@@ -87,7 +76,8 @@ const CardContainer = styled('div')<{clickable: boolean}>`
8776
box-shadow: ${p => p.theme.dropShadowMedium};
8877
padding: ${space(2)};
8978
height: 180px;
90-
width: 400px;
79+
width: 350px;
80+
min-width: 350px;
9181
9282
${p =>
9383
p.clickable &&
@@ -141,7 +131,7 @@ const StatsSection = styled('div')`
141131
justify-content: center;
142132
gap: ${space(3)};
143133
flex-shrink: 0;
144-
width: 80px;
134+
width: 50px;
145135
border-left: 1px solid ${p => p.theme.innerBorder};
146136
padding-left: ${space(2)};
147137
`;
@@ -154,11 +144,8 @@ const StatItem = styled('div')`
154144
text-align: center;
155145
`;
156146

157-
const StatValue = styled(Text)<{count: number; type: 'issue' | 'event'}>`
158-
color: ${p =>
159-
p.type === 'issue'
160-
? getIssueCountColor(p.count, p.theme)
161-
: getEventCountColor(p.count, p.theme)};
147+
const StatValue = styled(Text)<{count: number; type: 'issue'}>`
148+
color: ${p => getIssueCountColor(p.count, p.theme)};
162149
`;
163150

164151
const StatLabel = styled(Text)``;

0 commit comments

Comments
 (0)