Skip to content
This repository was archived by the owner on Apr 27, 2023. It is now read-only.

Commit 0c41605

Browse files
LoggyLoggy
committed
use data from data source plugin
1 parent 1a6cb6d commit 0c41605

File tree

3 files changed

+18
-49
lines changed

3 files changed

+18
-49
lines changed

‎src/SimplePanel.tsx‎

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,19 @@ import FlameGraphRenderer from 'components/FlameGraphRenderer';
88

99
interface Props extends PanelProps<SimpleOptions> {}
1010

11-
export const SimplePanel: React.FC<Props> = ({ options, data, width, height }) => {
11+
export const SimplePanel: React.FC<Props> = ({ options, data }) => {
1212
const theme = useTheme();
1313
const styles = getStyles();
1414
return (
1515
<>
1616
<div className={styles.app}>
1717
<div className={`${styles.appContainer} flamegraph-wrapper`}>
18-
<FlameGraphRenderer viewType="single" renderURL="/render?name=pyroscope.server.alloc_objects%7B%7D" />
18+
<FlameGraphRenderer
19+
viewType="single"
20+
renderURL="/render?name=pyroscope.server.alloc_objects%7B%7D"
21+
options={options}
22+
data={data}
23+
/>
1924
</div>
2025
</div>
2126
</>

‎src/components/FlameGraphRenderer.tsx‎

Lines changed: 4 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,6 @@ class FlameGraphRenderer extends React.Component {
6464
this.rangeMin = 0;
6565
this.rangeMax = 1;
6666
this.query = "";
67-
6867
const panelContainer = document.querySelector('.flamegraph-wrapper')?.closest('.panel-wrapper');
6968
const panelContanerResizeObserver = new ResizeObserver(this.resizeHandler);
7069
panelContanerResizeObserver.observe(panelContainer);
@@ -79,11 +78,7 @@ class FlameGraphRenderer extends React.Component {
7978
);
8079
}
8180

82-
if(this.props.viewSide === 'left' || this.props.viewSide === 'right') {
83-
this.fetchFlameBearerData(this.props[`${this.props.viewSide}RenderURL`])
84-
} else {
85-
this.fetchFlameBearerData(this.props.renderURL)
86-
}
81+
this.fetchFlameBearerData(this.props.renderURL)
8782
}
8883

8984
componentDidUpdate(prevProps, prevState) {
@@ -95,11 +90,7 @@ class FlameGraphRenderer extends React.Component {
9590
prevProps[`${this.props.viewSide}From`] != this.props[`${this.props.viewSide}From`] ||
9691
prevProps[`${this.props.viewSide}Until`] != this.props[`${this.props.viewSide}Until`]
9792
) {
98-
if(this.props.viewSide === 'left' || this.props.viewSide === 'right') {
99-
this.fetchFlameBearerData(this.props[`${this.props.viewSide}RenderURL`])
100-
} else {
101-
this.fetchFlameBearerData(this.props.renderURL)
102-
}
93+
this.fetchFlameBearerData(this.props.renderURL)
10394
}
10495

10596
if (
@@ -110,8 +101,8 @@ class FlameGraphRenderer extends React.Component {
110101
}
111102
}
112103

113-
fetchFlameBearerData(url) {
114-
const flamebearer = {names:["total","runtime.mstart","runtime.mstart1","runtime.sysmon","runtime.usleep","runtime.startm","runtime.notewakeup","runtime.futexwakeup","runtime.futex","runtime.notetsleep","runtime.notetsleep_internal","runtime.futexsleep","runtime.nanotime","runtime.lockWithRank","runtime.lock2","runtime.morestack","runtime.newstack","runtime.gopreempt_m","runtime.goschedImpl","runtime.schedule","runtime.resetspinning","runtime.wakep","runtime.mcall","runtime.park_m","runtime.findrunnable","runtime.write","runtime.write1","runtime.stopm","runtime.notesleep","runtime.runqsteal","runtime.runqgrab","runtime.pidleput","runtime.netpoll","runtime.epollwait","runtime.checkTimers","runtime.runtimer","runtime.runOneTimer","time.sendTime","time.Now","runtime.walltime","net/http.(*conn).serve","net/http.serverHandler.ServeHTTP","net/http.(*ServeMux).ServeHTTP","net/http.HandlerFunc.ServeHTTP","github.com/pyroscope-io/pyroscope/pkg/server.(*Controller).ingestHandler","github.com/pyroscope-io/pyroscope/pkg/server.ingestParamsFromRequest","runtime.newobject","runtime.nextFreeFast","github.com/pyroscope-io/pyroscope/pkg/server.(*Controller).Start.func1","net/http.(*fileHandler).ServeHTTP","net/http.serveFile","net/http.serveContent","io.Copy","io.copyBuffer","net/http.(*response).ReadFrom","io.CopyBuffer","net/http.(*response).Write","net/http.(*response).write","bufio.(*Writer).Write","net/http.(*chunkWriter).Write","net/http.checkConnErrorWriter.Write","net.(*conn).Write","net.(*netFD).Write","internal/poll.(*FD).Write","internal/poll.ignoringEINTR","syscall.Write","syscall.write","syscall.Syscall","net/http.(*conn).readRequest","net/http.readRequest","net/textproto.(*Reader).ReadMIMEHeader","runtime.slicebytetostring","runtime.memmove","github.com/pyroscope-io/pyroscope/pkg/agent/upstream/direct.(*Direct).uploadLoop","github.com/pyroscope-io/pyroscope/pkg/agent/upstream/direct.(*Direct).safeUpload","github.com/pyroscope-io/pyroscope/pkg/agent/upstream/direct.(*Direct).uploadProfile","github.com/pyroscope-io/pyroscope/pkg/storage.(*Storage).Put","github.com/pyroscope-io/pyroscope/pkg/storage/cache.(*Cache).Get","github.com/pyroscope-io/pyroscope/pkg/storage/dimension.FromBytes","github.com/pyroscope-io/pyroscope/pkg/storage/dimension.Deserialize","io.ReadAtLeast","github.com/dgraph-io/badger/v2/y.(*WaterMark).process","runtime.selectgo","github.com/dgraph-io/badger/v2.(*levelsController).runCompactor","github.com/dgraph-io/badger/v2.(*levelsController).pickCompactLevels","sort.Slice","sort.quickSort_func"],levels:[[0,78,0,0],[0,2,1,83,0,1,0,81,0,1,0,73,0,3,0,40,0,49,0,22,0,1,0,15,0,21,0,1],[1,1,0,84,0,1,1,82,0,1,0,74,0,1,0,68,0,2,0,41,0,49,0,23,0,1,0,16,0,21,0,2],[1,1,0,85,1,1,0,75,0,1,0,69,0,2,0,42,0,49,0,19,0,1,0,17,0,6,6,12,0,15,0,3],[1,1,1,86,1,1,0,76,0,1,0,70,0,2,0,43,0,36,1,24,0,6,6,12,0,7,0,20,0,1,0,18,6,1,0,13,0,7,0,9,0,4,0,5,0,3,3,4],[3,1,0,77,0,1,0,71,0,1,0,48,0,1,0,44,1,8,0,34,0,13,13,12,0,8,0,32,0,1,1,31,0,1,0,29,0,3,0,27,0,1,0,25,6,7,0,21,0,1,0,19,6,1,1,14,0,4,4,12,0,3,0,10,0,4,0,6],[3,1,0,78,0,1,1,72,0,1,0,49,0,1,0,45,1,8,0,35,13,8,8,33,1,1,1,30,0,3,1,28,0,1,1,26,6,7,0,5,0,1,0,20,11,3,0,11,0,4,0,7],[3,1,0,79,1,1,0,50,0,1,0,46,1,8,0,36,24,2,0,11,7,7,0,6,0,1,0,21,11,3,3,8,0,4,4,8],[3,1,1,80,1,1,0,51,0,1,1,47,1,8,0,37,24,2,2,8,7,7,0,7,0,1,0,5],[5,1,0,52,2,8,0,38,33,7,7,8,0,1,0,6],[5,1,0,53,2,6,6,12,0,2,2,39,40,1,0,7],[5,1,0,54,50,1,1,8],[5,1,0,55],[5,1,0,53],[5,1,0,56],[5,1,0,57],[5,1,0,58],[5,1,0,59],[5,1,0,58],[5,1,0,60],[5,1,0,61],[5,1,0,62],[5,1,0,63],[5,1,0,64],[5,1,0,65],[5,1,0,66],[5,1,1,67]],"numTicks":78,"maxSelf":13,"spyName":"gospy","sampleRate":100,"units":"samples"},metadata:{sampleRate:100,spyName:"gospy",units:"samples"},timeline:{startTime:1621014100,samples:[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,13,16,18,19,17,0],durationDelta:10};
104+
fetchFlameBearerData() {
105+
const flamebearer = this.props.data.series[this.props.data.series.length - 1].fields[0].values.buffer[0];
115106
deltaDiff(flamebearer.levels);
116107
this.setState({ ...this.state, flamebearer },
117108
() => {

‎src/module.ts‎

Lines changed: 7 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -3,38 +3,11 @@ import { SimpleOptions } from './types';
33
import { SimplePanel } from './SimplePanel';
44

55
export const plugin = new PanelPlugin<SimpleOptions>(SimplePanel).setPanelOptions(builder => {
6-
return builder
7-
.addTextInput({
8-
path: 'text',
9-
name: 'Simple text option',
10-
description: 'Description of panel option',
11-
defaultValue: 'Default value of text input option',
12-
})
13-
.addBooleanSwitch({
14-
path: 'showSeriesCount',
15-
name: 'Show series counter',
16-
defaultValue: false,
17-
})
18-
.addRadio({
19-
path: 'seriesCountSize',
20-
defaultValue: 'sm',
21-
name: 'Series counter size',
22-
settings: {
23-
options: [
24-
{
25-
value: 'sm',
26-
label: 'Small',
27-
},
28-
{
29-
value: 'md',
30-
label: 'Medium',
31-
},
32-
{
33-
value: 'lg',
34-
label: 'Large',
35-
},
36-
],
37-
},
38-
showIf: config => config.showSeriesCount,
39-
});
6+
return builder;
7+
// .addTextInput({
8+
// path: 'text',
9+
// name: 'Simple text option',
10+
// description: 'Description of panel option',
11+
// defaultValue: 'Default value of text input option',
12+
// });
4013
});

0 commit comments

Comments
 (0)