improved settings page layout

assets/css/activitypub-event-bridge-admin.css

@@ -0,0 +1,52 @@
+.activitypub-event-bridge-settings-page .box {
+	border: 1px solid #c3c4c7;
+	background-color: #fff;
+	padding: 1em 1.5em;
+	margin-bottom: 1.5em;
+}
+
+.activitypub-event-bridge-settings {
+	max-width: 800px;
+	margin: 0 auto;
+}
+
+.activitypub-event-bridge-settings-header {
+	text-align: center;
+	margin: 0 0 1rem;
+	background: #fff;
+	border-bottom: 1px solid #dcdcde;
+}
+
+.activitypub-event-bridge-settings-title-section {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	clear: both;
+	padding-top: 8px;
+}
+
+.activitypub-event-bridge-settings-tabs-wrapper {
+	display: -ms-inline-grid;
+	-ms-grid-columns: auto auto auto auto;
+	vertical-align: top;
+	display: inline-grid;
+	grid-template-columns: auto auto auto auto;
+}
+
+.activitypub-event-bridge-settings-tab.active {
+	box-shadow: inset 0 -3px #3582c4;
+	font-weight: 600;
+}
+
+.activitypub-event-bridge-settings-tab {
+	display: block;
+	text-decoration: none;
+	color: inherit;
+	padding: .5rem 1rem 1rem;
+	margin: 0 1rem;
+	transition: box-shadow .5s ease-in-out;
+}
+
+.activitypub-event-bridge-settings .box h3 {
+	font-size: 1.1rem!important;
+}

assets/css/activitypub-event-extensions-admin.css

@@ -1,6 +0,0 @@
-.activitypub-event-bridge-settings-page .box {
-	border: 1px solid #c3c4c7;
-	background-color: #fff;
-	padding: 1em 1.5em;
-	margin-bottom: 1.5em;
-}

includes/plugins/class-event-plugin.php

@@ -53,6 +53,18 @@ abstract class Event_Plugin {
 		return '';
 	}
 
+	/**
+	 * Get the plugins name from the main plugin-file's top-level-file-comment.
+	 */
+	final public static function get_plugin_name(): string {
+		$plugin_data = get_plugin_data( WP_PLUGIN_DIR . '/' . static::get_plugin_file() );
+		if ( isset( $plugin_data['Name'] ) ) {
+			return $plugin_data['Name'];
+		} else {
+			return '';
+		}
+	}
+
 	/**
 	 * Detects whether the current screen is a admin page of the event plugin.
 	 */

templates/admin-header.php

@@ -0,0 +1,33 @@
+<?php
+/**
+ * Template for the header and navigation of the admin pages.
+ *
+ * @package ActivityPub_Event_Bridge
+ */
+
+/* @var array $args Template arguments. */
+$args = wp_parse_args(
+	$args,
+	array(
+		'status'   => '',
+		'settings' => '',
+	)
+);
+?>
+
+<div class="activitypub-event-bridge-settings-header">
+	<div class="activitypub-event-bridge-settings-title-section">
+		<h1><?php \esc_html_e( 'ActivityPub Event Bridge', 'activitypub-event-bridge' ); ?></h1>
+	</div>
+
+	<nav class="activitypub-event-bridge-settings-tabs-wrapper" aria-label="<?php \esc_attr_e( 'Secondary menu', 'activitypub-event-bridge' ); ?>">
+		<a href="<?php echo \esc_url( admin_url( 'options-general.php?page=activitypub-event-bridge' ) ); ?>" class="activitypub-event-bridge-settings-tab <?php echo \esc_attr( $args['status'] ); ?>">
+			<?php \esc_html_e( 'Status', 'activitypub-event-bridge' ); ?>
+		</a>
+
+		<a href="<?php echo \esc_url( admin_url( 'options-general.php?page=activitypub-event-bridge&tab=settings' ) ); ?>" class="activitypub-event-bridge-settings-tab <?php echo \esc_attr( $args['settings'] ); ?>">
+			<?php \esc_html_e( 'Settings', 'activitypub-event-bridge' ); ?>
+		</a>
+	</nav>
+</div>
+<hr class="wp-header-end">

templates/settings.php

@@ -13,6 +13,14 @@
 // Exit if accessed directly.
 defined( 'ABSPATH' ) || exit; // @codeCoverageIgnore
 
