@parca/profile 0.16.266 → 0.16.268

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 0.16.268 (2023-10-01)
+
+**Note:** Version bump only for package @parca/profile
+
+## [0.16.267](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.266...@parca/profile@0.16.267) (2023-09-24)
+
+**Note:** Version bump only for package @parca/profile
+
 ## 0.16.266 (2023-09-23)
 
 **Note:** Version bump only for package @parca/profile

package/dist/GraphTooltipArrow/Content.js

@@ -54,10 +54,11 @@ const TooltipMetaInfo = ({ table,
 // total,
 // totalUnfiltered,
 onCopy, row, navigateTo, }) => {
-    const { labelPairs, functionFilename, file, openFile, isSourceAvailable, locationAddress, mappingFile, mappingBuildID, } = useGraphTooltipMetaInfo({ table, row, navigateTo });
+    const { labelPairs, functionFilename, file, openFile, isSourceAvailable, locationAddress, mappingFile, mappingBuildID, inlined, } = useGraphTooltipMetaInfo({ table, row, navigateTo });
     const { enableSourcesView } = useParcaContext();
     const labels = labelPairs.map((l) => (_jsx("span", { className: "mr-3 inline-block rounded-lg bg-gray-200 px-2 py-1 text-xs font-bold text-gray-700 dark:bg-gray-700 dark:text-gray-400", children: `${l[0]}="${l[1]}"` }, l[0])));
     const isMappingBuildIDAvailable = mappingBuildID !== null && mappingBuildID !== '';
-    return (_jsxs(_Fragment, { children: [_jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "File" }), _jsx("td", { className: "w-3/4 break-all", children: functionFilename === '' ? (_jsx(NoData, {})) : (_jsxs("div", { className: "flex gap-4", children: [_jsx(CopyToClipboard, { onCopy: onCopy, text: file, children: _jsx("button", { className: "cursor-pointer whitespace-nowrap text-left", children: _jsx(ExpandOnHover, { value: file, displayValue: truncateStringReverse(file, 30) }) }) }), _jsxs("div", { className: cx('flex gap-2', { hidden: enableSourcesView === false }), children: [_jsx("div", { "data-tooltip-id": "open-source-button-help", "data-tooltip-content": "There is no source code uploaded for this build", children: _jsx(Button, { variant: 'neutral', onClick: () => openFile(), className: "shrink-0", disabled: !isSourceAvailable, children: "open" }) }), !isSourceAvailable ? _jsx(Tooltip, { id: "open-source-button-help" }) : null] })] })) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Address" }), _jsx("td", { className: "w-3/4 break-all", children: locationAddress === 0n ? (_jsx(NoData, {})) : (_jsx(CopyToClipboard, { onCopy: onCopy, text: hexifyAddress(locationAddress), children: _jsx("button", { className: "cursor-pointer", children: hexifyAddress(locationAddress) }) })) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Binary" }), _jsx("td", { className: "w-3/4 break-all", children: mappingFile === null ? (_jsx(NoData, {})) : (_jsx(CopyToClipboard, { onCopy: onCopy, text: mappingFile, children: _jsx("button", { className: "cursor-pointer", children: getLastItem(mappingFile) }) })) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Build Id" }), _jsx("td", { className: "w-3/4 break-all", children: !isMappingBuildIDAvailable ? (_jsx(NoData, {})) : (_jsx(CopyToClipboard, { onCopy: onCopy, text: mappingBuildID, children: _jsx("button", { className: "cursor-pointer", children: truncateString(getLastItem(mappingBuildID), 28) }) })) })] }), labelPairs.length > 0 && (_jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Labels" }), _jsx("td", { className: "w-3/4 break-all", children: labels })] }))] }));
+    const inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
+    return (_jsxs(_Fragment, { children: [_jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "File" }), _jsx("td", { className: "w-3/4 break-all", children: functionFilename === '' ? (_jsx(NoData, {})) : (_jsxs("div", { className: "flex gap-4", children: [_jsx(CopyToClipboard, { onCopy: onCopy, text: file, children: _jsx("button", { className: "cursor-pointer whitespace-nowrap text-left", children: _jsx(ExpandOnHover, { value: file, displayValue: truncateStringReverse(file, 30) }) }) }), _jsxs("div", { className: cx('flex gap-2', { hidden: enableSourcesView === false }), children: [_jsx("div", { "data-tooltip-id": "open-source-button-help", "data-tooltip-content": "There is no source code uploaded for this build", children: _jsx(Button, { variant: 'neutral', onClick: () => openFile(), className: "shrink-0", disabled: !isSourceAvailable, children: "open" }) }), !isSourceAvailable ? _jsx(Tooltip, { id: "open-source-button-help" }) : null] })] })) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Address" }), _jsx("td", { className: "w-3/4 break-all", children: locationAddress === 0n ? (_jsx(NoData, {})) : (_jsx(CopyToClipboard, { onCopy: onCopy, text: hexifyAddress(locationAddress), children: _jsx("button", { className: "cursor-pointer", children: hexifyAddress(locationAddress) }) })) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Inlined" }), _jsx("td", { className: "w-3/4 break-all", children: _jsx(CopyToClipboard, { onCopy: onCopy, text: inlinedText, children: _jsx("button", { className: "cursor-pointer", children: inlinedText }) }) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Binary" }), _jsx("td", { className: "w-3/4 break-all", children: mappingFile === null ? (_jsx(NoData, {})) : (_jsx(CopyToClipboard, { onCopy: onCopy, text: mappingFile, children: _jsx("button", { className: "cursor-pointer", children: getLastItem(mappingFile) }) })) })] }), _jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Build Id" }), _jsx("td", { className: "w-3/4 break-all", children: !isMappingBuildIDAvailable ? (_jsx(NoData, {})) : (_jsx(CopyToClipboard, { onCopy: onCopy, text: mappingBuildID, children: _jsx("button", { className: "cursor-pointer", children: truncateString(getLastItem(mappingBuildID), 28) }) })) })] }), labelPairs.length > 0 && (_jsxs("tr", { children: [_jsx("td", { className: "w-1/4", children: "Labels" }), _jsx("td", { className: "w-3/4 break-all", children: labels })] }))] }));
 };
 export default GraphTooltipArrowContent;

