[WIP] broken data plugin usage, can't resolve promise

Signed-off-by: inge4pres <francesco.gualazzi@elastic.co>

src/plugins/profiling/public/app.tsx

@@ -38,14 +38,18 @@ function App({ fetchTopN, fetchElasticFlamechart, fetchPixiFlamechart, fetchTopN
  samples: [],
  series: new Map(),
  });
+ const [topnData, setTopNData] = useState({
+ samples: [],
+ series: new Map(),
+ });
 
  const [elasticFlamegraph, setElasticFlamegraph] = useState({ leaves: [] });
  const [pixiFlamegraph, setPixiFlamegraph] = useState({});
 
  const tabs = [
  {
  id: 'stacktrace-elastic',
- name: 'Stack Traces (Elastic)',
+ name: 'Stack Traces (API)',
  content: (
  <>
  <EuiSpacer />
@@ -57,6 +61,20 @@ function App({ fetchTopN, fetchElasticFlamechart, fetchPixiFlamechart, fetchTopN
  </>
  ),
  },
+ {
+ id: 'stacktrace-elastic-data',
+ name: 'Stack Traces (Data Plugin)',
+ content: (
+ <>
+ <EuiSpacer />
+ <TopNContext.Provider value={topnData}>
+ <StackTraceNavigation fetchTopN={fetchTopNData} setTopN={setTopNData} />
+ <StackedBarChart id="topn-data" name="topn-data" height={400} x="x" y="y" category="g" />
+ <ChartGrid maximum={10} />
+ </TopNContext.Provider>
+ </>
+ ),
+ },
  {
  id: 'flamegraph-elastic',
  name: 'FlameGraph (Elastic)',

src/plugins/profiling/public/components/contexts/topn.tsx

@@ -8,4 +8,4 @@
 
 import { createContext } from 'react';
 
-export const TopNContext = createContext();
+export const TopNContext = createContext({});

src/plugins/profiling/public/components/stacktrace-nav.tsx

@@ -101,13 +101,19 @@ export const StackTraceNavigation = ({ fetchTopN, setTopN }) => {
  });
 
  console.log(new Date().toISOString(), 'started payload retrieval');
- fetchTopN(topnValue[0].value, dateValue[0].value).then((response) => {
- console.log(new Date().toISOString(), 'finished payload retrieval');
- const samples = getTopN(response);
- const series = groupSamplesByCategory(samples);
- setTopN({ samples, series });
- console.log(new Date().toISOString(), 'updated local state');
- });
+ fetchTopN(topnValue[0].value, dateValue[0].value)
+ .then((response) => {
+ console.log(new Date().toISOString(), 'finished payload retrieval');
+ const samples = getTopN(response);
+ const series = groupSamplesByCategory(samples);
+ console.log('sample %o', samples);
+ console.log('series %o', series);
+ setTopN({ samples, series });
+ console.log(new Date().toISOString(), 'updated local state');
+ })
+ .catch((err) => {
+ console.log('error when reading topN data: ' + err.message);
+ });
  }, [toggleTopNSelected, toggleDateSelected]);
 
  return (

src/plugins/profiling/public/services.ts

@@ -9,14 +9,18 @@
 import { CoreStart, HttpFetchError, HttpFetchQuery } from 'kibana/public';
 import { getRemoteRoutePaths } from '../common';
 import { ProdfilerPluginStartDeps } from './plugin';
-import { DownsampledRequest, DownsampledTopNResponse } from '../common/types';
+import {
+ DOWNSAMPLED_TOPN_STRATEGY,
+ DownsampledRequest,
+ DownsampledTopNResponse,
+ TopNAggregateResponse,
+} from '../common/types';
 
 export interface Services {
  fetchTopN: (type: string, seconds: string) => Promise<any[] | HttpFetchError>;
  fetchElasticFlamechart: (seconds: string) => Promise<any[] | HttpFetchError>;
  fetchPixiFlamechart: (seconds: string) => Promise<any[] | HttpFetchError>;
- // FIXME
- fetchTopNData?: (searchField: string, seconds: string) => Promise<DownsampledTopNResponse>;
+ fetchTopNData: (searchField: string, seconds: string) => Promise<TopNAggregateResponse>;
 }
 
 function getFetchQuery(seconds: string): HttpFetchQuery {
@@ -36,28 +40,44 @@ export function getServices(core: CoreStart, data?: ProdfilerPluginStartDeps): S
  const paths = getRemoteRoutePaths();
 
  return {
- fetchTopNData: (searchField: string, seconds: string): Promise<DownsampledTopNResponse> => {
+ fetchTopNData: async (searchField: string, seconds: string): Promise<TopNAggregateResponse> => {
  const unixTime = Math.floor(Date.now() / 1000);
- return (
- data!.data.search
- .search<DownsampledRequest, DownsampledTopNResponse>(
- {
- params: {
- projectID: 5,
- timeFrom: unixTime - parseInt(seconds, 10),
- timeTo: unixTime,
- // FIXME remove hard-coded value for topN items length and expose it through the UI
- topNItems: 100,
- searchField,
- },
+ const response: TopNAggregateResponse = { topN: { histogram: { buckets: [] } } };
+ data!.data.search
+ .search<DownsampledRequest, DownsampledTopNResponse>(
+ {
+ params: {
+ projectID: 5,
+ timeFrom: unixTime - parseInt(seconds, 10),
+ timeTo: unixTime,
+ // FIXME remove hard-coded value for topN items length and expose it through the UI
+ topNItems: 100,
+ searchField,
  },
- {
- strategy: 'downsampledTopN',
- }
- )
- // get the results and prepare the Promise
- .toPromise<DownsampledTopNResponse>()
- );
+ },
+ {
+ strategy: DOWNSAMPLED_TOPN_STRATEGY,
+ }
+ )
+ .subscribe({
+ next: (result) => {
+ console.log('subscription data plugin rawResponse: %o', result.rawResponse);
+ response.topN.histogram = result.rawResponse.aggregations.histogram;
+ },
+ // TODO error handling
+ error: (err) => {
+ console.log('subscription error: %o', err);
+ },
+ // FIXME remove this, used for debugging only
+ complete: () => {
+ console.log('subscription completed');
+ },
+ });
+
+ console.log('returning Promise of TopNAggregateResponse');
+ return await new Promise<TopNAggregateResponse>((resolve, _) => {
+ return resolve(response);
+ });
  },
 
  fetchTopN: async (type: string, seconds: string) => {

src/plugins/profiling/server/search/strategy.ts

@@ -8,47 +8,62 @@
 
 import { SearchTotalHits } from '@elastic/elasticsearch/lib/api/types';
 import { IEsSearchRequest, ISearchStrategy, PluginStart } from '../../../data/server';
-import { autoHistogramSumCountOnGroupByField, newProjectTimeQuery } from '../routes/mappings';
+import {
+ autoHistogramSumCountOnGroupByField,
+ newProjectTimeQuery,
+ ProjectTimeQuery,
+} from '../routes/mappings';
 import { downsampledIndex, getSampledTraceEventsIndex } from '../routes/search_flamechart';
 import { DownsampledRequest, DownsampledTopNResponse } from '../../common/types';
 
 export const DownsampledTopNFactory = (
  data: PluginStart
 ): ISearchStrategy<DownsampledRequest, DownsampledTopNResponse> => {
  const es = data.search.getSearchStrategy();
+
+ // FIXME these 2 constants should be configurable?
+ const initialExp = 6;
+ const targetSampleSize = 20000; // minimum number of samples to get statistically sound results
+
+ // Calculate the right down-sampled index to query data from
+ const sampleCountFromInitialExp = (filter: ProjectTimeQuery, options, deps): number => {
+ // By default, we return no samples and use the un-sampled index
+ let sampleCount = 0;
+ es.search(
+ {
+ params: {
+ index: downsampledIndex + initialExp,
+ body: {
+ query: filter,
+ size: 0,
+ track_total_hits: true,
+ },
+ },
+ },
+ options,
+ deps
+ ).subscribe({
+ next: (value) => {
+ sampleCount = (value.rawResponse.hits.total as SearchTotalHits).value;
+ },
+ });
+ return sampleCount;
+ };
  return {
- search: async (request, options, deps) => {
+ search: (request, options, deps) => {
  const { projectID, timeFrom, timeTo, topNItems, searchField } = request.params!;
  const filter = newProjectTimeQuery(
  projectID.toString(),
  timeFrom.toString(),
  timeTo.toString()
  );
 
- // FIXME these 2 constants should be configurable?
- const initialExp = 6;
- const targetSampleSize = 20000; // minimum number of samples to get statistically sound results
- // Calculate the right down-sampled index to query data from
- const sampleCountFromInitialExp = async (): Promise<number> => {
- return await deps.esClient.asInternalUser
- .search({
- index: downsampledIndex + initialExp,
- body: {
- query: filter,
- size: 0,
- track_total_hits: true,
- },
- })
- .then((resp) => {
- return (resp.body.hits?.total as SearchTotalHits).value;
- });
- };
  // Create the query for the actual data
  const downsampledReq = {
  params: {
  index: getSampledTraceEventsIndex(
  targetSampleSize,
- await sampleCountFromInitialExp(),
+ sampleCountFromInitialExp(filter, options, deps),
  initialExp
  ).name,
  body: {