@parca/profile 0.16.394 → 0.16.395

package/CHANGELOG.md

@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.16.395 (2024-07-01)
+
+**Note:** Version bump only for package @parca/profile
+
 ## [0.16.394](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.393...@parca/profile@0.16.394) (2024-06-27)
 
 **Note:** Version bump only for package @parca/profile

package/dist/Callgraph/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Callgraph as CallgraphType } from '@parca/client';
 import { ProfileType } from '@parca/parser';
 export interface Props {

package/dist/GraphTooltip/ExpandOnHoverValue.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface Props {
     value: string | number | undefined;
     displayValue?: string | number | undefined;

package/dist/GraphTooltip/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { CallgraphNode, CallgraphNodeMeta, FlamegraphNode, FlamegraphNodeMeta, FlamegraphRootNode } from '@parca/client';
 import { Location, Mapping, Function as ParcaFunction } from '@parca/client/dist/parca/metastore/v1alpha1/metastore';
 interface ExtendedCallgraphNodeMeta extends CallgraphNodeMeta {

package/dist/GraphTooltipArrow/DockedGraphTooltip/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Table } from 'apache-arrow';
 import { ProfileType } from '@parca/parser';
 interface Props {

package/dist/GraphTooltipArrow/ExpandOnHoverValue.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface Props {
     value: string | number | undefined;
     displayValue?: string | number | undefined;

package/dist/MatchersInput/SuggestionItem.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface Props {
     isHighlighted: boolean;
     onHighlight: () => void;

package/dist/MatchersInput/SuggestionsList.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare class Suggestion {
     type: string;
     typeahead: string;

package/dist/MatchersInput/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { LabelsResponse, QueryServiceClient } from '@parca/client';
 import { Query } from '@parca/parser';
 interface MatchersInputProps {

package/dist/MetricsCircle/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface MetricsCircleProps {
     cx: number;
     cy: number;

package/dist/MetricsGraph/MetricsContextMenu/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { HighlightedSeries } from '../';
 interface MetricsContextMenuProps {
     menuId: string;

package/dist/MetricsGraph/MetricsInfoPanel/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface MetricsInfoPanelProps {
     isInfoPanelOpen: boolean;
     onInfoIconClick: () => void;

package/dist/MetricsGraph/MetricsTooltip/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { HighlightedSeries } from '../';
 interface Props {
     x: number;

package/dist/MetricsGraph/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Label, MetricsSeries as MetricsSeriesPb } from '@parca/client';
 import { DateTimeRange } from '@parca/components';
 import { MergedProfileSelection } from '..';

package/dist/MetricsSeries/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import * as d3 from 'd3';
 interface MetricsSeriesProps {
     data: any;

package/dist/ProfileExplorer/ProfileExplorerCompare.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { QueryServiceClient } from '@parca/client';
 import type { NavigateFunction } from '@parca/utilities';
 import { ProfileSelection } from '..';

package/dist/ProfileExplorer/ProfileExplorerSingle.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { QueryServiceClient } from '@parca/client';
 import type { NavigateFunction } from '@parca/utilities';
 import { ProfileSelection } from '..';

package/dist/ProfileExplorer/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { QueryServiceClient } from '@parca/client';
 import { type NavigateFunction } from '@parca/utilities';
 interface ProfileExplorerProps {

package/dist/ProfileIcicleGraph/IcicleGraph/ColorStackLegend.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { NavigateFunction } from '@parca/utilities';
 interface Props {
     navigateTo?: NavigateFunction;

package/dist/ProfileIcicleGraph/IcicleGraph/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Flamegraph } from '@parca/client';
 import { ProfileType } from '@parca/parser';
 import { type NavigateFunction } from '@parca/utilities';

package/dist/ProfileIcicleGraph/IcicleGraphArrow/ContextMenu.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Table } from 'apache-arrow';
 import { ProfileType } from '@parca/parser';
 import { type NavigateFunction } from '@parca/utilities';

package/dist/ProfileMetricsGraph/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { RpcError } from '@protobuf-ts/runtime-rpc';
 import { Label, QueryRangeResponse, QueryServiceClient } from '@parca/client';
 import { DateTimeRange } from '@parca/components';

package/dist/ProfileMetricsGraph/index.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright 2022 The Parca Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -17,19 +17,17 @@ import { Duration, Timestamp } from '@parca/client';
 import { MetricsGraphSkeleton, useGrpcMetadata, useParcaContext, } from '@parca/components';
 import { Query } from '@parca/parser';
 import { capitalizeOnlyFirstLetter, getStepDuration } from '@parca/utilities';
-import { useLabelNames } from '../MatchersInput';
 import MetricsGraph from '../MetricsGraph';
 import { useMetricsGraphDimensions } from '../MetricsGraph/useMetricsGraphDimensions';
 import useDelayedLoader from '../useDelayedLoader';
-import { Toolbar } from './Toolbar';
-import { useSumBy } from './useSumBy';
 const ErrorContent = ({ errorMessage }) => {
     return (_jsx("div", { className: "relative rounded border border-red-400 bg-red-100 px-4 py-3 text-red-700", role: "alert", children: _jsx("span", { className: "block sm:inline", children: errorMessage }) }));
 };
 export const ProfileMetricsEmptyState = ({ message }) => {
     return (_jsx("div", { className: "flex h-full w-full flex-col items-center justify-center", children: _jsx("p", { children: message }) }));
 };
-export const useQueryRange = (client, queryExpression, start, end, sumBy = [], skip = false) => {
+const EMPTY_SUM_BY = [];
+export const useQueryRange = (client, queryExpression, start, end, sumBy = EMPTY_SUM_BY, skip = false) => {
     const [isLoading, setLoading] = useState(!skip);
     const [state, setState] = useState({
         response: null,
@@ -67,9 +65,7 @@ export const useQueryRange = (client, queryExpression, start, end, sumBy = [], s
     return { ...state, isLoading };
 };
 const ProfileMetricsGraph = ({ queryClient, queryExpression, profile, from, to, setTimeRange, addLabelMatcher, onPointClick, comparing = false, }) => {
-    const { loading: labelNamesLoading, result: labelNamesResult } = useLabelNames(queryClient, from, to, profile?.ProfileSource()?.ProfileType()?.toString());
-    const [sumBy, setSumBy] = useSumBy(profile?.ProfileSource()?.ProfileType(), labelNamesResult.response?.labelNames);
-    const { isLoading, response, error } = useQueryRange(queryClient, queryExpression, from, to, sumBy, labelNamesLoading);
+    const { isLoading, response, error } = useQueryRange(queryClient, queryExpression, from, to);
     const isLoaderVisible = useDelayedLoader(isLoading);
     const { onError, perf, authenticationErrorMessage, isDarkMode } = useParcaContext();
     const { width, height, margin, heightStyle } = useMetricsGraphDimensions(comparing);
@@ -86,7 +82,7 @@ const ProfileMetricsGraph = ({ queryClient, queryExpression, profile, from, to,
     }, [perf, response]);
     const series = response?.series;
     const dataAvailable = series !== null && series !== undefined && series?.length > 0;
-    const metricsGraphLoading = isLoaderVisible || (isLoading && !dataAvailable && !labelNamesLoading);
+    const metricsGraphLoading = isLoaderVisible || (isLoading && !dataAvailable);
     if (metricsGraphLoading) {
         return _jsx(MetricsGraphSkeleton, { heightStyle: heightStyle, isDarkMode: isDarkMode });
     }
@@ -96,9 +92,6 @@ const ProfileMetricsGraph = ({ queryClient, queryExpression, profile, from, to,
         }
         return _jsx(ErrorContent, { errorMessage: capitalizeOnlyFirstLetter(error.message) });
     }
-    if (!labelNamesLoading && labelNamesResult?.error != null) {
-        return (_jsx(ErrorContent, { errorMessage: capitalizeOnlyFirstLetter(labelNamesResult.error.message) }));
-    }
     if (dataAvailable) {
         const handleSampleClick = (timestamp, _value, labels, duration) => {
             onPointClick(timestamp, labels, queryExpression, duration);
@@ -110,7 +103,7 @@ const ProfileMetricsGraph = ({ queryClient, queryExpression, profile, from, to,
         if (sampleUnit === '') {
             sampleUnit = Query.parse(queryExpression).profileType().sampleUnit;
         }
-        return (_jsx(AnimatePresence, { children: _jsxs(motion.div, { className: "h-full w-full relative", initial: { display: 'none', opacity: 0 }, animate: { display: 'block', opacity: 1 }, transition: { duration: 0.5 }, children: [_jsx(Toolbar, { sumBy: sumBy, setSumBy: setSumBy, labels: labelNamesResult.response?.labelNames ?? [] }), _jsx(MetricsGraph, { data: series, from: from, to: to, profile: profile, setTimeRange: setTimeRange, onSampleClick: handleSampleClick, addLabelMatcher: addLabelMatcher, sampleUnit: sampleUnit, height: height, width: width, margin: margin })] }, "metrics-graph-loaded") }));
+        return (_jsx(AnimatePresence, { children: _jsx(motion.div, { className: "h-full w-full relative", initial: { display: 'none', opacity: 0 }, animate: { display: 'block', opacity: 1 }, transition: { duration: 0.5 }, children: _jsx(MetricsGraph, { data: series, from: from, to: to, profile: profile, setTimeRange: setTimeRange, onSampleClick: handleSampleClick, addLabelMatcher: addLabelMatcher, sampleUnit: sampleUnit, height: height, width: width, margin: margin }) }, "metrics-graph-loaded") }));
     }
     return _jsx(ProfileMetricsEmptyState, { message: "No data found. Try a different query." });
 };

package/dist/ProfileSelector/CompareButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const CompareButton: ({ disabled, onClick, }: {
     disabled: boolean;
     onClick: () => void;

package/dist/ProfileSelector/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { RpcError } from '@protobuf-ts/runtime-rpc';
 import { ProfileTypesResponse, QueryServiceClient } from '@parca/client';
 import { type NavigateFunction } from '@parca/utilities';

package/dist/ProfileSource.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { ProfileDiffSelection, QueryRequest } from '@parca/client';
 import { ProfileType, Query } from '@parca/parser';
 export interface ProfileSource {

package/dist/ProfileTypeSelector/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { RpcError } from '@protobuf-ts/runtime-rpc';
 import { ProfileType, ProfileTypesResponse } from '@parca/client';
 import { type SelectElement } from '@parca/components';

package/dist/ProfileView/FilterByFunctionButton.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { NavigateFunction } from '@parca/utilities';
 declare const FilterByFunctionButton: ({ navigateTo, }: {
     navigateTo: NavigateFunction | undefined;

package/dist/ProfileView/ViewSelector.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { NavigateFunction } from '@parca/utilities';
 interface Props {
     position: number;

package/dist/ProfileView/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { Callgraph as CallgraphType, Flamegraph, FlamegraphArrow, QueryServiceClient, Source, TableArrow, Top } from '@parca/client';
 import { ProfileSource } from '../ProfileSource';
 type NavigateFunction = (path: string, queryParams: any, options?: {

package/dist/ProfileViewWithData.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { QueryServiceClient } from '@parca/client';
 import { type NavigateFunction } from '@parca/utilities';
 import { ProfileSource } from './ProfileSource';

package/dist/SourceView/LineNo.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface Props {
     value: number;
     isCurrent?: boolean;

package/dist/components/DiffLegend.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 declare const DiffLegend: () => JSX.Element;
 export default DiffLegend;

package/dist/components/ProfileShareButton/ResultBox.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface Props {
     value: string;
     className?: string;

package/dist/components/ProfileShareButton/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import { QueryRequest, QueryServiceClient } from '@parca/client';
 interface Props {
     queryRequest: QueryRequest;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@parca/profile",
-  "version": "0.16.394",
+  "version": "0.16.395",
   "description": "Profile viewing libraries",
   "dependencies": {
     "@headlessui/react": "^1.7.19",
@@ -73,5 +73,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "e31e7af178ad704e179dd20f52ef093b79f7059b"
+  "gitHead": "93b2cfe8be8c6ffea045131594c8f6f5784bdfdc"
 }

package/src/ProfileMetricsGraph/index.tsx

@@ -27,12 +27,9 @@ import {Query} from '@parca/parser';
 import {capitalizeOnlyFirstLetter, getStepDuration} from '@parca/utilities';
 
 import {MergedProfileSelection, ProfileSelection} from '..';
-import {useLabelNames} from '../MatchersInput';
 import MetricsGraph from '../MetricsGraph';
 import {useMetricsGraphDimensions} from '../MetricsGraph/useMetricsGraphDimensions';
 import useDelayedLoader from '../useDelayedLoader';
-import {Toolbar} from './Toolbar';
-import {useSumBy} from './useSumBy';
 
 interface ProfileMetricsEmptyStateProps {
   message: string;
@@ -82,12 +79,14 @@ export interface IQueryRangeState {
   error: RpcError | null;
 }
 
+const EMPTY_SUM_BY: string[] = [];
+
 export const useQueryRange = (
   client: QueryServiceClient,
   queryExpression: string,
   start: number,
   end: number,
-  sumBy: string[] = [],
+  sumBy: string[] = EMPTY_SUM_BY,
   skip = false
 ): IQueryRangeState => {
   const [isLoading, setLoading] = useState<boolean>(!skip);
@@ -145,25 +144,7 @@ const ProfileMetricsGraph = ({
   onPointClick,
   comparing = false,
 }: ProfileMetricsGraphProps): JSX.Element => {
-  const {loading: labelNamesLoading, result: labelNamesResult} = useLabelNames(
-    queryClient,
-    from,
-    to,
-    profile?.ProfileSource()?.ProfileType()?.toString()
-  );
-  const [sumBy, setSumBy] = useSumBy(
-    profile?.ProfileSource()?.ProfileType(),
-    labelNamesResult.response?.labelNames
-  );
-
-  const {isLoading, response, error} = useQueryRange(
-    queryClient,
-    queryExpression,
-    from,
-    to,
-    sumBy,
-    labelNamesLoading
-  );
+  const {isLoading, response, error} = useQueryRange(queryClient, queryExpression, from, to);
   const isLoaderVisible = useDelayedLoader(isLoading);
   const {onError, perf, authenticationErrorMessage, isDarkMode} = useParcaContext();
   const {width, height, margin, heightStyle} = useMetricsGraphDimensions(comparing);
@@ -185,8 +166,7 @@ const ProfileMetricsGraph = ({
   const series = response?.series;
   const dataAvailable = series !== null && series !== undefined && series?.length > 0;
 
-  const metricsGraphLoading =
-    isLoaderVisible || (isLoading && !dataAvailable && !labelNamesLoading);
+  const metricsGraphLoading = isLoaderVisible || (isLoading && !dataAvailable);
 
   if (metricsGraphLoading) {
     return <MetricsGraphSkeleton heightStyle={heightStyle} isDarkMode={isDarkMode} />;
@@ -200,12 +180,6 @@ const ProfileMetricsGraph = ({
     return <ErrorContent errorMessage={capitalizeOnlyFirstLetter(error.message)} />;
   }
 
-  if (!labelNamesLoading && labelNamesResult?.error != null) {
-    return (
-      <ErrorContent errorMessage={capitalizeOnlyFirstLetter(labelNamesResult.error.message)} />
-    );
-  }
-
   if (dataAvailable) {
     const handleSampleClick = (
       timestamp: number,
@@ -233,11 +207,6 @@ const ProfileMetricsGraph = ({
           animate={{display: 'block', opacity: 1}}
           transition={{duration: 0.5}}
         >
-          <Toolbar
-            sumBy={sumBy}
-            setSumBy={setSumBy}
-            labels={labelNamesResult.response?.labelNames ?? []}
-          />
           <MetricsGraph
             data={series}
             from={from}