package/dist/GraphTooltipArrow/DockedGraphTooltip/index.js

@@ -48,16 +48,17 @@ export const DockedGraphTooltip = ({ table, unit, total, totalUnfiltered, row, l
         row,
         level,
     });
-    const { labelPairs, functionFilename, file, openFile, isSourceAvailable, locationAddress, mappingFile, mappingBuildID, } = useGraphTooltipMetaInfo({ table, row: row ?? 0, navigateTo });
+    const { labelPairs, functionFilename, file, openFile, isSourceAvailable, locationAddress, mappingFile, mappingBuildID, inlined, } = useGraphTooltipMetaInfo({ table, row: row ?? 0, navigateTo });
     const [_, setIsDocked] = useUserPreference(USER_PREFERENCES.GRAPH_METAINFO_DOCKED.key);
     if (graphTooltipData === null) {
         return _jsx(_Fragment, {});
     }
     const { name, cumulativeText, diffText, diff } = graphTooltipData;
     const labels = labelPairs.map((l) => (_jsx("span", { className: "mr-3 inline-block rounded-lg bg-gray-200 px-2 py-1 text-xs font-bold text-gray-700 dark:bg-gray-700 dark:text-gray-400", children: `${l[0]}="${l[1]}"` }, l[0])));
+    const inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
     const addressText = locationAddress !== 0n ? hexifyAddress(locationAddress) : 'unknown';
     const fileText = functionFilename !== '' ? file : 'Not available';
     return (_jsx("div", { className: "fixed bottom-0 z-20 overflow-hidden rounded-t-lg border-l border-r border-t border-gray-400 bg-white bg-opacity-90 px-8 py-3 dark:border-gray-600 dark:bg-black dark:bg-opacity-80", style: { width }, children: _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex justify-between gap-4", children: [row === 0 ? (_jsx("p", { children: "root" })) : (_jsx(_Fragment, { children: name !== '' ? (_jsx(CopyToClipboard, { onCopy: onCopy, text: name, children: _jsx("button", { className: "cursor-pointer text-left", children: name }) })) : (_jsx(_Fragment, { children: locationAddress !== 0n ? (_jsx(CopyToClipboard, { onCopy: onCopy, text: hexifyAddress(locationAddress), children: _jsx("button", { className: "cursor-pointer text-left", children: hexifyAddress(locationAddress) }) })) : (_jsx("p", { children: "unknown" })) })) })), _jsx(IconButton, { onClick: () => setIsDocked(false), icon: "mdi:dock-window", title: "Undock MetaInfo Panel" })] }), _jsxs("div", { className: "flex justify-between gap-3", children: [_jsx(InfoSection, { title: "Cumulative", value: cumulativeText, onCopy: onCopy, copyText: cumulativeText, minWidth: "w-44" }), diff !== 0n ? (_jsx(InfoSection, { title: "Diff", value: diffText, onCopy: onCopy, copyText: diffText, minWidth: "w-44" })) : null, _jsx(InfoSection, { title: "File", value: _jsxs("div", { className: "flex gap-2", children: [_jsx(ExpandOnHover, { value: fileText, displayValue: truncateStringReverse(fileText, 45) }), _jsxs("div", { className: cx('flex items-center gap-2', {
                                             hidden: enableSourcesView === false || functionFilename === '',
-                                        }), children: [_jsx("div", { "data-tooltip-id": "open-source-button-help", "data-tooltip-content": "There is no source code uploaded for this build", children: _jsx(Button, { variant: 'neutral', onClick: () => openFile(), className: "shrink-0", disabled: !isSourceAvailable, children: "open" }) }), !isSourceAvailable ? _jsx(Tooltip, { id: "open-source-button-help" }) : null] })] }), onCopy: onCopy, copyText: file, minWidth: 'w-[460px]' }), _jsx(InfoSection, { title: "Address", value: addressText, onCopy: onCopy, copyText: addressText, minWidth: "w-44" }), _jsx(InfoSection, { title: "Binary", value: (mappingFile != null ? getLastItem(mappingFile) : null) ?? 'Not available', onCopy: onCopy, copyText: mappingFile ?? 'Not available', minWidth: "w-44" }), _jsx(InfoSection, { title: "Build ID", value: truncateString(getLastItem(mappingBuildID) ?? 'Not available', 28), onCopy: onCopy, copyText: mappingBuildID ?? 'Not available' })] }), _jsx("div", { children: _jsx("div", { className: "flex h-5 gap-1", children: labels }) }), _jsx("span", { className: "mx-2 block text-xs text-gray-500", children: isCopied ? 'Copied!' : 'Hold shift and click on a value to copy.' })] }) }));
+                                        }), children: [_jsx("div", { "data-tooltip-id": "open-source-button-help", "data-tooltip-content": "There is no source code uploaded for this build", children: _jsx(Button, { variant: 'neutral', onClick: () => openFile(), className: "shrink-0", disabled: !isSourceAvailable, children: "open" }) }), !isSourceAvailable ? _jsx(Tooltip, { id: "open-source-button-help" }) : null] })] }), onCopy: onCopy, copyText: file, minWidth: 'w-[460px]' }), _jsx(InfoSection, { title: "Address", value: addressText, onCopy: onCopy, copyText: addressText, minWidth: "w-44" }), _jsx(InfoSection, { title: "Inlined", value: inlinedText, onCopy: onCopy, copyText: inlinedText, minWidth: "w-44" }), _jsx(InfoSection, { title: "Binary", value: (mappingFile != null ? getLastItem(mappingFile) : null) ?? 'Not available', onCopy: onCopy, copyText: mappingFile ?? 'Not available', minWidth: "w-44" }), _jsx(InfoSection, { title: "Build ID", value: truncateString(getLastItem(mappingBuildID) ?? 'Not available', 28), onCopy: onCopy, copyText: mappingBuildID ?? 'Not available' })] }), _jsx("div", { children: _jsx("div", { className: "flex h-5 gap-1", children: labels }) }), _jsx("span", { className: "mx-2 block text-xs text-gray-500", children: isCopied ? 'Copied!' : 'Hold shift and click on a value to copy.' })] }) }));
 };

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