+\load_template(
+	__DIR__ . '/admin-header.php',
+	true,
+	array(
+		'settings' => 'active',
+	)
+);
+
 use Activitypub\Activity\Extended_Object\Event;
 
 if ( ! isset( $args ) || ! array_key_exists( 'event_terms', $args ) ) {
@@ -31,19 +39,12 @@ $selected_default_event_category = \get_option( 'activitypub_event_bridge_defaul
 $current_category_mapping        = \get_option( 'activitypub_event_bridge_event_category_mappings', array() );
 ?>
 
-<div class="activitypub-settings-header">
+<div class="activitypub-event-bridge-settings activitypub-event-bridge-settings-page hide-if-no-js">
-	<div class="activitypub-settings-title-section">
-		<h1><?php \esc_html_e( 'ActivityPub Event Bridge', 'activitypub-event-bridge' ); ?></h1>
-	</div>
-</div>
-<hr class="wp-header-end">
-
-<div class="activitypub-settings activitypub-settings-page activitypub-event-bridge-settings-page hide-if-no-js">
 	<form method="post" action="options.php">
 		<?php \settings_fields( 'activitypub-event-bridge' ); ?>
 
 		<div class="box">
-			<h2> <?php esc_html_e( 'Default ActivityPub Event Category', 'activitypub-event-bridge' ); ?> </h2>
+			<h2> <?php esc_html_e( 'ActivityPub Event Category', 'activitypub-event-bridge' ); ?> </h2>
 			<p> <?php esc_html_e( 'To help visitors find events more easily, the community created a set of basic event categories. Please select the category that best matches the majority of the events you organize.', 'activitypub-event-bridge' ); ?> </p>
 			<table class="form-table">
 				<tr>
@@ -59,11 +60,9 @@ $current_category_mapping        = \get_option( 'activitypub_event_bridge_event_
 					</td>
 				</tr>
 			</table>
-		</div>
 
-		<?php if ( ! empty( $event_terms ) ) : ?>
+			<?php if ( ! empty( $event_terms ) ) : ?>
-		<div class="box">
+			<h3> <?php esc_html_e( 'Advanced Event Category Settings', 'activitypub-event-bridge' ); ?> </h3>
-			<h2> <?php esc_html_e( 'Advanced Event Category Settings', 'activitypub-event-bridge' ); ?> </h2>
 			<p> <?php esc_html_e( 'Take more control by adjusting how your event categories are mapped to the basic category set used in ActivityPub. This option lets you override the default selection above, ensuring more accurate categorization and better visibility for your events.', 'activitypub-event-bridge' ); ?> </p>
 			<table class="form-table">
 				<?php foreach ( $event_terms as $event_term ) { ?>
@@ -96,8 +95,8 @@ $current_category_mapping        = \get_option( 'activitypub_event_bridge_event_
 					</tr>
 				<?php } ?>
 			</table>
+			<?php endif; ?>
 		</div>
-		<?php endif; ?>
 		<?php \submit_button(); ?>
 	</form>
 </div>

templates/status.php

@@ -5,11 +5,28 @@
  * @package ActivityPub_Event_Bridge
  */
 
+// Exit if accessed directly.
+defined( 'ABSPATH' ) || exit; // @codeCoverageIgnore
+
+use ActivityPub_Event_Bridge\Setup;
+
+\load_template(
+	__DIR__ . '/admin-header.php',
+	true,
+	array(
+		'status' => 'active',
+	)
+);
+
+$active_event_plugins = Setup::get_instance()->get_active_event_plugins();
+
 ?>
 
-<div class="activitypub-event-bridge-settings-page hide-if-no-js">
+<div class="activitypub-event-bridge-settings activitypub-event-bridge-settings-page hide-if-no-js">
 	<div class="box">
-		<h2><?php \esc_html_e( 'Status', 'activitypub-event-bridge' ); ?></h2>
+		<h2><?php \esc_html_e( 'Detected Event Plugins', 'activitypub-event-bridge' ); ?></h2>
-		<p>This is so cool!</p>
+		<?php foreach ( $active_event_plugins as $active_event_plugin ) { ?>
+			<h3> <?php echo esc_html( $active_event_plugin->get_plugin_name() ); ?> </h3>
+		<?php } ?>
 	</div>
 </div>