Display the PHP version on Site Settings screen

src/components/content-tab-settings.tsx

@@ -1,6 +1,7 @@
 import { Icon, file } from '@wordpress/icons';
 import { useI18n } from '@wordpress/react-i18n';
 import { PropsWithChildren } from 'react';
+import { useGetPhpVersion } from '../hooks/use-get-php-version';
 import { useGetWpVersion } from '../hooks/use-get-wp-version';
 import { getIpcApi } from '../lib/get-ipc-api';
 import { decodePassword } from '../lib/passwords';
@@ -30,6 +31,7 @@ export function ContentTabSettings( { selectedSite }: ContentTabSettingsProps )
 	// Empty strings account for legacy sites lacking a stored password.
 	const storedPassword = decodePassword( selectedSite.adminPassword ?? '' );
 	const password = storedPassword === '' ? 'password' : storedPassword;
+	const phpVersion = useGetPhpVersion( selectedSite );
 	const wpVersion = useGetWpVersion( selectedSite );
 	return (
 		<div className="p-8">
@@ -66,6 +68,7 @@ export function ContentTabSettings( { selectedSite }: ContentTabSettingsProps )
 							<Icon size={ 13 } icon={ file } className="shrink-0" />
 						</Button>
 					</SettingsRow>
+					<SettingsRow label={ __( 'PHP Version' ) }>{ phpVersion }</SettingsRow>
 					<SettingsRow label={ __( 'WP Version' ) }>{ wpVersion }</SettingsRow>
 
 					<tr>

src/hooks/use-get-php-version.ts

@@ -0,0 +1,10 @@
+import { useEffect, useState } from 'react';
+import { getIpcApi } from '../lib/get-ipc-api';
+
+export function useGetPhpVersion( site: SiteDetails ) {
+	const [ phpVersion, setPhpVersion ] = useState( '-' );
+	useEffect( () => {
+		getIpcApi().getPhpVersion( site.id ).then( setPhpVersion );
+	}, [ site.id, site.running ] );
+	return phpVersion;
+}

src/ipc-handlers.ts

@@ -464,6 +464,15 @@ export async function getAppGlobals( _event: IpcMainInvokeEvent ): Promise< AppG
 	};
 }
 
+export async function getPhpVersion( _event: IpcMainInvokeEvent, id: string ) {
+	const server = SiteServer.get( id );
+	if ( ! server ) {
+		return '-';
+	}
+	const phpVersion = ( await server.details.phpVersion ) || '-';
+	return phpVersion;
+}
+
 export async function getWpVersion( _event: IpcMainInvokeEvent, id: string ) {
 	const server = SiteServer.get( id );
 	if ( ! server ) {

src/ipc-types.d.ts

@@ -18,6 +18,7 @@ interface StoppedSiteDetails {
 	name: string;
 	path: string;
 	port?: number;
+	phpVersion?: string;
 	adminPassword?: string;
 	themeDetails?: {
 		name: string;

src/preload.ts

@@ -29,6 +29,7 @@ const api: IpcApi = {
 	copyText: ( text: string ) => ipcRenderer.invoke( 'copyText', text ),
 	getAppGlobals: () => ipcRenderer.invoke( 'getAppGlobals' ),
 	removeTemporalFile: ( path: string ) => ipcRenderer.invoke( 'removeTemporalFile', path ),
+	getPhpVersion: ( id: string ) => ipcRenderer.invoke( 'getPhpVersion', id ),
 	getWpVersion: ( id: string ) => ipcRenderer.invoke( 'getWpVersion', id ),
 	generateProposedSitePath: ( siteName: string ) =>
 		ipcRenderer.invoke( 'generateProposedSitePath', siteName ),

src/site-server.ts

@@ -99,6 +99,7 @@ export class SiteServer {
 			...this.details,
 			url: this.server.url,
 			port: this.server.options.port,
+			phpVersion: options.phpVersion,
 			running: true,
 			themeDetails,
 		};