@@ -14,6 +14,7 @@ interface GraphTooltipMetaInfoData {
     locationAddress: bigint;
     mappingFile: string | null;
     mappingBuildID: string | null;
+    inlined: boolean | null;
 }
 export declare const useGraphTooltipMetaInfo: ({ table, row, navigateTo, }: Props) => GraphTooltipMetaInfoData;
 export {};

package/dist/GraphTooltipArrow/useGraphTooltipMetaInfo/index.js

@@ -12,7 +12,7 @@
 // limitations under the License.
 import { QueryRequest_ReportType } from '@parca/client';
 import { useParcaContext, useURLState } from '@parca/components';
-import { FIELD_FUNCTION_FILE_NAME, FIELD_FUNCTION_START_LINE, FIELD_LOCATION_ADDRESS, FIELD_LOCATION_LINE, FIELD_MAPPING_BUILD_ID, FIELD_MAPPING_FILE, } from '../../ProfileIcicleGraph/IcicleGraphArrow';
+import { FIELD_FUNCTION_FILE_NAME, FIELD_FUNCTION_START_LINE, FIELD_INLINED, FIELD_LOCATION_ADDRESS, FIELD_LOCATION_LINE, FIELD_MAPPING_BUILD_ID, FIELD_MAPPING_FILE, } from '../../ProfileIcicleGraph/IcicleGraphArrow';
 import { arrowToString } from '../../ProfileIcicleGraph/IcicleGraphArrow/utils';
 import { useProfileViewContext } from '../../ProfileView/ProfileViewContext';
 import { useQuery } from '../../useQuery';
