@parca/profile 0.16.370 → 0.16.373

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.16.373](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.372...@parca/profile@0.16.373) (2024-05-16)
+
+**Note:** Version bump only for package @parca/profile
+
+## [0.16.372](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.371...@parca/profile@0.16.372) (2024-05-16)
+
+**Note:** Version bump only for package @parca/profile
+
+## [0.16.371](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.370...@parca/profile@0.16.371) (2024-05-16)
+
+**Note:** Version bump only for package @parca/profile
+
 ## [0.16.370](https://github.com/parca-dev/parca/compare/@parca/profile@0.16.369...@parca/profile@0.16.370) (2024-05-14)
 
 **Note:** Version bump only for package @parca/profile

package/dist/ProfileSource.js

@@ -117,6 +117,11 @@ export class ProfileDiffSource {
         return (_jsx(_Fragment, { children: _jsx("p", { children: "Browse the comparison" }) }));
     }
     toString() {
+        const aDesc = this.a.toString();
+        const bDesc = this.b.toString();
+        if (aDesc === bDesc) {
+            return 'profile comparison';
+        }
         return `${this.a.toString()} compared with ${this.b.toString()}`;
     }
 }
@@ -164,6 +169,14 @@ export class MergedProfileSource {
             .map((m) => `${m.key}=${m.value}`);
     }
     toString(timezone) {
-        return `merged profiles of query "${this.query.toString()}" from ${formatDate(this.mergeFrom, timeFormat(timezone), timezone)} to ${formatDate(this.mergeTo, timeFormat(timezone), timezone)}`;
+        let queryPart = '';
+        if (this.query.toString()?.length > 0) {
+            queryPart = ` of query "${this.query.toString()}"`;
+        }
+        let timePart = '';
+        if (this.mergeFrom !== 0) {
+            timePart = ` from ${formatDate(this.mergeFrom, timeFormat(timezone), timezone)} to ${formatDate(this.mergeTo, timeFormat(timezone), timezone)}`;
+        }
+        return `merged profiles${queryPart}${timePart}`;
     }
 }

package/package.json

@@ -1,18 +1,18 @@
 {
   "name": "@parca/profile",
-  "version": "0.16.370",
+  "version": "0.16.373",
   "description": "Profile viewing libraries",
   "dependencies": {
     "@headlessui/react": "^1.7.19",
     "@iconify/react": "^4.0.0",
-    "@parca/client": "^0.16.113",
-    "@parca/components": "^0.16.275",
-    "@parca/dynamicsize": "^0.16.64",
-    "@parca/hooks": "^0.0.55",
-    "@parca/icons": "^0.16.68",
-    "@parca/parser": "^0.16.73",
-    "@parca/store": "^0.16.144",
-    "@parca/utilities": "^0.0.72",
+    "@parca/client": "^0.16.114",
+    "@parca/components": "^0.16.277",
+    "@parca/dynamicsize": "^0.16.65",
+    "@parca/hooks": "^0.0.56",
+    "@parca/icons": "^0.16.69",
+    "@parca/parser": "^0.16.74",
+    "@parca/store": "^0.16.145",
+    "@parca/utilities": "^0.0.73",
     "@popperjs/core": "^2.11.8",
     "@protobuf-ts/runtime-rpc": "^2.5.0",
     "@tanstack/react-query": "^4.0.5",
@@ -71,5 +71,5 @@
     "access": "public",
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "6fb2ee469c00ba81c6b1317771127fdf5806dced"
+  "gitHead": "80826885820b5f15cc6559c47293cad10249f85f"
 }

package/src/ProfileSource.tsx

@@ -182,6 +182,13 @@ export class ProfileDiffSource implements ProfileSource {
   }
 
   toString(): string {
+    const aDesc = this.a.toString();
+    const bDesc = this.b.toString();
+
+    if (aDesc === bDesc) {
+      return 'profile comparison';
+    }
+
     return `${this.a.toString()} compared with ${this.b.toString()}`;
   }
 }
