New: React-based admin UI with REST API

.build-rsync-exclude

@@ -18,8 +18,11 @@ composer.json
 composer.lock
 package.json
 package-lock.json
+webpack.config.js
+babel.config.js
 Gruntfile.js
 README.md
 scripts/
 aryo-activity-log/
 aryo-activity-log.*.zip
+assets/js/admin/src/

.github/workflows/build.yml

@@ -0,0 +1,40 @@
+name: Build
+
+on:
+  pull_request:
+
+concurrency:
+  cancel-in-progress: true
+  group: build-${{ github.ref }}
+
+permissions:
+  contents: read
+
+jobs:
+  build:
+    name: Build Plugin
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v5
+
+      - uses: actions/setup-node@v5
+        with:
+          node-version: '20'
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build JS assets
+        run: npm run build
+
+      - name: Build plugin directory
+        run: npm run package
+
+      - name: Upload artifact
+        uses: actions/upload-artifact@v5
+        with:
+          name: aryo-activity-log-pr${{ github.event.pull_request.number }}-${{ github.sha }}
+          path: aryo-activity-log/
+          retention-days: 14

.github/workflows/php-coding-standards.yml

@@ -20,7 +20,7 @@ jobs:
     if: "!contains(github.event.head_commit.message, '[skip PHPCS]') || !contains(github.event.head_commit.message, '[skip CI]')"
     steps:
       - name: Check out source code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5
 
       - name: Set up PHP
         uses: shivammathur/setup-php@v2

.github/workflows/phpunit.yml

@@ -35,7 +35,7 @@ jobs:
 
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v4
+        uses: actions/checkout@v5
 
       - name: Set up PHP
         uses: shivammathur/setup-php@v2

.github/workflows/release.yml

@@ -43,7 +43,7 @@ jobs:
       contents: write
 
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v5
         with:
           fetch-depth: 0
           token: ${{ secrets.GITHUB_TOKEN }}
@@ -53,7 +53,7 @@ jobs:
           php-version: '7.4'
           tools: composer:v2
 
-      - uses: actions/cache@v4
+      - uses: actions/cache@v5
         with:
           path: vendor
           key: composer-${{ hashFiles('composer.json') }}
@@ -66,7 +66,7 @@ jobs:
       - name: Lint
         run: composer lint
 
-      - uses: actions/setup-node@v4
+      - uses: actions/setup-node@v5
         with:
           node-version: '20'
 
@@ -94,6 +94,9 @@ jobs:
       - name: Sync version to plugin files
         run: npm run version:sync
 
+      - name: Build JS assets
+        run: npm run build
+
       - name: Build plugin directory
         run: npm run package
 

aryo-activity-log.php

@@ -30,11 +30,13 @@
 define( 'ACTIVITY_LOG_BASE', plugin_basename( ACTIVITY_LOG__FILE__ ) );
 
 include( 'classes/class-aal-maintenance.php' );
-include( 'classes/class-aal-activity-log-list-table.php' );
+include( 'classes/class-aal-log-query.php' );
+include( 'classes/class-aal-log-presenter.php' );
 include( 'classes/class-aal-admin-ui.php' );
 include( 'classes/class-aal-settings.php' );
 include( 'classes/class-aal-api.php' );
 include( 'classes/class-aal-hooks.php' );
+include( 'classes/class-aal-rest.php' );
 include( 'classes/class-aal-export.php' );
 include( 'classes/class-aal-privacy.php' );
 include( 'classes/abstract-class-aal-exporter.php' );
@@ -75,6 +77,11 @@ final class AAL_Main {
 	 */
 	public $api;
 
+	/**
+	 * @var AAL_REST
+	 */
+	public $rest;
+
 	/**
 	 * Construct
 	 */
@@ -85,6 +92,7 @@ protected function __construct() {
 		$this->hooks         = new AAL_Hooks();
 		$this->settings      = new AAL_Settings();
 		$this->api           = new AAL_API();
+		$this->rest          = new AAL_REST();
 
 		new AAL_Export();
 		new AAL_Privacy();

assets/js/admin/src/api.js

@@ -0,0 +1,55 @@
+import apiFetch from '@wordpress/api-fetch';
+
+const config = window.aalAdmin || {};
+
+export function fetchLogs( params = {} ) {
+	const query = new URLSearchParams();
+
+	Object.entries( params ).forEach( ( [ key, value ] ) => {
+		if ( value !== '' && value !== undefined && value !== null ) {
+			query.set( key, value );
+		}
+	} );
+
+	const qs = query.toString();
+	const path = `activity-log/v1/logs${ qs ? '?' + qs : '' }`;
+
+	return apiFetch( { path } );
+}
+
+export function fetchFilters() {
+	return apiFetch( { path: 'activity-log/v1/logs/filters' } );
+}
+
+export function dismissPromotion( id ) {
+	return apiFetch( {
+		path: `activity-log/v1/promotions/${ id }/dismiss`,
+		method: 'POST',
+	} );
+}
+
+const EXPORT_FILTER_KEYS = [
+	'dateshow', 'capshow', 'usershow', 'typeshow',
+	'showaction', 'sourceshow', 'filter_ip', 's',
+];
+
+export function buildExportUrl( filters ) {
+	const base = config.exportUrl || '';
+	if ( ! base ) {
+		return '';
+	}
+
+	const url = new URL( base, window.location.origin );
+
+	EXPORT_FILTER_KEYS.forEach( ( key ) => {
+		if ( filters[ key ] ) {
+			url.searchParams.set( key, filters[ key ] );
+		}
+	} );
+
+	url.searchParams.set( 'aal-record-actions-submit', '1' );
+	url.searchParams.set( 'aal-record-action', 'csv' );
+	url.searchParams.set( 'aal_actions_nonce', config.exportNonce || '' );
+
+	return url.toString();
+}