fix(trace-eap-watefall): Standalone spans don't have txn event details (#97499)

Resolves:
https://sentry.sentry.io/issues/6799194855/?project=11276&referrer=github-pr-bot

Co-authored-by: Abdullah Khan <[email protected]>

Author: Abdkhan14

static/app/components/events/interfaces/spans/spanProfileDetails.tsx

@@ -48,12 +48,16 @@ export interface SpanProfileDetailsProps {
 export function useSpanProfileDetails(
   organization: Organization,
   project: Project | undefined,
-  event: Readonly<EventTransaction>,
+  event: Readonly<EventTransaction | undefined>,
   span: SpanProfileDetailsProps['span']
 ) {
   const profileGroup = useProfileGroup();
 
   const processedEvent = useMemo(() => {
+    if (!event) {
+      return null;
+    }
+
     const entries: EventTransaction['entries'] = [...(event.entries || [])];
     if (profileGroup.images) {
       entries.push({
@@ -78,7 +82,7 @@ export function useSpanProfileDetails(
   }, [profileGroup.profiles, threadId]);
 
   const nodes: CallTreeNode[] = useMemo(() => {
-    if (profile === null) {
+    if (profile === null || !event) {
       return [];
     }
 
@@ -133,7 +137,7 @@ export function useSpanProfileDetails(
   }, [nodes]);
 
   const {frames, hasPrevious, hasNext} = useMemo(() => {
-    if (index >= maxNodes) {
+    if (index >= maxNodes || !event) {
       return {frames: [], hasPrevious: false, hasNext: false};
     }
 
@@ -145,7 +149,7 @@ export function useSpanProfileDetails(
   }, [index, maxNodes, event, nodes]);
 
   const profileTarget = useMemo(() => {
-    if (defined(project)) {
+    if (defined(project) && event) {
       const profileContext = event.contexts.profile ?? {};
 
       if (defined(profileContext.profile_id)) {
@@ -214,7 +218,7 @@ export function SpanProfileDetails({
     frames,
   } = useSpanProfileDetails(organization, project, event, span);
 
-  if (!defined(profileTarget)) {
+  if (!defined(profileTarget) || !processedEvent) {
     return null;
   }
 

static/app/views/performance/newTraceDetails/traceDrawer/details/span/index.tsx

@@ -400,7 +400,7 @@ function EAPSpanNodeDetails(props: EAPSpanNodeDetailsProps) {
     <EAPSpanNodeDetailsContent
       {...props}
       traceItemData={traceItemData}
-      eventTransaction={eventTransaction!}
+      eventTransaction={eventTransaction}
       avgSpanDuration={avgSpanDuration}
     />
   );
@@ -420,7 +420,7 @@ function EAPSpanNodeDetailsContent({
   avgSpanDuration,
 }: EAPSpanNodeDetailsProps & {
   avgSpanDuration: number | undefined;
-  eventTransaction: EventTransaction;
+  eventTransaction: EventTransaction | undefined;
   traceItemData: TraceItemDetailsResponse;
 }) {
   const attributes = traceItemData.attributes;