@@ -240,10 +247,20 @@ export class MergedProfileSource implements ProfileSource {
   }
 
   toString(timezone?: string): string {
-    return `merged profiles of query "${this.query.toString()}" from ${formatDate(
-      this.mergeFrom,
-      timeFormat(timezone),
-      timezone
-    )} to ${formatDate(this.mergeTo, timeFormat(timezone), timezone)}`;
+    let queryPart = '';
+    if (this.query.toString()?.length > 0) {
+      queryPart = ` of query "${this.query.toString()}"`;
+    }
+
+    let timePart = '';
+    if (this.mergeFrom !== 0) {
+      timePart = ` from ${formatDate(
+        this.mergeFrom,
+        timeFormat(timezone),
+        timezone
+      )} to ${formatDate(this.mergeTo, timeFormat(timezone), timezone)}`;
+    }
+
+    return `merged profiles${queryPart}${timePart}`;
   }
 }

package/dist/ProfileIcicleGraph/GroupByDropdown.d.ts

@@ -1,5 +0,0 @@
-declare const GroupByDropdown: ({ groupBy, toggleGroupBy, }: {
-    groupBy: string[];
-    toggleGroupBy: (key: string) => void;
-}) => React.JSX.Element;
-export default GroupByDropdown;

package/dist/ProfileIcicleGraph/GroupByDropdown.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Menu, Transition } from '@headlessui/react';
-const GroupByDropdown = ({ groupBy, toggleGroupBy, }) => {
-    const label = groupBy.length === 0
-        ? 'Nothing'
-        : groupBy.length === 1
-            ? groupByOptions.find(option => option.value === groupBy[0])?.label
-            : 'Multiple';
-    return (_jsxs("div", { children: [_jsx("label", { className: "text-sm", children: "Group" }), _jsxs(Menu, { as: "div", className: "relative text-left", children: [_jsx("div", { children: _jsxs(Menu.Button, { className: "relative w-full cursor-default rounded-md border bg-white py-2 pl-3 pr-10 text-left text-sm shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500 dark:border-gray-600 dark:bg-gray-900 sm:text-sm", children: [_jsx("span", { className: "block overflow-x-hidden text-ellipsis", children: label }), _jsx("span", { className: "pointer-events-none absolute inset-y-0 right-0 ml-3 flex items-center pr-2 text-gray-400", children: _jsx(Icon, { icon: "heroicons:chevron-down-20-solid", "aria-hidden": "true" }) })] }) }), _jsx(Transition, { as: Fragment, leave: "transition ease-in duration-100", leaveFrom: "opacity-100", leaveTo: "opacity-0", children: _jsx(Menu.Items, { className: "absolute left-0 z-10 mt-1 min-w-[400px] overflow-auto rounded-md bg-gray-50 py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:border-gray-600 dark:bg-gray-900 dark:ring-white dark:ring-opacity-20 sm:text-sm", children: _jsx("div", { className: "p-4", children: _jsx("fieldset", { children: _jsx("div", { className: "space-y-5", children: groupByOptions.map(({ value, label, description, disabled }) => (_jsxs("div", { className: "relative flex items-start", children: [_jsx("div", { className: "flex h-6 items-center", children: _jsx("input", { id: value, name: value, type: "checkbox", disabled: disabled, className: "h-4 w-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-600", checked: groupBy.includes(value), onChange: () => toggleGroupBy(value) }) }), _jsxs("div", { className: "ml-3 text-sm leading-6", children: [_jsx("label", { htmlFor: value, className: "font-medium text-gray-900 dark:text-gray-200", children: label }), _jsx("p", { className: "text-gray-500 dark:text-gray-400", children: description })] })] }, value))) }) }) }) }) })] })] }));
-};
-export default GroupByDropdown;

package/dist/ProfileIcicleGraph/RuntimeFilterDropdown.d.ts

@@ -1,9 +0,0 @@
-declare const RuntimeFilterDropdown: ({ showRuntimeRuby, toggleShowRuntimeRuby, showRuntimePython, toggleShowRuntimePython, showInterpretedOnly, toggleShowInterpretedOnly, }: {
-    showRuntimeRuby: boolean;
-    toggleShowRuntimeRuby: () => void;
-    showRuntimePython: boolean;
-    toggleShowRuntimePython: () => void;
-    showInterpretedOnly: boolean;
-    toggleShowInterpretedOnly: () => void;
-}) => React.JSX.Element;
-export default RuntimeFilterDropdown;

