From dfc56599c0a2f11109328966e3241eb326ebb7f1 Mon Sep 17 00:00:00 2001 From: ilonagl Date: Thu, 30 Apr 2026 21:12:23 +0300 Subject: [PATCH] Activity Log: default to Table layout and fix free-tier upsell layout - Flip DEFAULT_VIEW.type from 'activity' to 'table' so new visitors land on the Date / Event / User columns instead of the timeline. Existing localStorage-persisted views are preserved by usePersistentView. - Forward upsell-callout.scss from the main entry style.scss via @use instead of relying on the side-effect import in UpsellCallout.tsx, so the rules land in the same chunk as the wrapper styles and the flex layout (image left, copy right on >= 782px) actually applies. Co-Authored-By: Claude Opus 4.7 (1M context) --- .../default-table-view-and-fix-upsell-styles | 4 ++++ .../src/js/components/ActivityLog/UpsellCallout.tsx | 3 ++- .../src/js/components/ActivityLog/views.ts | 13 +++---------- projects/packages/activity-log/src/js/style.scss | 5 +++++ .../changelog/fix-activity-log-default-and-upsell | 4 ++++ 5 files changed, 18 insertions(+), 11 deletions(-) create mode 100644 projects/packages/activity-log/changelog/default-table-view-and-fix-upsell-styles create mode 100644 projects/plugins/jetpack/changelog/fix-activity-log-default-and-upsell diff --git a/projects/packages/activity-log/changelog/default-table-view-and-fix-upsell-styles b/projects/packages/activity-log/changelog/default-table-view-and-fix-upsell-styles new file mode 100644 index 000000000000..a0959031aeb0 --- /dev/null +++ b/projects/packages/activity-log/changelog/default-table-view-and-fix-upsell-styles @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Activity Log: default the page to the Table layout and load the upsell-callout stylesheet from the main entry so its flex rules reach the bundle. diff --git a/projects/packages/activity-log/src/js/components/ActivityLog/UpsellCallout.tsx b/projects/packages/activity-log/src/js/components/ActivityLog/UpsellCallout.tsx index 44bce8790691..155386e80599 100644 --- a/projects/packages/activity-log/src/js/components/ActivityLog/UpsellCallout.tsx +++ b/projects/packages/activity-log/src/js/components/ActivityLog/UpsellCallout.tsx @@ -17,7 +17,8 @@ import { addQueryArgs } from '@wordpress/url'; import { useCallback } from 'react'; import { useAnalytics } from '../../hooks/use-analytics'; import illustrationUrl from './activity-logs-callout-illustration.svg'; -import './upsell-callout.scss'; +// Stylesheet is `@use`d from `src/js/style.scss` so the rules ride the +// main entry chunk instead of relying on a side-effect JS import. const PRODUCT_SLUG = 'jetpack_security_t1_yearly'; const UPSELL_SOURCE = 'activity-log-page-purchase'; diff --git a/projects/packages/activity-log/src/js/components/ActivityLog/views.ts b/projects/packages/activity-log/src/js/components/ActivityLog/views.ts index 29c076490753..d7b824b08d21 100644 --- a/projects/packages/activity-log/src/js/components/ActivityLog/views.ts +++ b/projects/packages/activity-log/src/js/components/ActivityLog/views.ts @@ -14,21 +14,14 @@ const TABLE_LAYOUT = { }; export const DEFAULT_VIEW: View = { - type: 'activity', + type: 'table', perPage: 20, sort: { field: 'published', direction: 'desc', }, - fields: [ 'published', 'actor' ], - layout: { density: 'balanced' }, - titleField: 'event_title', - mediaField: 'event_icon', - descriptionField: 'event_description', - // Group consecutive events that fall on the same calendar day - // (site timezone) under a "Apr 24, 2026" header. See the matching - // entry in DEFAULT_LAYOUTS.activity below for the full rationale. - groupBy: { field: 'published_date', direction: 'desc', showLabel: false }, + fields: [ 'published', 'event', 'actor' ], + layout: TABLE_LAYOUT, showLevels: false, }; diff --git a/projects/packages/activity-log/src/js/style.scss b/projects/packages/activity-log/src/js/style.scss index e3bfde46e02b..4a2be031b76c 100644 --- a/projects/packages/activity-log/src/js/style.scss +++ b/projects/packages/activity-log/src/js/style.scss @@ -1,5 +1,10 @@ @use "@automattic/jetpack-base-styles/admin-page-layout" as *; @use "sass:meta"; +// Component styles are forwarded from this main entry rather than +// imported via per-component side-effect imports in each .tsx file — +// that way they live in the same emitted chunk as the wrapper rules +// below and can't get dropped by chunk splitting. +@use "./components/ActivityLog/upsell-callout"; // DataViews is a bundled (not externalized) @wordpress package in // jetpack-webpack-config, so its stylesheet must be brought in alongside diff --git a/projects/plugins/jetpack/changelog/fix-activity-log-default-and-upsell b/projects/plugins/jetpack/changelog/fix-activity-log-default-and-upsell new file mode 100644 index 000000000000..e841ba927961 --- /dev/null +++ b/projects/plugins/jetpack/changelog/fix-activity-log-default-and-upsell @@ -0,0 +1,4 @@ +Significance: patch +Type: fixed + +Activity Log: default the page to the Table layout and fix the free-tier upsell callout's flex layout.