feat: log records in the span sheet (#819)

* feat: log records in the span sheet

Author: itssharmasandeep

projects/distributed-tracing/src/shared/components/span-detail/span-detail.component.ts

@@ -46,6 +46,12 @@ import { SpanDetailLayoutStyle } from './span-detail-layout-style';
         <ht-tab label="Exit Calls" *ngIf="this.showExitCallsTab">
           <ht-span-exit-calls [exitCalls]="this.spanData.exitCallsBreakup"></ht-span-exit-calls>
         </ht-tab>
+        <ht-tab *ngIf="this.showLogEventstab" label="Logs" [badge]="this.totalLogEvents">
+          <ht-log-events-table
+            [logEvents]="this.spanData?.logEvents"
+            [spanStartTime]="this.spanData?.startTime"
+          ></ht-log-events-table>
+        </ht-tab>
       </ht-tab-group>
     </div>
   `
@@ -66,12 +72,16 @@ export class SpanDetailComponent implements OnChanges {
   public showRequestTab?: boolean;
   public showResponseTab?: boolean;
   public showExitCallsTab?: boolean;
+  public showLogEventstab?: boolean;
+  public totalLogEvents?: number;
 
   public ngOnChanges(changes: TypedSimpleChanges<this>): void {
     if (changes.spanData) {
       this.showRequestTab = !isEmpty(this.spanData?.requestHeaders) || !isEmpty(this.spanData?.requestBody);
       this.showResponseTab = !isEmpty(this.spanData?.responseHeaders) || !isEmpty(this.spanData?.responseBody);
       this.showExitCallsTab = !isEmpty(this.spanData?.exitCallsBreakup);
+      this.showLogEventstab = !isEmpty(this.spanData?.logEvents);
+      this.totalLogEvents = (this.spanData?.logEvents ?? []).length;
     }
   }
 }

projects/distributed-tracing/src/shared/components/span-detail/span-detail.module.ts

@@ -11,6 +11,7 @@ import {
   ToggleButtonModule,
   TooltipModule
 } from '@hypertrace/components';
+import { LogEventsTableModule } from '../log-events/log-events-table.module';
 import { SpanExitCallsModule } from './exit-calls/span-exit-calls.module';
 import { SpanDetailTitleHeaderModule } from './headers/title/span-detail-title-header.module';
 import { SpanRequestDetailModule } from './request/span-request-detail.module';
@@ -34,7 +35,8 @@ import { SpanTagsDetailModule } from './tags/span-tags-detail.module';
     LoadAsyncModule,
     ListViewModule,
     SpanDetailTitleHeaderModule,
-    SpanExitCallsModule
+    SpanExitCallsModule,
+    LogEventsTableModule
   ],
   declarations: [SpanDetailComponent],
   exports: [SpanDetailComponent]