package/dist/ProfileIcicleGraph/RuntimeFilterDropdown.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment } from 'react';
-import { Menu, Transition } from '@headlessui/react';
-import { Icon } from '@iconify/react';
-const RuntimeToggle = ({ id, state, toggle, label, description, }) => {
-    return (_jsxs("div", { className: "relative flex items-start", children: [_jsx("div", { className: "flex h-6 items-center", children: _jsx("input", { id: id, name: id, type: "checkbox", className: "h-4 w-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-600", checked: state, onChange: () => toggle() }) }), _jsxs("div", { className: "ml-3 text-sm leading-6", children: [_jsx("label", { htmlFor: id, className: "font-medium text-gray-900 dark:text-gray-200", children: label }), _jsx("p", { className: "text-gray-500 dark:text-gray-400", children: description })] })] }, id));
-};
-const RuntimeFilterDropdown = ({ showRuntimeRuby, toggleShowRuntimeRuby, showRuntimePython, toggleShowRuntimePython, showInterpretedOnly, toggleShowInterpretedOnly, }) => {
-    return (_jsxs("div", { children: [_jsx("label", { className: "text-sm", children: "Runtimes" }), _jsxs(Menu, { as: "div", className: "relative text-left", children: [_jsx("div", { children: _jsxs(Menu.Button, { className: "relative w-full cursor-default rounded-md border bg-white py-2 pl-3 pr-10 text-left text-sm shadow-sm focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500 dark:border-gray-600 dark:bg-gray-900 sm:text-sm", children: [_jsx("span", { className: "block overflow-x-hidden text-ellipsis", children: "Runtimes" }), _jsx("span", { className: "pointer-events-none absolute inset-y-0 right-0 ml-3 flex items-center pr-2 text-gray-400", children: _jsx(Icon, { icon: "heroicons:chevron-down-20-solid", "aria-hidden": "true" }) })] }) }), _jsx(Transition, { as: Fragment, leave: "transition ease-in duration-100", leaveFrom: "opacity-100", leaveTo: "opacity-0", children: _jsx(Menu.Items, { className: "absolute left-0 z-10 mt-1 min-w-[400px] overflow-auto rounded-md bg-gray-50 py-1 text-base shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:border-gray-600 dark:bg-gray-900 dark:ring-white dark:ring-opacity-20 sm:text-sm", children: _jsx("div", { className: "p-4", children: _jsx("fieldset", { children: _jsxs("div", { className: "space-y-5", children: [_jsx(RuntimeToggle, { id: "show-runtime-ruby", state: showRuntimeRuby, toggle: toggleShowRuntimeRuby, label: "Ruby", description: "Show Ruby runtime functions." }), _jsx(RuntimeToggle, { id: "show-runtime-python", state: showRuntimePython, toggle: toggleShowRuntimePython, label: "Python", description: "Show Python runtime functions." }), _jsx(RuntimeToggle, { id: "show-interpreted-only", state: showInterpretedOnly, toggle: toggleShowInterpretedOnly, label: "Interpreted Only", description: "Show only interpreted functions." })] }) }) }) }) })] })] }));
-};
-export default RuntimeFilterDropdown;

package/dist/ProfileIcicleGraph/SortBySelect.d.ts

@@ -1,6 +0,0 @@
-declare const SortBySelect: ({ sortBy, setSortBy, compareMode, }: {
-    sortBy: string;
-    setSortBy: (key: string) => void;
-    compareMode: boolean;
-}) => React.JSX.Element;
-export default SortBySelect;

package/dist/ProfileIcicleGraph/SortBySelect.js

