release version 1.3.0

.husky/pre-commit

@@ -1,2 +1,2 @@
 npm test
-npx lint-staged
+lint-staged

README.md

@@ -6,6 +6,8 @@ More details can be found in the [WordPress Plugin Directory](https://wordpress.
 
 The current changelog can be found under [source/changelog.txt](source/changelog.txt).
 
+This plugin uses [Mobilizon's GraphQL API](https://docs.joinmobilizon.org/contribute/graphql_api/).
+
 ## Development
 
 ### Setup
@@ -22,21 +24,23 @@ The current changelog can be found under [source/changelog.txt](source/changelog
 ### Release procedure
 
 1. Make sure `changelog.txt` is up-to-date.
-2. Use a new version number and copy over the new section into `readme.txt`.
-3. Update `package.json` with the same version number.
-4. Update the `package-lock.json`: `npm i --package-lock-only`
-5. Build: `npm run build-prod`
-6. Make sure screenshots are up-to-date.
-7. Copy the built plugin into `/trunk` of SVN.
-8. Create a new tag of the new version: `svn cp trunk tags/<version>`
-9. Check the version number occurrences in both folders.
-10. Commit everything together to the release SVN: `svn ci -m "release version <version>"` Make sure to add new files beforehand.
-11. Commit the new version in git with the same message.
-12. Tag the new version: `git tag v<version>`
-13. Push the new tag to the repository: `git push --tags`
-14. Append `-next` to the version number in `package.json`.
-15. Update the `package-lock.json`: `npm i --package-lock-only`
-16. Commit: `git commit -am "prepare next release"`
+2. Create a new section with a new version number.
+3. Copy over the new section into `readme.txt`.
+4. Update `package.json` with the same version number.
+5. Update the `package-lock.json`: `npm i --package-lock-only`
+6. Build: `npm run build-prod`
+7. Make sure screenshots are up-to-date.
+8. Copy the built plugin into `/trunk` of SVN.
+9. Create a new tag of the new version: `svn cp trunk tags/<version>`
+10. Check the version number occurrences in both folders.
+11. Make sure to handle exclamation and question marks in `svn status`.
+12. Commit everything together to the release SVN: `svn ci -m "release version <version>"`
+13. Commit the new version in git with the same message.
+14. Tag the new version: `git tag v<version>`
+15. Push the new tag to the repository: `git push --tags`
+16. Append `-next` to the version number in `package.json`.
+17. Update the `package-lock.json`: `npm i --package-lock-only`
+18. Commit: `git commit -am "prepare next release"`
 
 ### Other commands
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "connector-mobilizon",
-  "version": "1.0.0",
+  "version": "1.3.0",
   "description": "Display Mobilizon events in WordPress.",
   "private": true,
   "type": "module",
@@ -24,32 +24,32 @@
   },
   "license": "Apache-2.0",
   "dependencies": {
-    "graphql": "16.8.1",
-    "luxon": "3.4.4"
+    "graphql": "16.9.0",
+    "luxon": "3.5.0"
   },
   "devDependencies": {
-    "@babel/core": "7.24.4",
-    "@babel/eslint-parser": "7.24.1",
-    "@babel/preset-env": "7.24.4",
-    "@babel/preset-react": "7.24.1",
-    "@wordpress/eslint-plugin": "17.12.0",
-    "ava": "6.1.2",
-    "babel-loader": "9.1.3",
+    "@babel/core": "7.26.0",
+    "@babel/eslint-parser": "7.25.9",
+    "@babel/preset-env": "7.26.0",
+    "@babel/preset-react": "7.25.9",
+    "@wordpress/eslint-plugin": "21.4.0",
+    "ava": "6.2.0",
+    "babel-loader": "9.2.1",
     "browser-env": "3.3.0",
-    "c8": "9.1.0",
+    "c8": "10.1.2",
     "copy-webpack-plugin": "12.0.2",
     "eslint": "8.57.0",
     "eslint-plugin-ava": "14.0.0",
     "eslint-plugin-jsx": "0.1.0",
-    "eslint-plugin-react": "7.34.1",
+    "eslint-plugin-react": "7.37.2",
     "esm": "3.2.25",
-    "gulp": "4.0.2",
+    "gulp": "5.0.0",
     "gulp-replace": "1.1.4",
-    "husky": "9.0.11",
-    "lint-staged": "15.2.2",
-    "prettier": "3.2.5",
-    "rimraf": "5.0.5",
-    "webpack": "5.91.0",
+    "husky": "9.1.6",
+    "lint-staged": "15.2.10",
+    "prettier": "3.3.3",
+    "rimraf": "5.0.10",
+    "webpack": "5.96.1",
     "webpack-cli": "5.1.4"
   },
   "ava": {
@@ -61,7 +61,7 @@
     "niceName": "Connector for Mobilizon",
     "phpMinimumVersion": 7.4,
     "wordpressMinimumVersion": 5.6,
-    "wordpressTestedUpToVersion": "6.5"
+    "wordpressTestedUpToVersion": "6.7"
   },
   "lint-staged": {
     "source/**/*.js": "eslint",

source/changelog.txt

@@ -6,6 +6,33 @@
 #### Fixed
 #### Security
 
+### [1.3.0]
+#### Added
+- Comment for translators what placeholder will contain
+#### Changed
+- Confirm compatibility with WordPress 6.7
+- Load block script only in footer to reduce waiting time
+- Update dependencies
+#### Fixed
+- Mark event-related data as non-translatable within plugin
+- Add version number to script registration to break browser caching
+- Handle location being null
+
+### [1.2.0]
+#### Added
+- Display event picture if available
+#### Changed
+- Update dependencies
+
+### [1.1.0]
+#### Added
+- Add some spacing between event items
+#### Changed
+- Update dependencies
+- Confirm compatibility with WordPress 6.6
+#### Fixed
+- Fix undefined variable $classNamePrefix for both error views
+
 ### [1.0.0]
 #### Added
 - Display name of group when it cannot be found

source/front/events-displayer.js

@@ -1,5 +1,5 @@
 import Formatter from './formatter.js'
-import { createAnchorElement } from './html-creator.js'
+import { createAnchorElement, createImageElement } from './html-creator.js'
 
 export function clearEventsList(container) {
   const list = container.querySelector('ul')
@@ -18,6 +18,19 @@ export function displayEvents({ events, document, container, maxEventsCount }) {
   const list = container.querySelector('ul')
   for (let i = 0; i < eventsCount; i++) {
     const li = document.createElement('li')
+    li.style.lineHeight = '150%'
+    li.style.marginTop = '20px'
+
+    if (events[i].picture) {
+      const img = createImageElement({
+        document,
+        alt: events[i].picture.alt ? events[i].picture.alt : '',
+        src: events[i].picture.base64 ? events[i].picture.base64 : '',
+      })
+      img.style.display = 'block'
+      img.style.maxWidth = '100%'
+      li.appendChild(img)
+    }
 
     const a = createAnchorElement({
       document,

source/front/html-creator.js

@@ -5,3 +5,10 @@ export function createAnchorElement({ document, text, url }) {
   a.innerHTML = text
   return a
 }
+
+export function createImageElement({ document, alt, src }) {
+  const img = document.createElement('img')
+  img.setAttribute('alt', alt)
+  img.setAttribute('src', src)
+  return img
+}

source/includes/EventsListBlock.php

@@ -10,7 +10,7 @@ class EventsListBlock {
         'wp-blocks',
         'wp-components',
         'wp-i18n'
-      ]);
+      ], '<wordpress-version>', array('in_footer' => true));
     register_block_type(NAME . '/events-list', [
       'api_version' => 2,
       'title' => __('Events List', 'connector-mobilizon'),
@@ -39,6 +39,7 @@ class EventsListBlock {
     $url = Settings::getUrl();
     $eventsCount = $block_attributes['eventsCount'];
     $groupName = isset($block_attributes['groupName']) ? $block_attributes['groupName'] : '';
+    $classNamePrefix = NAME;
 
     ob_start();
     try {
@@ -48,7 +49,6 @@ class EventsListBlock {
         $events = GraphQlClient::get_upcoming_events($url, (int) $eventsCount);
       }
 
-      $classNamePrefix = NAME;
       $locale = get_locale();
       $isShortOffsetNameShown = Settings::isShortOffsetNameShown();
       $timeZone = wp_timezone_string();

source/includes/EventsListShortcut.php

@@ -22,6 +22,7 @@ class EventsListShortcut {
     $url = Settings::getUrl();
     $eventsCount = $atts_with_overriden_defaults['events-count'];
     $groupName = $atts_with_overriden_defaults['group-name'];
+    $classNamePrefix = NAME;
 
     ob_start();
     try {
@@ -31,7 +32,6 @@ class EventsListShortcut {
         $events = GraphQlClient::get_upcoming_events($url, (int) $eventsCount);
       }
 
-      $classNamePrefix = NAME;
       $locale = get_locale();
       $isShortOffsetNameShown = Settings::isShortOffsetNameShown();
       $timeZone = wp_timezone_string();

source/includes/EventsListWidget.php

@@ -23,6 +23,7 @@ class EventsListWidget extends \WP_Widget {
     $url = Settings::getUrl();
     $eventsCount = $options['eventsCount'];
     $groupName = isset($options['groupName']) ? $options['groupName'] : '';
+    $classNamePrefix = NAME;
 
     try {
       if ($groupName) {
@@ -31,7 +32,6 @@ class EventsListWidget extends \WP_Widget {
         $events = GraphQlClient::get_upcoming_events($url, (int) $eventsCount);
       }
 
-      $classNamePrefix = NAME;
       $locale = get_locale();
       $isShortOffsetNameShown = Settings::isShortOffsetNameShown();
       $timeZone = wp_timezone_string();

source/includes/Formatter.php

@@ -26,7 +26,7 @@ final class Formatter
     return $dateText;
   }
 
-  public static function format_location(string $description, string $locality): string {
+  public static function format_location(string $description, ?string $locality): string {
     $location = '';
     if ($description && trim($description)) {
       $location .= trim($description);

source/includes/GraphQlClient.php

@@ -40,6 +40,11 @@ final class GraphQlClient {
             physicalAddress {
               description,
               locality
+            },
+            picture {
+              alt,
+              contentType,
+              url
             }
           },
           total
@@ -57,6 +62,17 @@ final class GraphQlClient {
     self::checkData($data);
 
     $events = $data['data']['events']['elements'];
+    foreach ($events as &$event) {
+      if ($event['picture']) {
+        $picture_response = self::download_image($event['picture']['url']);
+        if ($picture_response !== false) {
+          $picture_encoded = 'data:' . $event['picture']['contentType'] . ';base64,' . base64_encode($picture_response);
+          $event['picture']['base64'] = $picture_encoded;
+        }
+      }
+      unset($event);
+    }
+
     EventsCache::set(['url' => $url, 'query' => $query, 'limit' => $limit], $events);
     return $events;
   }
@@ -75,6 +91,11 @@ final class GraphQlClient {
               physicalAddress {
                 description,
                 locality
+              },
+              picture {
+                alt,
+                contentType,
+                url
               }
             },
             total
@@ -95,6 +116,18 @@ final class GraphQlClient {
     self::checkData($data);
 
     $events = $data['data']['group']['organizedEvents']['elements'];
+    
+    foreach ($events as &$event) {
+      if ($event['picture']) {
+        $picture_response = self::download_image($event['picture']['url']);
+        if ($picture_response !== false) {
+          $picture_encoded = 'data:' . $event['picture']['contentType'] . ';base64,' . base64_encode($picture_response);
+          $event['picture']['base64'] = $picture_encoded;
+        }
+      }
+      unset($event);
+    }
+
     EventsCache::set(['url' => $url, 'query' => $query, 'afterDatetime' => $afterDatetime, 'groupName' => $groupName, 'limit' => $limit], $events);
     return $events;
   }
@@ -110,4 +143,28 @@ final class GraphQlClient {
       }
     }
   }
+
+  private static function download_image($url) {
+    // Initialize curl handle
+    $ch = curl_init($url);
+
+    // Set curl options
+    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
+    curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
+    curl_setopt($ch, CURLOPT_TIMEOUT, 60); // Set timeout to 60 seconds (adjust as needed)
+
+    // Execute the request
+    $image_data = curl_exec($ch);
+
+    // Check for errors
+    if (curl_errno($ch)) {
+      print_r(curl_error($ch));
+      throw new \Error('Error: ' . curl_error($ch));
+    }
+
+    // Close curl handle
+    curl_close($ch);
+
+    return $image_data;
+  }
 }

source/readme.txt

@@ -23,6 +23,8 @@ Features
 - Set the URL of the Mobilizon instance in the settings
 - Toggle adding named offset in brackets after the time in the settings
 
+This plugin requests the events via Mobilizon's GraphQL API.
+
 The source code is available on [Github](https://github.com/dwaxweiler/connector-mobilizon).
 
 ## Installation
@@ -41,6 +43,33 @@ You have to use their username, e.g. `@nosliensvivants`, and append the name of
 
 ## Changelog
 
+### [1.3.0]
+#### Added
+- Comment for translators what placeholder will contain
+#### Changed
+- Confirm compatibility with WordPress 6.7
+- Load block script only in footer to reduce waiting time
+- Update dependencies
+#### Fixed
+- Mark event-related data as non-translatable within plugin
+- Add version number to script registration to break browser caching
+- Handle location being null
+
+### [1.2.0]
+#### Added
+- Display event picture if available
+#### Changed
+- Update dependencies
+
+### [1.1.0]
+#### Added
+- Add some spacing between event items
+#### Changed
+- Update dependencies
+- Confirm compatibility with WordPress 6.6
+#### Fixed
+- Fix undefined variable $classNamePrefix for both error views
+
 ### [1.0.0]
 #### Added
 - Display name of group when it cannot be found

source/view/events-list-group-not-found.php

@@ -7,5 +7,8 @@ if (!defined('ABSPATH')) {
 }
 ?>
 <div class="<?php echo esc_attr($classNamePrefix); ?>_events-list">
-  <?php echo esc_html(sprintf(__('The group "%s" could not be found!', 'connector-mobilizon'), $groupName)); ?>
+  <?php
+  /* translators: %s is replaced with the name of the group. */
+  echo esc_html(sprintf(__('The group "%s" could not be found!', 'connector-mobilizon'), $groupName));
+  ?>
 </div>

source/view/events-list.php

@@ -8,14 +8,17 @@ if (!defined('ABSPATH')) {
 ?>
 <div class="<?php echo esc_attr($classNamePrefix); ?>_events-list">
   <ul style="list-style-type: none; padding-left: 0;">
-    <?php foreach($events as $event) { ?>
-    <li>
-      <a href="<?php echo esc_attr($event['url']); ?>"><?php echo esc_html_e($event['title']); ?></a>
+    <?php foreach ($events as $event) { ?>
+    <li style="line-height: 150%; margin-top: 20px;">
+      <?php if (isset($event['picture'])) { ?>
+      <img alt="<?php echo esc_attr($event['picture']['alt']); ?>" src="<?php echo esc_attr($event['picture']['base64']); ?>" style="display: block; max-width: 100%;">
+      <?php } ?>
+      <a href="<?php echo esc_attr($event['url']); ?>"><?php echo esc_html($event['title']); ?></a>
       <br>
-      <?php echo esc_html_e(Formatter::format_date($locale, $timeZone, $event['beginsOn'], $event['endsOn'], $isShortOffsetNameShown)); ?>
+      <?php echo esc_html(Formatter::format_date($locale, $timeZone, $event['beginsOn'], $event['endsOn'], $isShortOffsetNameShown)); ?>
       <?php if (isset($event['physicalAddress'])) { ?>
       <br>
-      <?php echo esc_html_e(Formatter::format_location($event['physicalAddress']['description'], $event['physicalAddress']['locality'])) ?>
+      <?php echo esc_html(Formatter::format_location($event['physicalAddress']['description'], $event['physicalAddress']['locality'])) ?>
       <?php } ?>
     </li>
     <?php } ?>

tests/FormatterTest.php

@@ -42,6 +42,10 @@ final class FormatterTest extends PHPUnit\Framework\TestCase
     $this->assertSame('a', Formatter::format_location('a', ''));
   }
 
+  public function testLocationFormatDescriptionOnlyWithNull(): void {
+    $this->assertSame('a', Formatter::format_location('a', null));
+  }
+
   public function testLocationFormatDescriptionWithSpaceOnly(): void {
     $this->assertSame('', Formatter::format_location(' ', ''));
   }