only show wrapping data for fetch and xnr

PostHog · Nov 14, 2023 · 8a4757d · 8a4757d
1 parent cd54a6a
commit 8a4757d
Showing 1 changed file with 55 additions and 49 deletions.
diff --git a/frontend/src/scenes/session-recordings/player/inspector/components/ItemPerformanceEvent.tsx b/frontend/src/scenes/session-recordings/player/inspector/components/ItemPerformanceEvent.tsx
@@ -336,56 +336,62 @@ export function ItemPerformanceEvent({
                     )}
 
                     <LemonDivider dashed />
-                    <FlaggedFeature flag={FEATURE_FLAGS.NETWORK_PAYLOAD_CAPTURE} match={true}>
-                        <LemonTabs
-                            activeKey={activeTab}
-                            onChange={(newKey) => setActiveTab(newKey)}
-                            tabs={[
-                                {
-                                    key: 'timings',
-                                    label: 'timings',
-                                    content: <SimpleKeyValueList item={sanitizedProps} />,
-                                },
-                                {
-                                    key: 'headers',
-                                    label: 'Headers',
-                                    content: (
-                                        <HeadersDisplay
-                                            request={item.request_headers}
-                                            response={item.response_headers}
-                                        />
-                                    ),
-                                },
-                                item.entry_type !== 'navigation' && {
-                                    key: 'payload',
-                                    label: 'Payload',
-                                    content: (
-                                        <BodyDisplay
-                                            content={item.request_body}
-                                            headers={item.request_headers}
-                                            emptyMessage={'No request body captured'}
-                                        />
-                                    ),
-                                },
-                                item.entry_type !== 'navigation' && item.response_body
-                                    ? {
-                                          key: 'response_body',
-                                          label: 'Response',
-                                          content: (
-                                              <BodyDisplay
-                                                  content={item.response_body}
-                                                  headers={item.response_headers}
-                                                  emptyMessage={'No response body captured'}
-                                              />
-                                          ),
-                                      }
-                                    : false,
-                            ]}
-                        />
-                    </FlaggedFeature>
-                    <FlaggedFeature flag={FEATURE_FLAGS.NETWORK_PAYLOAD_CAPTURE} match={false}>
+                    {['fetch', 'xmlhttprequest'].includes(item.initiator_type || '') ? (
+                        <>
+                            <FlaggedFeature flag={FEATURE_FLAGS.NETWORK_PAYLOAD_CAPTURE} match={true}>
+                                <LemonTabs
+                                    activeKey={activeTab}
+                                    onChange={(newKey) => setActiveTab(newKey)}
+                                    tabs={[
+                                        {
+                                            key: 'timings',
+                                            label: 'timings',
+                                            content: <SimpleKeyValueList item={sanitizedProps} />,
+                                        },
+                                        {
+                                            key: 'headers',
+                                            label: 'Headers',
+                                            content: (
+                                                <HeadersDisplay
+                                                    request={item.request_headers}
+                                                    response={item.response_headers}
+                                                />
+                                            ),
+                                        },
+                                        item.entry_type !== 'navigation' && {
+                                            key: 'payload',
+                                            label: 'Payload',
+                                            content: (
+                                                <BodyDisplay
+                                                    content={item.request_body}
+                                                    headers={item.request_headers}
+                                                    emptyMessage={'No request body captured'}
+                                                />
+                                            ),
+                                        },
+                                        item.entry_type !== 'navigation' && item.response_body
+                                            ? {
+                                                  key: 'response_body',
+                                                  label: 'Response',
+                                                  content: (
+                                                      <BodyDisplay
+                                                          content={item.response_body}
+                                                          headers={item.response_headers}
+                                                          emptyMessage={'No response body captured'}
+                                                      />
+                                                  ),
+                                              }
+                                            : false,
+                                    ]}
+                                />
+                            </FlaggedFeature>
+                            <FlaggedFeature flag={FEATURE_FLAGS.NETWORK_PAYLOAD_CAPTURE} match={false}>
+                                <SimpleKeyValueList item={sanitizedProps} />
+                            </FlaggedFeature>
+                        </>
+                    ) : (
                         <SimpleKeyValueList item={sanitizedProps} />
-                    </FlaggedFeature>
+                    )}
                 </div>
             )}
         </div>