@@ -1,31 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { FIELD_CUMULATIVE, FIELD_DIFF, FIELD_FUNCTION_NAME, } from './IcicleGraphArrow';
-const SortBySelect = ({ sortBy, setSortBy, compareMode, }) => {
-    return (_jsxs("div", { children: [_jsx("label", { className: "text-sm", children: "Sort" }), _jsx(Select, { items: [
-                    {
-                        key: FIELD_FUNCTION_NAME,
-                        disabled: false,
-                        element: {
-                            active: _jsx(_Fragment, { children: "Function" }),
-                            expanded: (_jsx(_Fragment, { children: _jsx("span", { children: "Function" }) })),
-                        },
-                    },
-                    {
-                        key: FIELD_CUMULATIVE,
-                        disabled: false,
-                        element: {
-                            active: _jsx(_Fragment, { children: "Cumulative" }),
-                            expanded: (_jsx(_Fragment, { children: _jsx("span", { children: "Cumulative" }) })),
-                        },
-                    },
-                    {
-                        key: FIELD_DIFF,
-                        disabled: !compareMode,
-                        element: {
-                            active: _jsx(_Fragment, { children: "Diff" }),
-                            expanded: (_jsx(_Fragment, { children: _jsx("span", { children: "Diff" }) })),
-                        },
-                    },
-                ], selectedKey: sortBy, onSelection: key => setSortBy(key), placeholder: 'Sort By', primary: false, disabled: false })] }));
-};
-export default SortBySelect;

package/dist/QueryBrowser/index.d.ts

@@ -1,12 +0,0 @@
-import { QueryServiceClient } from '@parca/client';
-import { DateTimeRange } from '@parca/components';
-import { QuerySelection } from '../ProfileSelector';
-interface Props {
-    queryClient: QueryServiceClient;
-    selectQuery: (query: QuerySelection) => void;
-    enforcedProfileName: string;
-    timeRangeSelection: DateTimeRange;
-    querySelection: QuerySelection;
-}
-declare const QueryBrowser: ({ queryClient, enforcedProfileName, timeRangeSelection, selectQuery, querySelection, }: Props) => import("react/jsx-runtime").JSX.Element;
-export default QueryBrowser;

package/dist/QueryBrowser/index.js

@@ -1,51 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import { useEffect, useState } from 'react';
-import { Query } from '@parca/parser';
-import MatchersInput from '../MatchersInput';
-const QueryBrowser = ({ queryClient, enforcedProfileName, timeRangeSelection, selectQuery, querySelection, }) => {
-    const [queryExpressionString, setQueryExpressionString] = useState(querySelection.expression);
-    useEffect(() => {
-        if (enforcedProfileName !== '') {
-            const [q, changed] = Query.parse(querySelection.expression).setProfileName(enforcedProfileName);
-            if (changed) {
-                setQueryExpressionString(q.toString());
-                return;
-            }
-        }
-        setQueryExpressionString(querySelection.expression);
-    }, [enforcedProfileName, querySelection.expression]);
-    const enforcedProfileNameQuery = () => {
-        const pq = Query.parse(queryExpressionString);
-        const [q] = pq.setProfileName(enforcedProfileName);
-        return q;
-    };
-    const setMatchersString = (matchers) => {
-        const newExpressionString = `${''}{${matchers}}`;
-        setQueryExpressionString(newExpressionString);
-    };
-    const setNewQueryExpression = (expr) => {
-        const query = enforcedProfileName !== '' ? enforcedProfileNameQuery() : Query.parse(expr);
-        const delta = query.profileType().delta;
-        const from = timeRangeSelection.getFromMs();
-        const to = timeRangeSelection.getToMs();
-        const mergeParams = delta
-            ? {
-                mergeFrom: from,
-                mergeTo: to,
-            }
-            : {};
-        selectQuery({
-            expression: expr,
-            from,
-            to,
-            timeSelection: timeRangeSelection.getRangeKey(),
-            ...mergeParams,
-        });
-    };
-    const query = enforcedProfileName !== '' ? enforcedProfileNameQuery() : Query.parse(queryExpressionString);
-    const setQueryExpression = () => {
-        setNewQueryExpression(query.toString());
-    };
-    return (_jsx(_Fragment, { children: _jsx(MatchersInput, { queryClient: queryClient, setMatchersString: setMatchersString, runQuery: setQueryExpression, currentQuery: query }) }));
-};
-export default QueryBrowser;