Fixing the groupby field name and some UI fixes

parca-dev · Feb 12, 2025 · 4393d9a · 4393d9a
1 parent 39a8752
commit 4393d9a
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 7 deletions.
diff --git a/pkg/query/columnquery.go b/pkg/query/columnquery.go
@@ -241,11 +241,11 @@ func (q *ColumnQueryAPI) Query(ctx context.Context, req *pb.QueryRequest) (*pb.Q
 		FlamegraphFieldFunctionName:     {},
 		FlamegraphFieldLocationAddress:  {},
 		FlamegraphFieldMappingFile:      {},
-		FlamegraphFieldTimestamp:        {},
+		profile.ColumnTimeNanos:         {},
 	}
 
 	if req.GetReportType() == pb.QueryRequest_REPORT_TYPE_FLAMECHART {
-		groupBy = append(groupBy, FlamegraphFieldTimestamp, FlamegraphFieldDuration)
+		groupBy = append(groupBy, profile.ColumnTimeNanos, FlamegraphFieldDuration)
 	}
 
 	groupByLabels := make([]string, 0, len(groupBy))

diff --git a/ui/packages/shared/profile/src/GraphTooltipArrow/Content.tsx b/ui/packages/shared/profile/src/GraphTooltipArrow/Content.tsx
@@ -16,8 +16,9 @@ import React from 'react';
 import {Icon} from '@iconify/react';
 import {Table} from 'apache-arrow';
 
+import {useParcaContext} from '@parca/components';
 import {ProfileType} from '@parca/parser';
-import {getLastItem} from '@parca/utilities';
+import {formatDateTimeDownToMS, getLastItem} from '@parca/utilities';
 
 import {hexifyAddress, truncateString, truncateStringReverse} from '../utils';
 import {ExpandOnHover} from './ExpandOnHoverValue';
@@ -141,7 +142,9 @@ const TooltipMetaInfo = ({table, row}: {table: Table<any>; row: number}): React.
     mappingFile,
     mappingBuildID,
     inlined,
+    timestamp,
   } = useGraphTooltipMetaInfo({table, row});
+  const {timezone} = useParcaContext();
 
   const labels = labelPairs.map(
     (l): React.JSX.Element => (
@@ -159,9 +162,19 @@ const TooltipMetaInfo = ({table, row}: {table: Table<any>; row: number}): React.
 
   return (
     <>
+      {timestamp == null || timestamp === 0n ? (
+        <div className="pt-2" />
+      ) : (
+        <tr>
+          <td className="w-1/4 pt-2">Timestamp</td>
+          <td className="w-3/4 pt-2 break-all">
+            {formatDateTimeDownToMS(new Date(Number(timestamp / 1000000n)), timezone)}
+          </td>{' '}
+        </tr>
+      )}
       <tr>
-        <td className="w-1/4 pt-2">File</td>
-        <td className="w-3/4 pt-2 break-all">
+        <td className="w-1/4">File</td>
+        <td className="w-3/4 break-all">
           {functionFilename === '' ? (
             <NoData />
           ) : (

diff --git a/ui/packages/shared/profile/src/GraphTooltipArrow/useGraphTooltipMetaInfo/index.ts b/ui/packages/shared/profile/src/GraphTooltipArrow/useGraphTooltipMetaInfo/index.ts
@@ -25,6 +25,7 @@ import {
   FIELD_LOCATION_LINE,
   FIELD_MAPPING_BUILD_ID,
   FIELD_MAPPING_FILE,
+  FIELD_TIMESTAMP,
 } from '../../ProfileIcicleGraph/IcicleGraphArrow';
 import {arrowToString} from '../../ProfileIcicleGraph/IcicleGraphArrow/utils';
 import {ProfileSource} from '../../ProfileSource';
@@ -47,6 +48,7 @@ interface GraphTooltipMetaInfoData {
   mappingFile: string | null;
   mappingBuildID: string | null;
   inlined: boolean | null;
+  timestamp: bigint | null;
 }
 
 export const useGraphTooltipMetaInfo = ({table, row}: Props): GraphTooltipMetaInfoData => {
@@ -66,6 +68,7 @@ export const useGraphTooltipMetaInfo = ({table, row}: Props): GraphTooltipMetaIn
     locationLine !== 0n ? locationLine : functionStartLine !== 0n ? functionStartLine : undefined;
   const labelPrefix = 'labels.';
   const labelColumnNames = table.schema.fields.filter(field => field.name.startsWith(labelPrefix));
+  const timestamp = table.getChild(FIELD_TIMESTAMP)?.get(row);
 
   const {queryServiceClient, enableSourcesView} = useParcaContext();
   const {profileSource} = useProfileViewContext();
@@ -140,5 +143,6 @@ export const useGraphTooltipMetaInfo = ({table, row}: Props): GraphTooltipMetaIn
     mappingBuildID,
     mappingFile,
     inlined,
+    timestamp,
   };
 };
diff --git a/ui/packages/shared/profile/src/ProfileSource.tsx b/ui/packages/shared/profile/src/ProfileSource.tsx
@@ -35,7 +35,8 @@ export interface ProfileSelection {
   ProfileSource: () => ProfileSource;
   Type: () => string;
 }
-const timeFormat = (timezone?: string): string => {
+
+export const timeFormat = (timezone?: string): string => {
   if (timezone !== undefined) {
     return 'yyyy-MM-dd HH:mm:ss';
   }

diff --git a/ui/packages/shared/utilities/src/index.ts b/ui/packages/shared/utilities/src/index.ts
@@ -382,5 +382,5 @@ export const isUrlEncoded = (str: string): boolean => {
 export function formatDateTimeDownToMS(timestamp: Date, timezone?: string): string {
   return timezone !== undefined
     ? format(timestamp, "yyyy:MM:dd'T'HH:mm:ss.SSS", {timeZone: timezone})
-    : format(timestamp, "yyyy:MM:dd'T'HH:mm:ss.SSS", {timeZone: 'UTC'});
+    : `${format(timestamp, "yyyy:MM:dd'T'HH:mm:ss.SSS", {timeZone: 'UTC'})} (UTC)`;
 }