@@ -20,6 +20,7 @@ export const useGraphTooltipMetaInfo = ({ table, row, navigateTo, }) => {
     const mappingFile = arrowToString(table.getChild(FIELD_MAPPING_FILE)?.get(row));
     const mappingBuildID = arrowToString(table.getChild(FIELD_MAPPING_BUILD_ID)?.get(row));
     const locationAddress = table.getChild(FIELD_LOCATION_ADDRESS)?.get(row) ?? 0n;
+    const inlined = table.getChild(FIELD_INLINED)?.get(row);
     const locationLine = table.getChild(FIELD_LOCATION_LINE)?.get(row) ?? 0n;
     const functionFilename = arrowToString(table.getChild(FIELD_FUNCTION_FILE_NAME)?.get(row)) ?? '';
     const functionStartLine = table.getChild(FIELD_FUNCTION_START_LINE)?.get(row) ?? 0n;
@@ -90,5 +91,6 @@ export const useGraphTooltipMetaInfo = ({ table, row, navigateTo, }) => {
         locationAddress,
         mappingBuildID,
         mappingFile,
+        inlined,
     };
 };

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

@@ -6,6 +6,7 @@ export declare const FIELD_MAPPING_FILE = "mapping_file";
 export declare const FIELD_MAPPING_BUILD_ID = "mapping_build_id";
 export declare const FIELD_LOCATION_ADDRESS = "location_address";
 export declare const FIELD_LOCATION_LINE = "location_line";
+export declare const FIELD_INLINED = "inlined";
 export declare const FIELD_FUNCTION_NAME = "function_name";
 export declare const FIELD_FUNCTION_FILE_NAME = "function_file_name";
 export declare const FIELD_FUNCTION_START_LINE = "function_startline";

package/dist/ProfileIcicleGraph/IcicleGraphArrow/index.js

@@ -27,6 +27,7 @@ export const FIELD_MAPPING_FILE = 'mapping_file';
 export const FIELD_MAPPING_BUILD_ID = 'mapping_build_id';
 export const FIELD_LOCATION_ADDRESS = 'location_address';
 export const FIELD_LOCATION_LINE = 'location_line';
+export const FIELD_INLINED = 'inlined';
 export const FIELD_FUNCTION_NAME = 'function_name';
 export const FIELD_FUNCTION_FILE_NAME = 'function_file_name';
 export const FIELD_FUNCTION_START_LINE = 'function_startline';

package/dist/ProfileIcicleGraph/index.js

@@ -19,7 +19,7 @@ import { USER_PREFERENCES, useUserPreference } from '@parca/hooks';
 import { capitalizeOnlyFirstLetter, divide, selectQueryParam, } from '@parca/utilities';
 import DiffLegend from '../components/DiffLegend';
 import IcicleGraph from './IcicleGraph';
