Standardise the display format for closures.

Author: johnbillion

output/html/hooks.tsx

@@ -113,7 +113,23 @@ export const Hooks = ( { data }: PanelProps<DataTypes['hooks']> ) => {
 						if ( ! row.callback ) {
 							return '';
 						}
-						const text = row.callback.name || row.callback.display_file || '';
+
+						let text: string;
+
+						if ( 'closure' === row.callback.callback_type ) {
+							text = sprintf(
+								/* translators: A closure is an anonymous PHP function. 1: Line number, 2: File name */
+								__( 'Closure on line %1$d of %2$s', 'query-monitor' ),
+								row.callback.start_line ?? 0,
+								row.callback.display_file ?? ''
+							);
+						} else if ( 'unknown_closure' === row.callback.callback_type ) {
+							/* translators: A closure is an anonymous PHP function */
+							text = __( 'Unknown closure', 'query-monitor' );
+						} else {
+							text = row.callback.name || row.callback.display_file || '';
+						}
+
 						if ( ! text ) {
 							return '';
 						}

tests/acceptance/Callbacks.spec.ts

@@ -33,7 +33,7 @@ test.describe( 'Callback Types in Hooks & Actions', () => {
 	test( 'Closure callback should be displayed', async ( { QueryMonitor } ) => {
 		await QueryMonitor.amOnAPageThatTriggersCallbackType( 'closure' );
 		await QueryMonitor.seeQMMenu();
-		await QueryMonitor.seeInQMPanel( 'Hooks & Actions', 'Closure: ' );
+		await QueryMonitor.seeInQMPanel( 'Hooks & Actions', 'Closure on line' );
 		await QueryMonitor.seeInQMPanel( 'Hooks & Actions', 'acceptance.php' );
 		await QueryMonitor.seeInQMPanel( 'Hooks & Actions', 'qm_test_hook' );
 	} );