v1.8.0

.github/workflows/playground-merged.yml

@@ -10,10 +10,35 @@ jobs:
     if: github.event.pull_request.merged == true
     runs-on: ubuntu-latest
     permissions:
+      contents: read
       pull-requests: write
+      actions: read
     steps:
+      - name: Prepare blueprint with artifact link
+        id: blueprint
+        run: |
+          set -euxo pipefail
+          ARTIFACT_URL="${{ github.server_url }}/${{ github.repository }}/archive/refs/heads/develop.zip"
+
+          # Use Node.js to parse, modify, and stringify the JSON
+          BLUEPRINT=$(node -e "
+            const fs = require('fs');
+            const blueprint = JSON.parse(fs.readFileSync('.wordpress-org/blueprints/playground.json', 'utf8'));
+            blueprint.plugins = blueprint.plugins.map(plugin =>
+              plugin === '${{ github.event.repository.name }}' ? '$ARTIFACT_URL' : plugin
+            );
+            console.log(JSON.stringify(blueprint));
+          ")
+
+          # Base64 encode the blueprint
+          ENCODED_BLUEPRINT=$(echo -n "$BLUEPRINT" | base64 -w 0)
+
+          echo "blueprint=$ENCODED_BLUEPRINT" >> "$GITHUB_OUTPUT"
+
+      # Comment with a Playground link that installs from the artifact ZIP
       - uses: mshick/add-pr-comment@v2
         with:
           message: |
             **Test merged PR on Playground**
-            [Test this pull request on the Playground](https://playground.wordpress.net/?blueprint-url=https%3A%2F%2Fprogressplanner.com%2Fresearch%2Fblueprint-pp.php%3Frepo%3D${{ github.repository }}) or [download the zip](${{ github.server_url }}/${{ github.repository }}/archive/refs/heads/develop.zip).
+            [Test this pull request on the Playground](https://playground.wordpress.net/#${{ steps.blueprint.outputs.blueprint }})
+            or [download the zip](${{ github.server_url }}/${{ github.repository }}/archive/refs/heads/develop.zip)

.github/workflows/playground.yml

@@ -4,13 +4,89 @@ on:
   pull_request:
 
 jobs:
-  test:
+  playground:
     runs-on: ubuntu-latest
     permissions:
+      contents: read
       pull-requests: write
+      actions: read
+
     steps:
+      - uses: actions/checkout@v4
+
+      # Prepare a folder named exactly like the repo as the plugin root.
+      # If the repo already has such a folder (common for WP plugins), use it.
+      # Otherwise, stage one and copy root files into it (excluding CI junk).
+      - name: Prepare plugin folder
+        id: prep
+        run: |
+          set -euxo pipefail
+          REPO="${{ github.event.repository.name }}"
+          if [ -d "$REPO" ]; then
+            # Plugin already lives in a subfolder named like the repo
+            echo "PKG_DIR=$REPO" >> "$GITHUB_OUTPUT"
+          else
+            # Create a clean staging dir to avoid copying into itself
+            STAGE="${REPO}-pkg"
+            mkdir -p "$STAGE/$REPO"
+            rsync -a \
+              --exclude='.git' \
+              --exclude='.github' \
+              --exclude='node_modules' \
+              --exclude="${STAGE}" \
+              ./ "$STAGE/$REPO/"
+            echo "PKG_DIR=$STAGE/$REPO" >> "$GITHUB_OUTPUT"
+
+          fi
+
+      - name: Update plugin version with PR number
+        run: |
+          set -euxo pipefail
+          PLUGIN_FILE="${{ steps.prep.outputs.PKG_DIR }}/${{ github.event.repository.name }}.php"
+          PR_NUMBER="${{ github.event.number }}"
+
+          # Extract current version and add PR number
+          CURRENT_VERSION=$(grep -o "Version:[[:space:]]*[0-9.]*" "$PLUGIN_FILE" | sed 's/Version:[[:space:]]*//')
+          NEW_VERSION="${CURRENT_VERSION} - PR ${PR_NUMBER}"
+
+          # Replace the version line
+          sed -i "s/Version:[[:space:]]*[0-9.]*/Version:           ${NEW_VERSION}/" "$PLUGIN_FILE"
+
+      - name: Prepare blueprint with artifact link
+        id: blueprint
+        run: |
+          set -euxo pipefail
+          ARTIFACT_URL="https://nightly.link/${{ github.repository }}/actions/runs/${{ github.run_id }}/${{ github.event.repository.name }}.zip"
+
+          # Use Node.js to parse, modify, and stringify the JSON
+          BLUEPRINT=$(node -e "
+            const fs = require('fs');
+            const blueprint = JSON.parse(fs.readFileSync('.wordpress-org/blueprints/playground.json', 'utf8'));
+            blueprint.plugins = blueprint.plugins.map(plugin =>
+              plugin === '${{ github.event.repository.name }}' ? '$ARTIFACT_URL' : plugin
+            );
+            console.log(JSON.stringify(blueprint));
+          ")
+
+          # Base64 encode the blueprint
+          ENCODED_BLUEPRINT=$(echo -n "$BLUEPRINT" | base64 -w 0)
+
+          echo "blueprint=$ENCODED_BLUEPRINT" >> "$GITHUB_OUTPUT"
+
+      # Upload the FOLDER (not a .zip). The artifact service zips it for us,
+      # keeping the top-level folder name inside the archive.
+      - name: Upload plugin artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: ${{ github.event.repository.name }}
+          path: ${{ steps.prep.outputs.PKG_DIR }}
+          # Optional: faster uploads for already-compressed assets
+          compression-level: 0
+
+      # Comment with a Playground link that installs from the artifact ZIP
       - uses: mshick/add-pr-comment@v2
         with:
           message: |
             **Test on Playground**
-            [Test this pull request on the Playground](https://playground.wordpress.net/?blueprint-url=https%3A%2F%2Fprogressplanner.com%2Fresearch%2Fblueprint-pp.php%3Frepo%3D${{ github.repository }}%26branch%3D${{ github.head_ref }}) or [download the zip](${{ github.server_url }}/${{ github.repository }}/archive/${{ github.sha }}.zip).
+            [Test this pull request on the Playground](https://playground.wordpress.net/#${{ steps.blueprint.outputs.blueprint }})
+            or [download the zip](https://nightly.link/${{ github.repository }}/actions/runs/${{ github.run_id }}/${{ github.event.repository.name }}.zip)

.wordpress-org/blueprints/blueprint.json

@@ -1,16 +1,14 @@
 {
-	"landingPage": "\/wp-admin\/admin.php?page=progress-planner",
-	"steps": [
-		{
-			"step": "login",
-			"username": "admin",
-			"password": "password"
-		},
-		{
-			"step": "defineWpConfigConsts",
-			"consts": {
-			  "IS_PLAYGROUND_PREVIEW": true
-			}
-		}
-	]
+    "landingPage": "/wp-admin/admin.php?page=progress-planner",
+    "features": {
+        "networking": true
+    },
+    "plugins": [
+        "progress-planner"
+    ],
+    "steps": [
+        {
+            "step": "login"
+        }
+    ]
 }

.wordpress-org/blueprints/playground.json

@@ -0,0 +1,31 @@
+{
+    "landingPage": "/wp-admin/admin.php?page=progress-planner",
+    "features": {
+        "networking": true
+    },
+    "plugins": [
+        "progress-planner",
+        "wordpress-seo"
+    ],
+    "steps": [
+        {
+            "step": "login"
+        },
+        {
+            "step": "setSiteOptions",
+            "options": {
+                "wpseo": "a:5:{s:22:\"show_onboarding_notice\";b:0;s:36:\"dismiss_configuration_workout_notice\";b:1;s:18:\"first_time_install\";b:0;s:34:\"activation_redirect_timestamp_free\";i:1652258756;s:34:\"should_redirect_after_install_free\";b:0;}"
+            }
+        },
+        {
+            "step": "defineWpConfigConsts",
+            "consts": {
+                "IS_PLAYGROUND_PREVIEW": true,
+                "WPSEO_PREMIUM_FILE": "override",
+                "WPSEO_PREMIUM_VERSION": "24.8.1",
+                "YOAST_ENVIRONMENT": "development",
+                "WP_ENVIRONMENT_TYPE": "development"
+            }
+        }
+    ]
+}

CHANGELOG.md

@@ -1,3 +1,18 @@
+= 1.8.0 =
+
+Enhancements:
+
+* Redesign of the admin pages.
+* Improved capability checks.
+* a11y improvements.
+
+Added these recommendations from Ravi:
+
+* Set date format.
+
+Bugs we fixed:
+
+* Fix redirecting to Progress Planner Dashboard after login.
 
 = 1.7.2 =
 

assets/css/admin.css

@@ -32,6 +32,9 @@
 	--prpl-color-notification-green: #16a34a;
 	--prpl-color-notification-red: #e73136;
 
+	--prpl-color-button-primary: #dd3244;
+	--prpl-color-button-primary-hover: #cf2441;
+
 	--prpl-background-orange: #fff9f0;
 	--prpl-background-purple: #f6f5fb;
 	--prpl-background-green: #f2faf9;
@@ -50,14 +53,34 @@
 	--prpl-font-size-6xl: 4.5rem;     /* 72px */
 }
 
+/*------------------------------------*\
+	Progress Planner dashboard page.
+\*------------------------------------*/
+/* stylelint-disable-next-line selector-class-pattern */
+body.toplevel_page_progress-planner {
+
+	#wpwrap {
+		background-color: #f6f7f9;
+	}
+
+	ul#adminmenu {
+
+		a.wp-has-current-submenu,
+		>li.current > a.current {
+
+			&::after {
+				border-right-color: #f6f7f9 !important;
+			}
+		}
+	}
+}
+
 /*------------------------------------*\
 	Styles for the container of the page.
 \*------------------------------------*/
 .prpl-wrap {
-	background: #fff;
-	border: 1px solid var(--prpl-color-gray-2);
 	border-radius: var(--prpl-border-radius);
-	padding: var(--prpl-settings-page-gap) calc(var(--prpl-padding) * 2);
+	padding: var(--prpl-settings-page-gap) var(--prpl-padding);
 	max-width: var(--prpl-container-max-width);
 	color: var(--prpl-color-text);
 	font-size: var(--prpl-font-size-base);
@@ -97,6 +120,14 @@
 	color: var(--prpl-color-link);
 }
 
+.prpl-widget-width-2 {
+	grid-column: span 2;
+
+	.prpl-widget-description {
+		max-width: 640px;
+	}
+}
+
 .prpl-widget-title {
 	margin-top: 0;
 	font-size: 1.375rem;
@@ -190,6 +221,7 @@ button.prpl-info-icon {
 		padding: 0.4em;
 
 		/* color: var(--prpl-color-gray-2); */
+		background-color: #fff;
 		border: 1px solid var(--prpl-color-gray-2);
 		border-radius: var(--prpl-border-radius);
 
@@ -218,6 +250,7 @@ button.prpl-info-icon {
 	grid-template-columns: repeat(auto-fit, minmax(var(--prpl-column-min-width), 1fr));
 	column-gap: var(--prpl-gap);
 	grid-auto-rows: var(--prpl-gap);
+	grid-auto-flow: dense;
 
 	img {
 		max-width: 100%;
@@ -234,6 +267,7 @@ button.prpl-info-icon {
 	Generic styles for individual widgets.
 \*------------------------------------*/
 .prpl-widget-wrapper {
+	background-color: #fff;
 	border: 1px solid var(--prpl-color-gray-2);
 	border-radius: var(--prpl-border-radius);
 	padding: var(--prpl-padding);
@@ -245,6 +279,12 @@ button.prpl-info-icon {
 	hr {
 		margin-top: 1.25rem;
 		margin-bottom: 1.25rem;
+		border-top-color: var(--prpl-color-gray-2);
+	}
+
+	/* Force the last column to be the last column. */
+	&[data-force-last-column="1"] {
+		grid-column: -2 / -1;
 	}
 }
 
@@ -298,7 +338,7 @@ button.prpl-info-icon {
 	text-decoration: none;
 	cursor: pointer;
 	font-size: var(--prpl-font-size-base);
-	background: var(--prpl-color-accent-red);
+	background: var(--prpl-color-button-primary);
 	line-height: 1.25;
 	box-shadow: none;
 	border: none;
@@ -315,7 +355,7 @@ button.prpl-info-icon {
 		display: block;
 		width: 100%;
 		height: 100%;
-		background: var(--prpl-color-accent-red);
+		background: var(--prpl-color-button-primary);
 		position: absolute;
 		top: 0;
 		left: 0;
@@ -331,10 +371,10 @@ button.prpl-info-icon {
 
 	&:not([disabled]):hover,
 	&:not([disabled]):focus {
-		background: #cf2441;
+		background: var(--prpl-color-button-primary-hover);
 
 		&::after {
-			background: #cf2441;
+			background: var(--prpl-color-button-primary-hover);
 			box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.15);
 			width: calc(100% + 4px);
 			height: calc(100% + 4px);
@@ -418,6 +458,10 @@ button.prpl-info-icon {
 	.prpl-welcome .inner-content .right {
 		display: none !important;
 	}
+
+	.prpl-widget-width-2 {
+		grid-column: span 1;
+	}
 }
 
 /*------------------------------------*\

assets/css/page-widgets/badge-streak.css

@@ -76,3 +76,48 @@
 .string-freeze-explain {
 	max-width: 42em;
 }
+
+.prpl-widget-wrapper.prpl-badge-streak,
+.prpl-widget-wrapper.prpl-badge-streak-content,
+.prpl-widget-wrapper.prpl-badge-streak-maintenance {
+	display: flex;
+	flex-direction: column;
+	justify-content: space-between;
+
+	.progress-label {
+		display: inline-block;
+	}
+
+	.progress-wrapper {
+		display: grid;
+		grid-template-columns: 1fr 1fr 1fr;
+		gap: calc(var(--prpl-gap) / 2);
+
+		&:not(:first-child) {
+			margin-top: var(--prpl-padding);
+		}
+
+		.prpl-badge {
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			flex-wrap: wrap;
+			min-width: 0;
+		}
+
+		p {
+			margin: 0;
+			font-size: var(--prpl-font-size-small);
+			text-align: center;
+			line-height: 1.2;
+		}
+	}
+
+	.prpl-widget-content {
+		margin-bottom: 1em;
+	}
+
+	.badge-group-monthly {
+		background-color: transparent;
+	}
+}