-import IcicleGraphArrow, { FIELD_CUMULATIVE, FIELD_DIFF, FIELD_FUNCTION_NAME, FIELD_LABELS, } from './IcicleGraphArrow';
+import IcicleGraphArrow, { FIELD_CUMULATIVE, FIELD_DIFF, FIELD_FUNCTION_FILE_NAME, FIELD_FUNCTION_NAME, FIELD_LABELS, FIELD_LOCATION_ADDRESS, FIELD_MAPPING_FILE, } from './IcicleGraphArrow';
 const numberFormatter = new Intl.NumberFormat('en-US');
 const ErrorContent = ({ errorMessage }) => {
     return _jsx("div", { className: "flex justify-center p-10", children: errorMessage });
@@ -129,6 +129,24 @@ const groupByOptions = [
         description: 'Stacktraces are grouped by pprof labels.',
         disabled: false,
     },
+    {
+        value: FIELD_FUNCTION_FILE_NAME,
+        label: 'Filename',
+        description: 'Stacktraces are grouped by filenames.',
+        disabled: false,
+    },
+    {
+        value: FIELD_LOCATION_ADDRESS,
+        label: 'Address',
+        description: 'Stacktraces are grouped by addresses.',
+        disabled: false,
+    },
+    {
+        value: FIELD_MAPPING_FILE,
+        label: 'Binary',
+        description: 'Stacktraces are grouped by binaries.',
+        disabled: false,
+    },
 ];
 const GroupByDropdown = ({ groupBy, toggleGroupBy, }) => {
     const label = groupBy.length === 0

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@parca/profile",
-  "version": "0.16.266",
+  "version": "0.16.268",
   "description": "Profile viewing libraries",
   "dependencies": {
     "@parca/client": "^0.16.89",
-    "@parca/components": "^0.16.202",
+    "@parca/components": "^0.16.203",
     "@parca/dynamicsize": "^0.16.55",
     "@parca/hooks": "^0.0.26",
-    "@parca/parser": "^0.16.57",
+    "@parca/parser": "^0.16.58",
     "@parca/store": "^0.16.106",
     "@parca/utilities": "^0.0.34",
     "@tanstack/react-query": "^4.0.5",
@@ -29,7 +29,7 @@
   "devDependencies": {
     "@types/d3": "7.4.0",
     "@types/react-copy-to-clipboard": "5.0.4",
-    "@types/react-syntax-highlighter": "^15.5.7"
+    "@types/react-syntax-highlighter": "15.5.7"
   },
   "resolutions": {
     "konva": "8.4.3"
@@ -49,5 +49,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "b1d3170872f412caf5099d48426c35c3b991f67f"
+  "gitHead": "355b09e20fe97aeb7e545547182f70e2f8665854"
 }

package/src/GraphTooltipArrow/Content.tsx

@@ -179,6 +179,7 @@ const TooltipMetaInfo = ({
     locationAddress,
     mappingFile,
     mappingBuildID,
+    inlined,
   } = useGraphTooltipMetaInfo({table, row, navigateTo});
   const {enableSourcesView} = useParcaContext();
 
@@ -194,6 +195,7 @@ const TooltipMetaInfo = ({
   );
 
   const isMappingBuildIDAvailable = mappingBuildID !== null && mappingBuildID !== '';
+  const inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
 
   return (
     <>
@@ -241,6 +243,14 @@ const TooltipMetaInfo = ({
           )}
         </td>
       </tr>
+      <tr>
+        <td className="w-1/4">Inlined</td>
+        <td className="w-3/4 break-all">
+          <CopyToClipboard onCopy={onCopy} text={inlinedText}>
+            <button className="cursor-pointer">{inlinedText}</button>
+          </CopyToClipboard>
+        </td>
+      </tr>
       <tr>
         <td className="w-1/4">Binary</td>
         <td className="w-3/4 break-all">

package/src/GraphTooltipArrow/DockedGraphTooltip/index.tsx

@@ -105,6 +105,7 @@ export const DockedGraphTooltip = ({
     locationAddress,
     mappingFile,
     mappingBuildID,
+    inlined,
   } = useGraphTooltipMetaInfo({table, row: row ?? 0, navigateTo});
 
   const [_, setIsDocked] = useUserPreference(USER_PREFERENCES.GRAPH_METAINFO_DOCKED.key);
@@ -126,6 +127,7 @@ export const DockedGraphTooltip = ({
     )
   );
 
+  const inlinedText = inlined === null ? 'merged' : inlined ? 'yes' : 'no';
   const addressText = locationAddress !== 0n ? hexifyAddress(locationAddress) : 'unknown';
   const fileText = functionFilename !== '' ? file : 'Not available';
 
@@ -223,6 +225,13 @@ export const DockedGraphTooltip = ({
             copyText={addressText}
             minWidth="w-44"
           />
+          <InfoSection
+            title="Inlined"
+            value={inlinedText}
+            onCopy={onCopy}
+            copyText={inlinedText}
+            minWidth="w-44"
+          />
           <InfoSection
             title="Binary"
             value={(mappingFile != null ? getLastItem(mappingFile) : null) ?? 'Not available'}

package/src/GraphTooltipArrow/useGraphTooltipMetaInfo/index.ts

@@ -20,6 +20,7 @@ import type {NavigateFunction} from '@parca/utilities';
 import {
   FIELD_FUNCTION_FILE_NAME,
   FIELD_FUNCTION_START_LINE,
+  FIELD_INLINED,
   FIELD_LOCATION_ADDRESS,
   FIELD_LOCATION_LINE,
   FIELD_MAPPING_BUILD_ID,
@@ -45,6 +46,7 @@ interface GraphTooltipMetaInfoData {
   locationAddress: bigint;
   mappingFile: string | null;
   mappingBuildID: string | null;
+  inlined: boolean | null;
 }
 
 export const useGraphTooltipMetaInfo = ({
@@ -57,6 +59,7 @@ export const useGraphTooltipMetaInfo = ({
     table.getChild(FIELD_MAPPING_BUILD_ID)?.get(row)
   );
   const locationAddress: bigint = table.getChild(FIELD_LOCATION_ADDRESS)?.get(row) ?? 0n;
+  const inlined: boolean | null = table.getChild(FIELD_INLINED)?.get(row);
   const locationLine: bigint = table.getChild(FIELD_LOCATION_LINE)?.get(row) ?? 0n;
   const functionFilename: string =
     arrowToString(table.getChild(FIELD_FUNCTION_FILE_NAME)?.get(row)) ?? '';
@@ -149,5 +152,6 @@ export const useGraphTooltipMetaInfo = ({
     locationAddress,
     mappingBuildID,
     mappingFile,
+    inlined,
   };
 };

package/src/ProfileIcicleGraph/IcicleGraphArrow/index.tsx

@@ -44,6 +44,7 @@ export const FIELD_MAPPING_FILE = 'mapping_file';
 export const FIELD_MAPPING_BUILD_ID = 'mapping_build_id';
 export const FIELD_LOCATION_ADDRESS = 'location_address';
 export const FIELD_LOCATION_LINE = 'location_line';
+export const FIELD_INLINED = 'inlined';
 export const FIELD_FUNCTION_NAME = 'function_name';
 export const FIELD_FUNCTION_FILE_NAME = 'function_file_name';
 export const FIELD_FUNCTION_START_LINE = 'function_startline';

package/src/ProfileIcicleGraph/index.tsx

@@ -31,8 +31,11 @@ import IcicleGraph from './IcicleGraph';
 import IcicleGraphArrow, {
   FIELD_CUMULATIVE,
   FIELD_DIFF,
+  FIELD_FUNCTION_FILE_NAME,
   FIELD_FUNCTION_NAME,
   FIELD_LABELS,
+  FIELD_LOCATION_ADDRESS,
+  FIELD_MAPPING_FILE,
 } from './IcicleGraphArrow';
 
 const numberFormatter = new Intl.NumberFormat('en-US');
@@ -303,6 +306,24 @@ const groupByOptions = [
     description: 'Stacktraces are grouped by pprof labels.',
     disabled: false,
   },
+  {
+    value: FIELD_FUNCTION_FILE_NAME,
+    label: 'Filename',
+    description: 'Stacktraces are grouped by filenames.',
+    disabled: false,
+  },
+  {
+    value: FIELD_LOCATION_ADDRESS,
+    label: 'Address',
+    description: 'Stacktraces are grouped by addresses.',
+    disabled: false,
+  },
+  {
+    value: FIELD_MAPPING_FILE,
+    label: 'Binary',
+    description: 'Stacktraces are grouped by binaries.',
+    disabled: false,
+  },
 ];
 
 const GroupByDropdown = ({