Release of v3.2.5-beta3

Fix the noticeboard to display Llewellyn's Joomla Social feed.
2024-12-28 13:56:02 +02:00 · 2024-12-28 13:56:02 +02:00 · a3a1c97dae
commit a3a1c97dae
parent 2d1df4ced2
23 changed files with 781 additions and 412 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -1,5 +1,10 @@
-# v3.2.5-beta2
+# v3.2.5-beta3

+- Fix the noticeboard to display Llewellyn's Joomla Social feed
+
+# v3.2.5-beta
+
+- Add first classes for the new import engine.
 - Improve the [VDM Registry] to be Joomla Registry Compatible
 - Move all registries to the [VDM Registry] class
 - Fix Checked Out to be null and not 0. (#1194)
@ -8,10 +13,6 @@
 - Update created_by, modified_by, checked_out fields in table class.
 - Implementation of the decentralized Super-Power CORE repository network. (#1190)

-# v3.2.5-beta
-
- Add first classes for the new import engine.
-
 # v3.2.5-alpha

 - Add [AllowDynamicProperties] in the base view class for J5
--- a/README.md
+++ b/README.md
@ -9,7 +9,7 @@ The Component Builder for [Joomla](https://extensions.joomla.org/extension/compo

 Whether you're a seasoned [Joomla](https://extensions.joomla.org/extension/component-builder/) developer, or have just started, Component Builder will save you lots of time and money. A real must have!

-You can install it quite easily and with no limitations. On [gitea](https://git.vdm.dev/joomla/Component-Builder/tags) is the latest release (3.2.5-beta2) with **ALL** its features and **ALL** concepts totally open-source and free! 
+You can install it quite easily and with no limitations. On [gitea](https://git.vdm.dev/joomla/Component-Builder/tags) is the latest release (3.2.5-beta3) with **ALL** its features and **ALL** concepts totally open-source and free! 

 > Watch Quick Build of a Hello World component in [JCB on Youtube](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&index=45)

@ -144,13 +144,13 @@ TODO
 + *Author*: [Llewellyn van der Merwe](mailto:joomla@vdm.io)
 + *Name*: [Component Builder](https://git.vdm.dev/joomla/Component-Builder)
 + *First Build*: 30th April, 2015
-+ *Last Build*: 16th December, 2024
-+ *Version*: 3.2.5-beta2
+ *Last Build*: 28th December, 2024
+ *Version*: 3.2.5-beta3
 + *Copyright*: Copyright (C) 2015 Vast Development Method. All rights reserved.
 + *License*: GNU General Public License version 2 or later; see LICENSE.txt
-+ *Line count*: **884672**
+ *Line count*: **885046**
 + *Field count*: **2098**
-+ *File count*: **5978**
+ *File count*: **5979**
 + *Folder count*: **507**

 > This **component** was build with a [Joomla](https://extensions.joomla.org/extension/component-builder/) [Automated Component Builder](https://www.joomlacomponentbuilder.com).
--- a/admin/README.txt
+++ b/admin/README.txt
@ -9,7 +9,7 @@ The Component Builder for [Joomla](https://extensions.joomla.org/extension/compo

 Whether you're a seasoned [Joomla](https://extensions.joomla.org/extension/component-builder/) developer, or have just started, Component Builder will save you lots of time and money. A real must have!

-You can install it quite easily and with no limitations. On [gitea](https://git.vdm.dev/joomla/Component-Builder/tags) is the latest release (3.2.5-beta2) with **ALL** its features and **ALL** concepts totally open-source and free! 
+You can install it quite easily and with no limitations. On [gitea](https://git.vdm.dev/joomla/Component-Builder/tags) is the latest release (3.2.5-beta3) with **ALL** its features and **ALL** concepts totally open-source and free! 

 > Watch Quick Build of a Hello World component in [JCB on Youtube](https://www.youtube.com/watch?v=IQfsLYIeblk&list=PLQRGFI8XZ_wtGvPQZWBfDzzlERLQgpMRE&index=45)

@ -144,13 +144,13 @@ TODO
 + *Author*: [Llewellyn van der Merwe](mailto:joomla@vdm.io)
 + *Name*: [Component Builder](https://git.vdm.dev/joomla/Component-Builder)
 + *First Build*: 30th April, 2015
-+ *Last Build*: 16th December, 2024
-+ *Version*: 3.2.5-beta2
+ *Last Build*: 28th December, 2024
+ *Version*: 3.2.5-beta3
 + *Copyright*: Copyright (C) 2015 Vast Development Method. All rights reserved.
 + *License*: GNU General Public License version 2 or later; see LICENSE.txt
-+ *Line count*: **884672**
+ *Line count*: **885046**
 + *Field count*: **2098**
-+ *File count*: **5978**
+ *File count*: **5979**
 + *Folder count*: **507**

 > This **component** was build with a [Joomla](https://extensions.joomla.org/extension/component-builder/) [Automated Component Builder](https://www.joomlacomponentbuilder.com).
--- a/admin/assets/css/compiler.css
+++ b/admin/assets/css/compiler.css
@ -16,4 +16,97 @@ html, body {
 .jcb-sponsor-banner {
 	-webkit-box-shadow: 0 0 7px 1px #f0f0f0;
 	box-shadow: 0 0 7px 1px #f0f0f0;
+}
+
+/* Spinning effect within the mastadon-display-block */
+.mastadon-display-block .spinning i {
+    animation: spin 1s linear infinite;
+}
+
+.mastadon-display-block .enlarge-and-disappear {
+    animation: enlarge-fade-out 1s forwards;
+}
+
+@keyframes spin {
+    from {
+        transform: rotate(0deg);
+    }
+    to {
+        transform: rotate(360deg);
+    }
+}
+
+@keyframes enlarge-fade-out {
+    0% {
+        transform: scale(1);
+        opacity: 1;
+    }
+    100% {
+        transform: scale(2);
+        opacity: 0;
+    }
+}
+
+/* Placeholder container scoped to mastadon-display-block */
+.mastadon-display-block .placeholder {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+    margin-bottom: 16px;
+    padding: 16px;
+    background-color: #fff;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+}
+
+.mastadon-display-block .placeholder-line {
+    height: 12px;
+    background-color: #f0f0f0;
+    border-radius: 4px;
+    animation: pulse 1.5s infinite;
+}
+
+.mastadon-display-block .placeholder-line:nth-child(1) {
+    width: 80%;
+}
+.mastadon-display-block .placeholder-line:nth-child(2) {
+    width: 60%;
+}
+.mastadon-display-block .placeholder-line:nth-child(3) {
+    width: 40%;
+}
+
+.mastadon-display-block .placeholder-circle {
+    width: 50px;
+    height: 50px;
+    background-color: #f0f0f0;
+    border-radius: 50%;
+    animation: pulse 1.5s infinite;
+    margin-top: 10px;
+}
+
+@keyframes pulse {
+    0% {
+    opacity: 1;
+    }
+    50% {
+        opacity: 0.5;
+    }
+    100% {
+        opacity: 1;
+    }
+}
+
+.mastadon-display-block .loading {
+    visibility: visible;
+    position: relative;
+}
+
+.social-icon-details {
+	min-height: 50px;
+	width: 100%;
+	padding: 5px;
+	box-sizing: border-box;
+	font-size: 10px;
+	text-align: right;
 }
--- a/admin/assets/js/compiler.js
+++ b/admin/assets/js/compiler.js
@ -0,0 +1,302 @@
+/**
+ * @package    Joomla.Component.Builder
+ *
+ * @created    30th April, 2015
+ * @author     Llewellyn van der Merwe <https://dev.vdm.io>
+ * @git        Joomla Component Builder <https://git.vdm.dev/joomla/Component-Builder>
+ * @copyright  Copyright (C) 2015 Vast Development Method. All rights reserved.
+ * @license    GNU General Public License version 2 or later; see LICENSE.txt
+ */
+
+/* JS Document */
+class MastodonFeed {
+  constructor(containerId, refreshButtonId) {
+    this.container = document.getElementById(containerId);
+    this.refreshButton = document.getElementById(refreshButtonId);
+
+    // Get settings from data attributes
+    this.mastodonInstance = this.container.dataset.instance;
+    this.accountId = this.container.dataset.accountId;
+    this.postCount = parseInt(this.container.dataset.postCount) || 5;
+
+    this.cacheKey = "mastodon-feed-cache";
+    this.cacheExpiration = 24 * 60 * 60 * 1000; // 24 hours in milliseconds
+
+    // Initialize the feed
+    this.initFeed();
+
+    // Attach event listener for the refresh button
+    this.refreshButton.addEventListener("click", () => this.clearCacheAndReload());
+  }
+
+  async initFeed() {
+    const cachedData = this.getCachedData();
+
+    if (cachedData) {
+      this.renderFeed(cachedData);
+    } else {
+      await this.loadFeed();
+    }
+  }
+
+  getCachedData() {
+    const cache = localStorage.getItem(this.cacheKey);
+    if (!cache) return null;
+
+    const parsedCache = JSON.parse(cache);
+    const now = new Date().getTime();
+
+    if (now - parsedCache.timestamp > this.cacheExpiration) {
+      // Cache is expired
+      this.clearCache();
+      return null;
+    }
+
+    return parsedCache.data;
+  }
+
+  setCachedData(data) {
+    const cache = {
+      timestamp: new Date().getTime(),
+      data: data,
+    };
+    localStorage.setItem(this.cacheKey, JSON.stringify(cache));
+  }
+
+  clearCache() {
+    localStorage.removeItem(this.cacheKey);
+  }
+
+  async loadFeed() {
+    try {
+      const response = await fetch(`${this.mastodonInstance}/api/v1/accounts/${this.accountId}/statuses?limit=${this.postCount}`);
+
+      if (!response.ok) {
+        throw new Error(`Failed to fetch Mastodon feed: ${response.statusText}`);
+      }
+
+      const posts = await response.json();
+      this.setCachedData(posts); // Cache the data
+      this.renderFeed(posts);
+    } catch (error) {
+      console.error("Error loading Mastodon feed:", error);
+      this.container.innerHTML = `<div class="alert alert-danger">Error loading feed. Please try again later.</div>`;
+    }
+  }
+
+  renderFeed(posts) {
+    // Clear existing content
+    this.container.innerHTML = "";
+
+    posts.forEach(post => {
+      if (!post.content) return; // Ignore posts with no content
+
+      // Create post element
+      const listItem = document.createElement("div");
+      listItem.className = "well well-small";
+
+      const postContent = document.createElement("div");
+
+      const user = post.account;
+      const avatar = user.avatar_static;
+      const displayName = user.display_name || user.username;
+
+      // User header
+      const header = document.createElement("div");
+      header.className = "media";
+
+      const avatarLink = document.createElement("a");
+      avatarLink.href = user.url;
+      avatarLink.className = "pull-left";
+
+      const avatarImg = document.createElement("img");
+      avatarImg.src = avatar;
+      avatarImg.alt = displayName;
+      avatarImg.className = "img-circle";
+      avatarImg.style.width = "40px";
+
+      avatarLink.appendChild(avatarImg);
+
+      const userInfo = document.createElement("div");
+      userInfo.className = "media-body";
+
+      const nameLink = document.createElement("a");
+      nameLink.href = user.url;
+      nameLink.className = "muted";
+      nameLink.textContent = displayName;
+
+      const username = document.createElement("span");
+      username.className = "small muted";
+      username.textContent = ` (@${user.username})`;
+
+      const userHeader = document.createElement("h5");
+      userHeader.appendChild(nameLink);
+      userHeader.appendChild(username);
+
+      userInfo.appendChild(userHeader);
+
+      header.appendChild(avatarLink);
+      header.appendChild(userInfo);
+
+      // Post content
+      const content = document.createElement("p");
+      content.innerHTML = post.content;
+
+      // Interactions
+      const interactions = document.createElement("div");
+      interactions.className = "btn-group";
+
+      // View Post link
+      const viewPost = document.createElement("a");
+      viewPost.href = post.url;
+      viewPost.className = "btn btn-small btn-primary";
+      viewPost.innerHTML = `View Post&nbsp;&nbsp;
+        &nbsp;&nbsp;<i class="icon-comments"></i> ${post.replies_count}&nbsp;
+        &nbsp;&nbsp;<i class="icon-thumbs-up"></i> ${post.favourites_count}&nbsp;
+        <i class="icon-loop"></i> ${post.reblogs_count}`;
+      interactions.appendChild(viewPost);
+
+      // Join Me link
+      const joinLink = document.createElement("a");
+      joinLink.href = "https://joomla.social/invite/gzAvC48K";
+      joinLink.className = "btn btn-small btn-success";
+      joinLink.textContent = "Join Me";
+      interactions.appendChild(joinLink);
+
+      // Assemble post
+      postContent.appendChild(header);
+      postContent.appendChild(content);
+      postContent.appendChild(interactions);
+
+      listItem.appendChild(postContent);
+      this.container.appendChild(listItem);
+      this.container.classList.remove('loading');
+    });
+  }
+
+  clearCacheAndReload() {
+    // Add spinning effect to the refresh button
+    this.refreshButton.classList.add('spinning');
+
+    // Show placeholder content
+    this.container.classList.add('loading');
+    this.container.innerHTML = this.generatePlaceholder();
+
+    // Clear cache and reload feed
+    this.clearCache();
+
+    // Wait for 3 seconds
+    setTimeout(() => {
+      // Enlarge and fade out the refresh button
+      this.refreshButton.classList.add('enlarge-and-disappear');
+
+      // After the animation, reset the button and content
+      setTimeout(() => {
+        this.refreshButton.classList.remove('spinning', 'enlarge-and-disappear');
+        this.refreshButton.style.display = '';
+
+        // Remove placeholder and restore actual content
+        this.loadFeed();
+      }, 1000); // Animation time for fade-out
+    }, 3000); // Spinning duration
+  }
+
+  generatePlaceholder() {
+    let placeholders = '';
+    for (let i = 0; i < this.postCount; i++) {
+      placeholders += `
+          <div class="placeholder">
+            <div class="placeholder-circle"></div>
+            <div class="placeholder-line"></div>
+            <div class="placeholder-line"></div>
+            <div class="placeholder-line"></div>
+            <div class="placeholder-line"></div>
+          </div>
+        `;
+    }
+    return placeholders;
+  }
+}
+
+class IconWaveAnimator {
+  constructor(containerId, detailsId) {
+    this.details = document.getElementById(detailsId);
+    this.container = document.getElementById(containerId);
+    this.icons = this.container.querySelectorAll("i");
+    this.links = this.container.querySelectorAll("a");
+    this.init();
+  }
+
+  init() {
+    // set the icon hover events
+    this.setupHoverEvents();
+
+    // Random chance to do nothing (1 out of 10)
+    if (Math.random() < 0.1) return;
+
+    // Randomize the initial delay before starting
+    const initialDelay = Math.random() * 2000 + 2000; // 2–4 seconds
+    setTimeout(() => {
+      this.randomBehavior();
+    }, initialDelay);
+
+    // Occasionally trigger a second wave after 10 seconds
+    if (Math.random() > 0.5) {
+      setTimeout(() => {
+        this.mexicanWave(false); // Reverse wave
+      }, 10000);
+    }
+  }
+
+  mexicanWave(forward = true) {
+    let delay = 0;
+    const iconsArray = Array.from(this.icons);
+
+    (forward ? iconsArray : iconsArray.reverse()).forEach((icon) => {
+      setTimeout(() => {
+        icon.style.transition = "transform 0.3s ease-in-out";
+        icon.style.transform = "scale(1.3)";
+        setTimeout(() => {
+          icon.style.transform = "scale(1)";
+        }, 300);
+      }, delay);
+      delay += 150; // Stagger the effect for the wave
+    });
+  }
+
+  randomBehavior() {
+    const waveDirection = Math.random() > 0.5 ? "forward" : "backward";
+    const waveCount = Math.floor(Math.random() * 10) + 1; // 1 to 5 waves
+    const interval = Math.random() * 2000 + 3000; // 3 to 5 seconds
+
+    let executedCount = 0;
+    const intervalId = setInterval(() => {
+      if (executedCount >= waveCount) {
+        clearInterval(intervalId);
+        return;
+      }
+      this.mexicanWave(waveDirection === "forward");
+      executedCount++;
+    }, interval);
+  }
+
+  setupHoverEvents() {
+    this.links.forEach((link) => {
+      link.addEventListener("mouseenter", () => this.showDetails(link));
+      link.addEventListener("mouseleave", () => this.clearDetails());
+    });
+  }
+
+  showDetails(link) {
+    const description = link.dataset.description;
+    if (this.details && description) {
+      this.details.textContent = description;
+    }
+  }
+
+  clearDetails() {
+    if (this.details) {
+      this.details.textContent = "";
+    }
+  }
+}
--- a/admin/language/en-GB/en-GB.com_componentbuilder.ini
+++ b/admin/language/en-GB/en-GB.com_componentbuilder.ini
@ -1287,7 +1287,6 @@ COM_COMPONENTBUILDER_ALIGNMENT="Alignment"
 COM_COMPONENTBUILDER_ALL="All"
 COM_COMPONENTBUILDER_ALLOWS_YOU_TO_OVERRIDE_THE_BUILD_DATE_BY_SELECTING_A_DATE_MANUALLY_FROM_THE_CALENDER="Allows you to override the build date by selecting a date manually from the calender."
 COM_COMPONENTBUILDER_ALL_FOUND_INSTANCES_IN_S_WHERE_REPLACED="All found instances in %s where replaced"
-COM_COMPONENTBUILDER_ALL_IS_GOOD_PLEASE_CHECK_AGAIN_LATER="All is good, please check again later"
 COM_COMPONENTBUILDER_ALL_IS_GOOD_THERE_IS_NO_NOTICE_AT_THIS_TIME="All is good, there is no notice at this time."
 COM_COMPONENTBUILDER_ALL_OF_THESE_PACKAGES_ARE_A_FULLY_DEVELOPEDMAPPED_COMPONENTS_FOR_JCB_THEY_CAN_BE_SEEN_AS_DEMO_CONTENT_OR_BASE_IMAGES_FROM_WHICH_TO_START_YOUR_PROJECTBR_ALWAYS_MAKE_SURE_YOU_ARE_ON_THE_LATEST_VERSION_OF_JCB_BEFORE_IMPORTING_ANY_OF_THESE_PACKAGES_SHOULD_ANY_OF_THEM_FAIL_TO_IMPORT_A_S_PLEASE_LET_US_KNOWA="All of these packages are a fully developed/mapped components for JCB. They can be seen as demo content, or base images from which to start your project.<br />Always make sure you are on the latest version of JCB before importing any of these packages, should any of them fail to import <a %s >please let us know</a>."
 COM_COMPONENTBUILDER_ALL_THE_FIELDS_AND_VIEWS_FROM_YOUR_SQL_DUMP_HAS_BEEN_CREATED_AND_LINKED_TO_THIS_COMPONENT="All the fields and views from your sql dump has been created and linked to this component."
@ -1351,6 +1350,7 @@ COM_COMPONENTBUILDER_BTHE_TMP_FOLDER_HAS_BEEN_CLEARED_SUCCESSFULLYB="<b>The tmp
 COM_COMPONENTBUILDER_BUILD="Build"
 COM_COMPONENTBUILDER_BUILDIN="Build-in"
 COM_COMPONENTBUILDER_BUILD_DATE="Build Date"
+COM_COMPONENTBUILDER_BUILD_INNOVATE_AND_THRIVE_WITH_LLEWELLYN_ON_GITHUB_TURNING_IDEAS_INTO_IMPACT="Build, Innovate, and Thrive with Llewellyn on GitHub: Turning Ideas into Impact!"
 COM_COMPONENTBUILDER_BULK="Bulk"
 COM_COMPONENTBUILDER_BULK_GET_ALL_NEW_SNIPPETS="Bulk Get All New Snippets"
 COM_COMPONENTBUILDER_BULK_TOOLS="Bulk Tools"
@ -1647,6 +1647,7 @@ COM_COMPONENTBUILDER_CLONE_FAILED="Clone failed!"
 COM_COMPONENTBUILDER_CLOSE_NEW="Close & New"
 COM_COMPONENTBUILDER_CODE="Code"
 COM_COMPONENTBUILDER_CODESTRINGS="code/strings"
+COM_COMPONENTBUILDER_COLLABORATE_AND_INNOVATE_WITH_LLEWELLYN_ON_GIT_BUILDING_A_BETTER_CODE_FUTURE="Collaborate and Innovate with Llewellyn on Git: Building a Better Code Future!"
 COM_COMPONENTBUILDER_COMMUNITY_PACKAGES="Community Packages"
 COM_COMPONENTBUILDER_COMPANY="Company"
 COM_COMPONENTBUILDER_COMPANY_NAME="Company Name"
@ -2963,7 +2964,6 @@ COM_COMPONENTBUILDER_COMPONENT_FILES_FOLDERS_SAVE_WARNING="Alias already existed
 COM_COMPONENTBUILDER_COMPONENT_FILES_FOLDERS_STATUS="Status"
 COM_COMPONENTBUILDER_COMPONENT_FILES_FOLDERS_VERSION_DESC="A count of the number of times this Component Files & Folders has been revised."
 COM_COMPONENTBUILDER_COMPONENT_FILES_FOLDERS_VERSION_LABEL="Version"
-COM_COMPONENTBUILDER_COMPONENT_GLOBAL_SETTINGS="Component Global Settings"
 COM_COMPONENTBUILDER_COMPONENT_MODULES="Component Modules"
 COM_COMPONENTBUILDER_COMPONENT_MODULES_ADDJOOMLA_MODULES_DESCRIPTION="Setup the Joomla modules for this component."
 COM_COMPONENTBUILDER_COMPONENT_MODULES_ADDJOOMLA_MODULES_LABEL="Joomla Modules"
@ -3179,6 +3179,7 @@ COM_COMPONENTBUILDER_COMPONENT_ROUTER_SITEVIEW_LABEL="View"
 COM_COMPONENTBUILDER_COMPONENT_ROUTER_STATUS="Status"
 COM_COMPONENTBUILDER_COMPONENT_ROUTER_VERSION_DESC="A count of the number of times this Component Router has been revised."
 COM_COMPONENTBUILDER_COMPONENT_ROUTER_VERSION_LABEL="Version"
+COM_COMPONENTBUILDER_COMPONENT_SETTINGS="Component Settings"
 COM_COMPONENTBUILDER_COMPONENT_SITE_VIEWS="Component Site Views"
 COM_COMPONENTBUILDER_COMPONENT_SITE_VIEWS_ACCESS_DESCRIPTION="Select if this view<br />should use access."
 COM_COMPONENTBUILDER_COMPONENT_SITE_VIEWS_ACCESS_LABEL="Add Access"
@ -3612,6 +3613,7 @@ COM_COMPONENTBUILDER_CONFIG_VDM_PACKAGES="VDM Packages"
 COM_COMPONENTBUILDER_CONFIG_VIEW_FIELD_LABEL="View & Field"
 COM_COMPONENTBUILDER_CONFIG_YES="Yes"
 COM_COMPONENTBUILDER_CONFIRMATION_STEP_BEFORE_IMPORTING="Confirmation Step Before Importing!"
+COM_COMPONENTBUILDER_CONNECT_AND_ENGAGE_WITH_LLEWELLYN_ON_JOOMLA_SOCIAL_EMPOWERING_COMMUNITIES_ONE_POST_AT_A_TIME="Connect and Engage with Llewellyn on Joomla Social: Empowering Communities, One Post at a Time!"
 COM_COMPONENTBUILDER_CONTEXT="Context"
 COM_COMPONENTBUILDER_CONTRIBUTE_TO_JCB="Contribute to JCB"
 COM_COMPONENTBUILDER_CONTRIBUTOR="Contributor"
@ -4221,6 +4223,7 @@ COM_COMPONENTBUILDER_DISPLAY_SWITCH_FOR_DYNAMIC_PLACEMENT_IN_RELATION_TO_THE_USE
 COM_COMPONENTBUILDER_DIVERGED="Diverged"
 COM_COMPONENTBUILDER_DIVERGED_MEANS_YOUR_BLOCAL_SNIPPETB_WITH_THE_SAME_NAME_LIBRARY_AND_TYPE_HAS_A_BDIVERGEDB_FROM_THE_COMMUNITY_SNIPPET_WITH_THE_SAME_NAME_LIBRARY_AND_TYPE_IN_THAT_IT_DOES_NOT_HAVE_THE_SAME_BCREATIONB_OR_BMODIFIED_DATEB="Diverged means your <b>local snippet</b> (with the same name, library and type) has a <b>diverged</b> from the community snippet (with the same name, library and type) in that it does not have the same <b>creation</b> or <b>modified date</b>."
 COM_COMPONENTBUILDER_DOES_THIS_PACKAGE_REQUIRE_A_KEY_TO_INSTALL="Does this package require a key to install."
+COM_COMPONENTBUILDER_DONATE_TOWARDS_JCB_HELP_LLEWELLYN_FINANCIALLY_SO_HE_CAN_CONTINUE_DEVELOPING_THIS_GREAT_TOOL="Donate towards JCB: Help Llewellyn financially so he can continue developing this great tool!"
 COM_COMPONENTBUILDER_DONATE_TO_JCB="Donate to JCB"
 COM_COMPONENTBUILDER_DONATIONS="Donations!"
 COM_COMPONENTBUILDER_DOWNLOAD_UPDATE="Download Update"
@ -4567,6 +4570,7 @@ COM_COMPONENTBUILDER_EVERY_LANGUAGE="Every language"
 COM_COMPONENTBUILDER_EXACT_LENGTH_ONLY_FOUR_TEXT_FIELD="Exact Length (only 4 text_field)"
 COM_COMPONENTBUILDER_EXAMPLE="Example"
 COM_COMPONENTBUILDER_EXIT_TRASH="Exit trash"
+COM_COMPONENTBUILDER_EXPLORE_LEARN_AND_CREATE_WITH_LLEWELLYN_ON_YOUTUBE_YOUR_GATEWAY_TO_INSPIRATION="Explore, Learn, and Create with Llewellyn on YouTube: Your Gateway to Inspiration!"
 COM_COMPONENTBUILDER_EXPORTIMPORT_DATA="Export/Import Data"
 COM_COMPONENTBUILDER_EXPORT_COMPLETED="Export Completed!"
 COM_COMPONENTBUILDER_EXPORT_DATA="Export Data"
@ -5516,8 +5520,6 @@ COM_COMPONENTBUILDER_JCB_PACKAGE_INFO_PATH_DOES_NOT_WORK_WE_ADVICE_YOU_BNOT_TO_C
 COM_COMPONENTBUILDER_JCB_PROMOTES_EFFICIENCY="JCB Promotes Efficiency"
 COM_COMPONENTBUILDER_JCB_PROMOTES_GOODWILL="JCB Promotes Goodwill"
 COM_COMPONENTBUILDER_JCB_PROVIDES_A_BETTER_EXPERIENCE="JCB Provides a Better Experience"
-COM_COMPONENTBUILDER_JCB_PRO_BOARD="JCB Pro board"
-COM_COMPONENTBUILDER_JCB_PRO_NOTICE_BOARD="JCB Pro Notice Board"
 COM_COMPONENTBUILDER_JCB_REDUCES_DEVELOPMENT_COSTS="JCB Reduces Development Costs"
 COM_COMPONENTBUILDER_JCB_SAVES_TIME="JCB Saves Time"
 COM_COMPONENTBUILDER_JCB_STREAMLINES_DEVELOPMENT="JCB Streamlines Development"
@ -5535,9 +5537,12 @@ COM_COMPONENTBUILDER_JCB_YOUR_SUPPORT_MATTERS_MOST="JCB: Your Support Matters Mo
 COM_COMPONENTBUILDER_JOIN_FIELDS="Join Fields"
 COM_COMPONENTBUILDER_JOIN_JCBS_COMMUNITY="Join JCB's Community"
 COM_COMPONENTBUILDER_JOIN_JCBS_JOURNEY="Join JCB's Journey"
+COM_COMPONENTBUILDER_JOIN_JCBS_LEAD_DEVELOPER_ON_JOOMLA_SOCIAL_A_MASTODON_INSTANCE="Join JCB's lead developer on Joomla! social a Mastodon instance."
 COM_COMPONENTBUILDER_JOIN_JCBS_MISSION="Join JCB's Mission"
 COM_COMPONENTBUILDER_JOIN_JCBS_SUCCESS="Join JCB's Success"
 COM_COMPONENTBUILDER_JOIN_JCBS_VISION="Join JCB's Vision"
+COM_COMPONENTBUILDER_JOIN_LLEWELLYN_ON_THE_JOOMLA_VOLUNTEER_PORTAL_SHAPING_THE_FUTURE_TOGETHER="Join Llewellyn on the Joomla Volunteer Portal: Shaping the Future Together!"
+COM_COMPONENTBUILDER_JOIN_THE_CONVERSATION_WITH_LLEWELLYN_ON_X_WHERE_IDEAS_TAKE_FLIGHT="Join the Conversation with Llewellyn on X: Where Ideas Take Flight!"
 COM_COMPONENTBUILDER_JOIN_TYPE="Join Type"
 COM_COMPONENTBUILDER_JOOMLA_COMPONENT="Joomla Component"
 COM_COMPONENTBUILDER_JOOMLA_COMPONENTS="Joomla Components"
@ -5744,6 +5749,7 @@ COM_COMPONENTBUILDER_JOOMLA_COMPONENT_GUID_DESCRIPTION="Globally Unique Identifi
 COM_COMPONENTBUILDER_JOOMLA_COMPONENT_GUID_HINT="Auto Generated"
 COM_COMPONENTBUILDER_JOOMLA_COMPONENT_GUID_LABEL="GUID"
 COM_COMPONENTBUILDER_JOOMLA_COMPONENT_ID="Id"
+COM_COMPONENTBUILDER_JOOMLA_COMPONENT_IMAGE="Joomla Component Image"
 COM_COMPONENTBUILDER_JOOMLA_COMPONENT_IMAGE_DESCRIPTION="The component image (product box) for the dashboard and install page, must be 300px X 300px."
 COM_COMPONENTBUILDER_JOOMLA_COMPONENT_IMAGE_LABEL="Component Image"
 COM_COMPONENTBUILDER_JOOMLA_COMPONENT_IMPORT_JCB_PACKAGES_BUTTON_ACCESS="Joomla Component Import JCB Packages Button Access"
@ -7531,6 +7537,8 @@ COM_COMPONENTBUILDER_LINK_LOCAL_DYNAMIC="Link & Local (dynamic)"
 COM_COMPONENTBUILDER_LINK_TO_THE_CONTRIBUTOR="Link to the contributor"
 COM_COMPONENTBUILDER_LIST_FIELD="List Field"
 COM_COMPONENTBUILDER_LIST_VIEW="List View"
+COM_COMPONENTBUILDER_LLEWELLYNS_JOOMLA_SOCIAL_FEED="Llewellyn's Joomla! Social Feed"
+COM_COMPONENTBUILDER_LLEWELLYN_ON_DOCKER_CONTAINERIZE_YOUR_CREATIVITY="Llewellyn on Docker: Containerize Your Creativity!"
 COM_COMPONENTBUILDER_LOADING="loading"
 COM_COMPONENTBUILDER_LOADING_THE_PRIVATE_KEY_FILE_FAILED="Loading the private key file failed"
 COM_COMPONENTBUILDER_LOADING_THE_PRIVATE_KEY_TEXT_FAILED="Loading the private key text failed"
@ -7925,6 +7933,7 @@ COM_COMPONENTBUILDER_PUSH_FAILED="Push Failed!"
 COM_COMPONENTBUILDER_README="Readme"
 COM_COMPONENTBUILDER_READY_TO_COMPILE_A_COMPONENT="Ready to compile a component"
 COM_COMPONENTBUILDER_REFRESH="Refresh"
+COM_COMPONENTBUILDER_REFRESH_FEED="Refresh Feed"
 COM_COMPONENTBUILDER_REGEX_SEARCH="Regex Search"
 COM_COMPONENTBUILDER_REMOVE="Remove"
 COM_COMPONENTBUILDER_REMOVING_ALL_ZIP_PACKAGES_FROM_THE_TEMPORARY_FOLDER_OF_THE_JOOMLA_INSTALL="Removing all zip packages from the temporary folder of the Joomla install"
@ -9138,7 +9147,6 @@ COM_COMPONENTBUILDER_THE_POWER_HAS_SUCCESSFULLY_BEEN_PUSHED="The power has succe
 COM_COMPONENTBUILDER_THE_POWER_HAS_SUCCESSFULLY_BEEN_RESET="The power has successfully been reset."
 COM_COMPONENTBUILDER_THE_PRIVATE_KEY_FIELD_COULD_NOT_BE_LOADED_FOR_BSB_SERVER="The private key field could not be loaded for <b>%s</b> server!"
 COM_COMPONENTBUILDER_THE_PRIVATE_KEY_FILE_COULD_NOT_BE_LOADEDFOUND_FOR_BSB_SERVER="The private key file could not be loaded/found for <b>%s</b> server!"
-COM_COMPONENTBUILDER_THE_PRO_BOARD_IS_LOADING="The pro board is loading"
 COM_COMPONENTBUILDER_THE_PUSH_OF_THESE_JOOMLA_FIELD_TYPES_HAS_FAILED="The push of these Joomla Field Types has failed."
 COM_COMPONENTBUILDER_THE_PUSH_OF_THESE_JOOMLA_POWERS_HAS_FAILED="The push of these Joomla Powers has failed."
 COM_COMPONENTBUILDER_THE_PUSH_OF_THESE_POWERS_HAS_FAILED="The push of these Powers has failed."
@ -9246,6 +9254,7 @@ COM_COMPONENTBUILDER_TYPE_TEMPLATE="Template"
 COM_COMPONENTBUILDER_TYPE_VALIDATION_RULE="Validation Rule"
 COM_COMPONENTBUILDER_UNACTIVE_ONLY_FOUR_TEXT_FIELD="Unactive (only 4 text_field)"
 COM_COMPONENTBUILDER_UNDERNEATH_TABS="Underneath Tabs"
+COM_COMPONENTBUILDER_UNLOCK_TRUST_AND_SECURITY_WITH_LLEWELLYNS_GPG_KEY_YOUR_GATEWAY_TO_VERIFIED_CONNECTIONS="Unlock Trust and Security with Llewellyn's GPG Key: Your Gateway to Verified Connections!"
 COM_COMPONENTBUILDER_UPDATE="Update"
 COM_COMPONENTBUILDER_UPDATE_ALL="Update All"
 COM_COMPONENTBUILDER_UPDATE_ALL_DIVERGED_SNIPPETS="Update All Diverged Snippets"
@ -9344,7 +9353,6 @@ COM_COMPONENTBUILDER_VALIDATION_RULE_STATUS="Status"
 COM_COMPONENTBUILDER_VALIDATION_RULE_VERSION_DESC="A count of the number of times this Validation Rule has been revised."
 COM_COMPONENTBUILDER_VALIDATION_RULE_VERSION_LABEL="Version"
 COM_COMPONENTBUILDER_VALUE="Value"
-COM_COMPONENTBUILDER_VDM_BOARD="VDM board"
 COM_COMPONENTBUILDER_VDM_NOTICE_BOARD="VDM Notice Board"
 COM_COMPONENTBUILDER_VDM_PACKAGES="VDM Packages"
 COM_COMPONENTBUILDER_VERSION="Version"
--- a/admin/layouts/jcbnoticeboardpro.php
+++ b/admin/layouts/jcbnoticeboardpro.php
@ -20,8 +20,8 @@ use Joomla\CMS\Layout\LayoutHelper;


 ?>
-<div  class="well well-small">
-	<h2 class="module-title nav-header"><?= Text::_('COM_COMPONENTBUILDER_JCB_PRO_NOTICE_BOARD') ?></h2>
-	<div class="proboard-md"><small><?= Text::_('COM_COMPONENTBUILDER_THE_PRO_BOARD_IS_LOADING') ?><span class="loading-dots">.</span></small></div>
-	<div style="text-align:right;"><small><a href="https://vdm.bz/get-jcb-pro-membership" target="_blank" style="color:gray">JCB PRO</a></small></div>
-</div>
+<div id="noticeboard">
+	<?php echo LayoutHelper::render('mastodon', $displayData ?? []); ?>
+</div>
+<?php echo LayoutHelper::render('socialnetworking', null); ?>
+<div><?php echo ComponentbuilderHelper::getDynamicContent('banner', '728-90'); ?></div>
--- a/admin/layouts/jcbnoticeboardtabs.php
+++ b/admin/layouts/jcbnoticeboardtabs.php
@ -1,34 +0,0 @@
-<?php
-/**
- * @package    Joomla.Component.Builder
- *
- * @created    30th April, 2015
- * @author     Llewellyn van der Merwe <https://dev.vdm.io>
- * @git        Joomla Component Builder <https://git.vdm.dev/joomla/Component-Builder>
- * @copyright  Copyright (C) 2015 Vast Development Method. All rights reserved.
- * @license    GNU General Public License version 2 or later; see LICENSE.txt
- */
-
-// No direct access to this file
-defined('JPATH_BASE') or die('Restricted access');
-
-use Joomla\CMS\Factory;
-use Joomla\CMS\Language\Text;
-use Joomla\CMS\HTML\HTMLHelper as Html;
-use Joomla\CMS\Layout\LayoutHelper;
-
-
-
-?>
-<div id="<?php echo  $displayData['id']; ?>">
-	<?php echo Html::_('bootstrap.startTabSet', $displayData['id'] . '_tab', array('active' => $displayData['active'] . '-noticeboard')); ?>
-		<?php echo Html::_('bootstrap.addTab', $displayData['id'] . '_tab', 'vdm-noticeboard', Text::_('COM_COMPONENTBUILDER_VDM_BOARD', true)); ?>
-			<?php echo LayoutHelper::render('jcbnoticeboardvdm', null); ?>
-			<div class="p-md-3"><?php echo ComponentbuilderHelper::getDynamicContent('banner', '728-90'); ?></div>
-		<?php echo Html::_('bootstrap.endTab'); ?>
-		<?php echo Html::_('bootstrap.addTab', $displayData['id'] . '_tab', 'pro-noticeboard', Text::_('COM_COMPONENTBUILDER_JCB_PRO_BOARD', true)); ?>
-			<?php echo LayoutHelper::render('jcbnoticeboardpro', null); ?>
-			<div class="p-md-3"><?php echo  ComponentbuilderHelper::getDynamicContent('banner', '728-90'); ?></div>
-		<?php echo Html::_('bootstrap.endTab'); ?>
-	<?php echo Html::_('bootstrap.endTabSet'); ?>
-</div>
--- a/admin/layouts/jcbnoticeboardvdm.php
+++ b/admin/layouts/jcbnoticeboardvdm.php
@ -1,27 +0,0 @@
-<?php
-/**
- * @package    Joomla.Component.Builder
- *
- * @created    30th April, 2015
- * @author     Llewellyn van der Merwe <https://dev.vdm.io>
- * @git        Joomla Component Builder <https://git.vdm.dev/joomla/Component-Builder>
- * @copyright  Copyright (C) 2015 Vast Development Method. All rights reserved.
- * @license    GNU General Public License version 2 or later; see LICENSE.txt
- */
-
-// No direct access to this file
-defined('JPATH_BASE') or die('Restricted access');
-
-use Joomla\CMS\Factory;
-use Joomla\CMS\Language\Text;
-use Joomla\CMS\HTML\HTMLHelper as Html;
-use Joomla\CMS\Layout\LayoutHelper;
-
-
-
-?>
-<div  class="well well-small">
-	<h2 class="module-title nav-header"><?= Text::_('COM_COMPONENTBUILDER_VDM_NOTICE_BOARD') ?><span class="vdm-new-notice" style="display:none; color:red;"> (<?= Text::_('COM_COMPONENTBUILDER_NEW_NOTICE') ?>)</span></h2>
-	<div class="noticeboard-md"><small><?= Text::_('COM_COMPONENTBUILDER_THE_NOTICE_BOARD_IS_LOADING') ?><span class="loading-dots">.</span></small></div>
-	<div style="text-align:right;"><small><a href="https://github.com/Llewellynvdm" target="_blank" style="color:gray">&lt;&lt;ewe&gt;&gt;yn</a></small></div>
-</div>
--- a/admin/layouts/mastodon.php
+++ b/admin/layouts/mastodon.php
@ -0,0 +1,71 @@
+<?php
+/**
+ * @package    Joomla.Component.Builder
+ *
+ * @created    30th April, 2015
+ * @author     Llewellyn van der Merwe <https://dev.vdm.io>
+ * @git        Joomla Component Builder <https://git.vdm.dev/joomla/Component-Builder>
+ * @copyright  Copyright (C) 2015 Vast Development Method. All rights reserved.
+ * @license    GNU General Public License version 2 or later; see LICENSE.txt
+ */
+
+// No direct access to this file
+defined('JPATH_BASE') or die('Restricted access');
+
+use Joomla\CMS\Factory;
+use Joomla\CMS\Language\Text;
+use Joomla\CMS\HTML\HTMLHelper as Html;
+use Joomla\CMS\Layout\LayoutHelper;
+
+// Extract all keys from $displayData as individual variables.
+extract($displayData ?? []);
+
+// The 'id' parameter, defaulting to mastodon-feed.
+$id ??= 'mastodon-feed';
+
+// The button 'id' parameter, defaulting to refresh-feed.
+$button_id ??= 'refresh-feed';
+
+// The mastodon instance URL
+$instance ??= 'https://joomla.social';
+
+// The user account ID
+$account ??= '112766899254600077';
+
+// The number of post to load
+$posts ??= 5;
+
+// The 'invite_url' parameter, defaulting to https://joomla.social/invite/gzAvC48K.
+$invite_url ??= 'https://joomla.social/invite/gzAvC48K';
+
+// The 'invite_heading' parameter.
+$invite_heading ??= Text::_("COM_COMPONENTBUILDER_LLEWELLYNS_JOOMLA_SOCIAL_FEED");
+
+// The 'invite_title' parameter.
+$invite_title ??= Text::_("COM_COMPONENTBUILDER_JOIN_JCBS_LEAD_DEVELOPER_ON_JOOMLA_SOCIAL_A_MASTODON_INSTANCE");
+
+?>
+<div  class="well well-small mastadon-display-block">
+	<h2>
+		<a
+			href="<?php echo $invite_url; ?>"
+			title="<?php echo $invite_title; ?>">
+				<?php echo $invite_heading; ?>
+		</a>&nbsp;&nbsp;
+		<a
+			type="button"
+			id="<?php echo $button_id; ?>"
+			href="#"
+			title="<?php echo Text::_('COM_COMPONENTBUILDER_REFRESH_FEED'); ?>">
+				<i class="icon-loop"></i>
+		</a>
+	</h2>
+	<div id="<?php echo $id; ?>"
+		data-instance="<?php echo $instance; ?>"
+		data-account-id="<?php echo $account; ?>"
+		data-post-count="<?php echo $posts; ?>">
+	</div>
+	<script>
+		new MastodonFeed("<?php echo $id; ?>", "<?php echo $button_id; ?>");
+	</script>
+</div>
--- a/admin/layouts/socialnetworking.php
+++ b/admin/layouts/socialnetworking.php
@ -0,0 +1,61 @@
+<?php
+/**
+ * @package    Joomla.Component.Builder
+ *
+ * @created    30th April, 2015
+ * @author     Llewellyn van der Merwe <https://dev.vdm.io>
+ * @git        Joomla Component Builder <https://git.vdm.dev/joomla/Component-Builder>
+ * @copyright  Copyright (C) 2015 Vast Development Method. All rights reserved.
+ * @license    GNU General Public License version 2 or later; see LICENSE.txt
+ */
+
+// No direct access to this file
+defined('JPATH_BASE') or die('Restricted access');
+
+use Joomla\CMS\Factory;
+use Joomla\CMS\Language\Text;
+use Joomla\CMS\HTML\HTMLHelper as Html;
+use Joomla\CMS\Layout\LayoutHelper;
+
+
+
+?>
+<div id="llewellyns-social-icons" class="social-icons" style="float: right;">
+	<a href="https://volunteers.joomla.org/joomlers/1396-llewellyn-van-der-merwe" class="text-decoration-none me-2" data-description="<?php echo Text::_('COM_COMPONENTBUILDER_JOIN_LLEWELLYN_ON_THE_JOOMLA_VOLUNTEER_PORTAL_SHAPING_THE_FUTURE_TOGETHER'); ?>">
+		<i class="icon-joomla"></i>
+	</a>
+	<a href="https://git.vdm.dev/octoleo" class="text-decoration-none me-2" data-description="--quiet">
+		<i class="icon-shield"></i>
+	</a>
+	<a href="https://git.vdm.dev/Llewellyn" class="text-decoration-none me-2" data-description="<?php echo Text::_('COM_COMPONENTBUILDER_COLLABORATE_AND_INNOVATE_WITH_LLEWELLYN_ON_GIT_BUILDING_A_BETTER_CODE_FUTURE'); ?>">
+		<i class="icon-tree"></i>
+	</a>
+	<a href="https://joomla.social/@llewellyn" class="text-decoration-none me-2" data-description="<?php echo Text::_('COM_COMPONENTBUILDER_CONNECT_AND_ENGAGE_WITH_LLEWELLYN_ON_JOOMLA_SOCIAL_EMPOWERING_COMMUNITIES_ONE_POST_AT_A_TIME'); ?>">
+		<i class="icon-puzzle"></i>
+	</a>
+	<a href="https://x.com/llewellynvdm" class="text-decoration-none me-2" data-description="<?php echo Text::_('COM_COMPONENTBUILDER_JOIN_THE_CONVERSATION_WITH_LLEWELLYN_ON_X_WHERE_IDEAS_TAKE_FLIGHT'); ?>">
+		<i class="icon-signup"></i>
+	</a>
+	<a href="https://github.com/Llewellynvdm" class="text-decoration-none me-2" data-description="<?php echo Text::_('COM_COMPONENTBUILDER_BUILD_INNOVATE_AND_THRIVE_WITH_LLEWELLYN_ON_GITHUB_TURNING_IDEAS_INTO_IMPACT'); ?>">
+		<i class="icon-cog"></i>
+	</a>
+	<a href="https://www.youtube.com/@OctoYou" class="text-decoration-none me-2" data-description="<?php echo Text::_('COM_COMPONENTBUILDER_EXPLORE_LEARN_AND_CREATE_WITH_LLEWELLYN_ON_YOUTUBE_YOUR_GATEWAY_TO_INSPIRATION'); ?>">
+		<i class="icon-youtube"></i>
+	</a>
+	<a href="https://hub.docker.com/u/llewellyn" class="text-decoration-none me-2" data-description="<?php echo Text::_('COM_COMPONENTBUILDER_LLEWELLYN_ON_DOCKER_CONTAINERIZE_YOUR_CREATIVITY'); ?>">
+		<i class="icon-box-add"></i>
+	</a>
+	<a href="https://opencollective.com/joomla-component-builder" class="text-decoration-none me-2" data-description="<?php echo Text::_('COM_COMPONENTBUILDER_DONATE_TOWARDS_JCB_HELP_LLEWELLYN_FINANCIALLY_SO_HE_CAN_CONTINUE_DEVELOPING_THIS_GREAT_TOOL'); ?>">
+		<i class="icon-heart"></i>
+	</a>
+	<a href="https://git.vdm.dev/Llewellyn/gpg" class="text-decoration-none" data-description="<?php echo Text::_("COM_COMPONENTBUILDER_UNLOCK_TRUST_AND_SECURITY_WITH_LLEWELLYNS_GPG_KEY_YOUR_GATEWAY_TO_VERIFIED_CONNECTIONS"); ?>">
+		<i class="icon-key"></i>
+	</a>
+</div>
+<br>
+<div id="llewellyns-social-icon-details" class="social-icon-details" style="float: right;"></div>
+<script>
+document.addEventListener("DOMContentLoaded", () => {
+  new IconWaveAnimator("llewellyns-social-icons", "llewellyns-social-icon-details");
+});
+</script>
--- a/admin/models/ajax.php
+++ b/admin/models/ajax.php
@ -165,35 +165,73 @@ class ComponentbuilderModelAjax extends ListModel
 	}

 	/**
-	* 	set the component display
-	**/
+	 * Generate the component details display in HTML.
+	 *
+	 * @param object $object The component object containing details.
+	 * @return string The HTML string for displaying component details.
+	 */
 	protected function componentDetailsDisplay($object)
 	{
-		// set some vars
-		$image = (StringHelper::check($object->image)) ? '<img alt="Joomla Component Image" src="'. Uri::root() . $object->image . '" style="float: right;">': '';
-		$desc = (StringHelper::check($object->description)) ? $object->description : $object->short_description;
-		$placeholder = ($object->add_placeholders == 1) ? '<span class="btn btn-small btn-success"> ' . Text::_('COM_COMPONENTBUILDER_YES') . ' </span>' : '<span class="btn btn-small btn-danger"> ' .Text::_('COM_COMPONENTBUILDER_NO') . ' </span>' ;
-		$debug = ($object->debug_linenr == 1) ? '<span class="btn btn-small btn-success"> ' .Text::_('COM_COMPONENTBUILDER_YES') . '</span>'  : ' <span class="btn btn-small btn-danger"> ' .Text::_('COM_COMPONENTBUILDER_NO') . ' </span>' ;
-		$html = array();
-		$html[] = '<h3>' . $object->name . ' (v' . $object->component_version . ')</h3>';
-		$html[] = '<p>' . $desc . $image . '</p>';
-		$html[] = '<ul>';
-		$html[] = '<li>' . Text::_('COM_COMPONENTBUILDER_COMPANY') . ': <b>' . $object->companyname . '</b></li>';
-		$html[] = '<li>' . Text::_('COM_COMPONENTBUILDER_AUTHOR') . ': <b>' . $object->author . '</b></li>';
-		$html[] = '<li>' . Text::_('COM_COMPONENTBUILDER_EMAIL') . ': <b>' . $object->email . '</b></li>';
-		$html[] = '<li>' . Text::_('COM_COMPONENTBUILDER_WEBSITE') . ': <b>' . $object->website . '</b></li>';
-		$html[] = '</ul>';
-		$html[] = '<h4>' . Text::_('COM_COMPONENTBUILDER_COMPONENT_GLOBAL_SETTINGS') . '</h4>';
+		// Helper variables with null coalescing to ensure robust value assignment
+		$imageSrc = !empty($object->image) ? htmlspecialchars($object->image, ENT_QUOTES) : null;
+		$image = $imageSrc 
+			? '<img alt="' . Text::_('COM_COMPONENTBUILDER_JOOMLA_COMPONENT_IMAGE') . '" src="' . Uri::root() . $imageSrc . '" style="float: right; max-width: 250px; margin-left: 15px;">'
+			: '';
+
+		$description = htmlspecialchars(!empty($object->description) ? $object->description : $object->short_description, ENT_QUOTES);
+
+		$placeholderStatus = $object->add_placeholders
+			? '<span class="badge badge-success">' . Text::_('COM_COMPONENTBUILDER_YES') . '</span>'
+			: '<span class="badge badge-danger">' . Text::_('COM_COMPONENTBUILDER_NO') . '</span>';
+
+		$debugStatus = $object->debug_linenr
+			? '<span class="badge badge-success">' . Text::_('COM_COMPONENTBUILDER_YES') . '</span>'
+			: '<span class="badge badge-danger">' . Text::_('COM_COMPONENTBUILDER_NO') . '</span>';
+
+		// Author and company details
+		$company = '<ul>';
+		$company .= '<li><strong>' . Text::_('COM_COMPONENTBUILDER_COMPANY') . ':</strong> ' . htmlspecialchars($object->companyname, ENT_QUOTES) . '</li>';
+		$company .= '<li><strong>' . Text::_('COM_COMPONENTBUILDER_AUTHOR') . ':</strong> ' . htmlspecialchars($object->author, ENT_QUOTES) . '</li>';
+		$company .= '<li><strong>' . Text::_('COM_COMPONENTBUILDER_EMAIL') . ':</strong> <a href="mailto:' . htmlspecialchars($object->email, ENT_QUOTES) . '">' . htmlspecialchars($object->email, ENT_QUOTES) . '</a></li>';
+		$company .= '<li><strong>' . Text::_('COM_COMPONENTBUILDER_WEBSITE') . ':</strong> <a href="' . htmlspecialchars($object->website, ENT_QUOTES) . '" target="_blank" rel="noopener">' . htmlspecialchars($object->website, ENT_QUOTES) . '</a></li>';
+		$company .= '</ul>';
+
+		// Build HTML output
+		$html = [];
+
+		// Header with component name and version
+		$html[] = '<div class="component-details">';
+		$html[] = '<h3>' . htmlspecialchars($object->name, ENT_QUOTES) . ' (v' . htmlspecialchars($object->component_version, ENT_QUOTES) . ')</h3>';
+
+		// Description with optional image
+		$html[] = '<div class="description" style="overflow: hidden;">';
+		$html[] = '<p>' . $image . $description . $company . '</p>';
+		$html[] = '</div>';
+
+		// Component settings
+		$html[] = '<h4>' . Text::_('COM_COMPONENTBUILDER_COMPONENT_SETTINGS') . '</h4>';
 		$html[] = '<p>';
-		$html[] = Text::_('COM_COMPONENTBUILDER_ADD_CUSTOM_CODE_PLACEHOLDERS') . '<br />' . $placeholder . '<br />';
-		$html[] = Text::_('COM_COMPONENTBUILDER_DEBUG_LINE_NUMBERS') . '<br />' . $debug ;
+		$html[] = Text::_('COM_COMPONENTBUILDER_ADD_CUSTOM_CODE_PLACEHOLDERS') . ': ' . $placeholderStatus . '<br>';
+		$html[] = Text::_('COM_COMPONENTBUILDER_DEBUG_LINE_NUMBERS') . ': ' . $debugStatus;
 		$html[] = '</p>';
+
+		// License details
 		$html[] = '<h4>' . Text::_('COM_COMPONENTBUILDER_LICENSE') . '</h4>';
-		$html[] = '<p>' . $object->license . '</p>';
+		$html[] = '<p>' . nl2br(htmlspecialchars($object->license, ENT_QUOTES)) . '</p>';
+
+		// Copyright
 		$html[] = '<h4>' . Text::_('COM_COMPONENTBUILDER_COPYRIGHT') . '</h4>';
-		$html[] = '<p>' . $object->copyright . '<br /><br />';
-		$html[] = '<a href="index.php?option=com_componentbuilder&ref=compiler&view=joomla_components&task=joomla_component.edit&id=' . (int) $object->id . '" class="btn btn-small span12"><span class="icon-edit"></span> ' . Text::_('COM_COMPONENTBUILDER_EDIT') . ' ' .$object->system_name . '</a></p>';
-		// now return the diplay
+		$html[] = '<p>' . nl2br(htmlspecialchars($object->copyright, ENT_QUOTES)) . '</p>';
+
+		// Edit button
+		$html[] = '<p>';
+		$html[] = '<a href="index.php?option=com_componentbuilder&ref=compiler&view=joomla_components&task=joomla_component.edit&id=' . (int) $object->id . '" class="btn btn-primary btn-block">';
+		$html[] = '<span class="icon-edit"></span> ' . Text::_('COM_COMPONENTBUILDER_EDIT') . ' ' . htmlspecialchars($object->system_name, ENT_QUOTES);
+		$html[] = '</a>';
+		$html[] = '</p>';
+
+		$html[] = '</div>'; // Close component-details
+
 		return implode("\n", $html);
 	}

--- a/admin/models/componentbuilder.php
+++ b/admin/models/componentbuilder.php
@ -455,97 +455,6 @@ class ComponentbuilderModelComponentbuilder extends ListModel
 	}
 	

-	public function getNoticeboard()
-	{
-		// get the document to load the scripts
-		$document = Factory::getDocument();
-		Html::_('script', "media/com_componentbuilder/js/marked.js", ['version' => 'auto']);
-		$document->addScriptDeclaration('
-		var token = "' . Session::getFormToken() . '";
-		var noticeboard = "https://vdm.bz/componentbuilder-noticeboard-md";
-		document.addEventListener("DOMContentLoaded", function() {
-			fetch(noticeboard)
-			.then(response => {
-				if (!response.ok) {
-					throw new Error("Network response was not ok");
-				}
-				return response.text();
-			})
-			.then(board => {
-				if (board.length > 5) {
-					document.getElementById("noticeboard-md").innerHTML = marked.parse(board);
-					getIS(1, board)
-					.then(result => {
-						if (result) {
-							document.querySelectorAll("#cpanel_tabTabs a").forEach(link => {
-								if (link.href.includes("#vast_development_method") || link.href.includes("#notice_board")) {
-									var textVDM = link.textContent;
-									link.innerHTML = "<span class=\"label label-important vdm-new-notice\">1</span> " + textVDM;
-									link.id = "vdm-new-notice";
-									document.getElementById("vdm-new-notice").addEventListener("click", () => {
-										getIS(2, board)
-										.then(result => {
-											if (result) {
-												document.querySelectorAll(".vdm-new-notice").forEach(element => {
-													element.style.opacity = 0;
-												});
-											}
-										});
-									});
-								}
-							});
-						}
-					});
-				} else {
-					document.getElementById("noticeboard-md").innerHTML = "'.Text::_('COM_COMPONENTBUILDER_ALL_IS_GOOD_PLEASE_CHECK_AGAIN_LATER').'.";
-				}
-			})
-			.catch(error => {
-				console.error("There was an error!", error);
-				document.getElementById("noticeboard-md").innerHTML = "'.Text::_('COM_COMPONENTBUILDER_ALL_IS_GOOD_PLEASE_CHECK_AGAIN_LATER').'.";
-			});
-		});
-
-		// to check is READ/NEW
-		function getIS(type, notice) {
-			let getUrl = "";
-			if (type === 1) {
-				getUrl = "index.php?option=com_componentbuilder&task=ajax.isNew&format=json&raw=true";
-			} else if (type === 2) {
-				getUrl = "index.php?option=com_componentbuilder&task=ajax.isRead&format=json&raw=true";
-			}
-			let request = new URLSearchParams();
-			if (token.length > 0 && notice.length) {
-				request.append(token, "1");
-				request.append("notice", notice);
-			}
-			return fetch(getUrl, {
-				method: "POST",
-				headers: {
-					"Content-Type": "application/x-www-form-urlencoded;charset=UTF-8"
-				},
-				body: request
-			}).then(response => response.json());
-		}
-		
-document.addEventListener("DOMContentLoaded", function() {
-	document.querySelectorAll(".loading-dots").forEach(function(loading_dots) {
-		let x = 0;
-		let intervalId = setInterval(function() {
-			if (!loading_dots.classList.contains("loading-dots")) {
-				clearInterval(intervalId);
-				return;
-			}
-			let dots = ".".repeat(x % 8);
-			loading_dots.textContent = dots;
-			x++;
-		}, 500);
-	});
-});');
-
-		return '<div id="noticeboard-md">'.Text::_('COM_COMPONENTBUILDER_THE_NOTICE_BOARD_IS_LOADING').'.<span class="loading-dots">.</span></small></div>';
-	}
-
 	public function getReadme()
 	{
 		$document = Factory::getDocument();
--- a/admin/sql/install.mysql.utf8.sql
+++ b/admin/sql/install.mysql.utf8.sql
--- a/admin/views/compiler/tmpl/default.php
+++ b/admin/views/compiler/tmpl/default.php
@ -170,7 +170,8 @@ document.addEventListener('DOMContentLoaded', function() {
 			<div class="span7">
 				<div id="advance-details"><?php echo $this->form->renderFieldset('advanced'); ?></div>
 				<div id="component-details"><?php echo $selectNotice; ?></div>
-				<?php echo LayoutHelper::render('jcbnoticeboardtabs', array('id' => 'noticeboard' , 'active' => $noticeboardOptions[array_rand($noticeboardOptions)])); ?>
+				<div class="clearfix"></div>
+				<?php echo LayoutHelper::render('jcbnoticeboard', null); ?>
 			</div>
 		</div>
 		<div id="get-compiler-animations" style="display:none;">
@ -193,8 +194,7 @@ document.addEventListener('DOMContentLoaded', function() {
 				<div class="clearfix"></div>
 			</div>
 			<div id="compiler-notice" class="span7" style="display:none;">
-				<?php echo LayoutHelper::render('jcbnoticeboard' . $noticeboardOptions[array_rand($noticeboardOptions)], null); ?>
-				<div><?php echo ComponentbuilderHelper::getDynamicContent('banner', '728-90'); ?></div>
+				<?php echo LayoutHelper::render('jcbnoticeboard',  ['id' => 'mastodon-feed-2', 'button_id' => 'refresh-feed-2', 'posts' => 7]); ?>
 			</div>
 		</div>
 		<input type="hidden" name="task" value="" />
--- a/admin/views/compiler/view.html.php
+++ b/admin/views/compiler/view.html.php
@ -589,6 +589,9 @@ class ComponentbuilderViewCompiler extends HtmlView
 		// Initialize the header checker.
 		$HeaderCheck = new componentbuilderHeaderCheck();

+		// Add View JavaScript File
+		Html::_('script', "administrator/components/com_componentbuilder/assets/js/compiler.js", ['version' => 'auto']);
+
 		// Load uikit options.
 		$uikit = $this->params->get('uikit_load');
 		// Set script size.
@ -684,70 +687,6 @@ class ComponentbuilderViewCompiler extends HtmlView
 						}
 					}
 				});
-			}
-			
-			document.addEventListener('DOMContentLoaded', function() {
-				fetchNoticeboard(\"https://vdm.bz/componentbuilder-noticeboard-md\", \".noticeboard-md\", true);
-				fetchNoticeboard(\"https://vdm.bz/componentbuilder-pro-noticeboard-md\", \".proboard-md\", false);
-			});
-			function fetchNoticeboard(url, selector, processGetIS) {
-				fetch(url)
-				.then(response => {
-					if (!response.ok) {
-						throw new Error('Network response was not ok');
-					}
-					return response.text();
-				})
-				.then(board => {
-					var elements = document.querySelectorAll(selector);
-					if (board.length > 5) {
-						let html_board = marked.parse(board);
-						elements.forEach(element => {
-							element.innerHTML = html_board;
-						});
-						if (processGetIS) {
-							getIS(1, board).then(result => {
-								if (result) {
-									document.querySelectorAll(\".vdm-new-notice\").forEach(element => {
-										element.style.display = 'block';
-									});
-									getIS(2, board);
-								}
-							});
-						}
-					} else {
-						elements.forEach(element => {
-							element.innerHTML = all_is_good;
-						});
-					}
-				})
-				.catch(error => {
-					console.error('There was an error!', error);
-					document.querySelectorAll(selector).forEach(element => {
-						element.innerHTML = all_is_good;
-					});
-				});
-			}
-			// to check is READ/NEW
-			function getIS(type, notice) {
-				let getUrl = \"\";
-				if (type === 1) {
-					getUrl = JRouter(\"index.php?option=com_componentbuilder&task=ajax.isNew&format=json&raw=true\");
-				} else if (type === 2) {
-					getUrl = JRouter(\"index.php?option=com_componentbuilder&task=ajax.isRead&format=json&raw=true\");
-				}
-				let request = new URLSearchParams();
-				if (token.length > 0 && notice.length) {
-					request.append(token, \"1\");
-					request.append(\"notice\", notice);
-				}
-				return fetch(getUrl, {
-					method: \"POST\",
-					headers: {
-						\"Content-Type\": \"application/x-www-form-urlencoded;charset=UTF-8\"
-					},
-					body: request
-				}).then(response => response.json());
 			}
 		");
 	}
--- a/admin/views/componentbuilder/tmpl/default_notice_board_vast_development_method.php
+++ b/admin/views/componentbuilder/tmpl/default_notice_board_vast_development_method.php
@ -15,6 +15,12 @@ defined('_JEXEC') or die('Restricted access');
 use Joomla\CMS\Language\Text;
 use Joomla\CMS\Router\Route;
 use Joomla\CMS\HTML\HTMLHelper as Html;
+use Joomla\CMS\Layout\LayoutHelper;

 ?>
-<?php echo $this->noticeboard; ?>
+<?php
+Html::_('script', "administrator/components/com_componentbuilder/assets/js/compiler.js", ['version' => 'auto']);
+Html::_('stylesheet', "administrator/components/com_componentbuilder/assets/css/compiler.css", ['version' => 'auto']);
+Html::_('script', "media/com_componentbuilder/js/marked.js", ['version' => 'auto']);
+echo LayoutHelper::render('jcbnoticeboard', null);
+?>
--- a/admin/views/componentbuilder/view.html.php
+++ b/admin/views/componentbuilder/view.html.php
@ -34,7 +34,6 @@ class ComponentbuilderViewComponentbuilder extends HtmlView
 		$this->icons          = $this->get('Icons');
 		$this->contributors   = ComponentbuilderHelper::getContributors();
 		$this->wiki = $this->get('Wiki');
-		$this->noticeboard = $this->get('Noticeboard');
 		$this->readme = $this->get('Readme');
 		$this->version = $this->get('Version');

--- a/componentbuilder.xml
+++ b/componentbuilder.xml
@ -1,15 +1,15 @@
 <?xml version="1.0" encoding="utf-8"?>
 <extension type="component" version="3.10" method="upgrade">
 	<name>COM_COMPONENTBUILDER</name>
-	<creationDate>16th December, 2024</creationDate>
+	<creationDate>28th December, 2024</creationDate>
 	<author>Llewellyn van der Merwe</author>
 	<authorEmail>joomla@vdm.io</authorEmail>
 	<authorUrl>https://dev.vdm.io</authorUrl>
 	<copyright>Copyright (C) 2015 Vast Development Method. All rights reserved.</copyright>
 	<license>GNU General Public License version 2 or later; see LICENSE.txt</license>
-	<version>3.2.5-beta2</version>
+	<version>3.2.5-beta3</version>
 	<description><![CDATA[
-		<h1>Component Builder (v.3.2.5-beta2)</h1>
+		<h1>Component Builder (v.3.2.5-beta3)</h1>
 		<div style="clear: both;"></div>
 		<p>The Component Builder for [Joomla](https://extensions.joomla.org/extension/component-builder/) is highly advanced tool that is truly able to build extremely complex components in a fraction of the time.

--- a/componentbuilder_update_server.xml
+++ b/componentbuilder_update_server.xml
@ -223,7 +223,7 @@
 		<version>3.2.5-beta</version>
 		<infourl title="Component Builder!">https://dev.vdm.io</infourl>
 		<downloads>
-			<downloadurl type="full" format="zip">https://git.vdm.dev/api/v1/repos/joomla/pkg-component-builder/archive/v3.2.5-beta2.zip</downloadurl>
+			<downloadurl type="full" format="zip">https://git.vdm.dev/api/v1/repos/joomla/pkg-component-builder/archive/v3.2.5-beta3.zip</downloadurl>
 		</downloads>
 		<tags>
 			<tag>beta</tag>
@ -238,10 +238,10 @@
 		<element>pkg_component_builder</element>
 		<type>package</type>
 		<client>site</client>
-		<version>3.2.5-beta2</version>
+		<version>3.2.5-beta3</version>
 		<infourl title="Component Builder!">https://dev.vdm.io</infourl>
 		<downloads>
-			<downloadurl type="full" format="zip">https://git.vdm.dev/api/v1/repos/joomla/pkg-component-builder/archive/v3.2.5-beta2.zip</downloadurl>
+			<downloadurl type="full" format="zip">https://git.vdm.dev/api/v1/repos/joomla/pkg-component-builder/archive/v3.2.5-beta3.zip</downloadurl>
 		</downloads>
 		<tags>
 			<tag>beta</tag>
--- a/libraries/vendor_jcb/VDM.Joomla/src/Componentbuilder/Compiler/Component/Placeholder.php
+++ b/libraries/vendor_jcb/VDM.Joomla/src/Componentbuilder/Compiler/Component/Placeholder.php
@ -124,6 +124,8 @@ final class Placeholder implements PlaceholderInterface
 		$bucket[Placefix::_('NamespacePrefix')] = $config->namespace_prefix;
 		$bucket[Placefix::_h('NAMESPACEPREFIX')] = $config->namespace_prefix;
 		$bucket[Placefix::_('NAMESPACEPREFIX')] = $config->namespace_prefix;
+		$bucket[Placefix::_('POWERLOADERPATH')] = $config->component_autoloader_path;
+		$bucket[Placefix::_h('POWERLOADERPATH')] = $config->component_autoloader_path;

 		// get the current components overrides
 		if (($_placeholders = GetHelper::var(
--- a/libraries/vendor_jcb/VDM.Joomla/src/Componentbuilder/Network/Resolve.php
+++ b/libraries/vendor_jcb/VDM.Joomla/src/Componentbuilder/Network/Resolve.php
@ -95,6 +95,7 @@ final class Resolve
 	 * @param string   &$repository   The repository name (passed by reference).
 	 *
 	 * @return void
+	 * @throws \Exception
 	 * @since  5.0.4
 	 */
 	private function resolve(string $target, string &$domain, string &$organisation, string &$repository): void
--- a/script.php
+++ b/script.php
@ -10001,7 +10001,7 @@ class Com_ComponentbuilderInstallerScript
 			echo '<div style="background-color: #fff;" class="alert alert-info"><a target="_blank" href="https://dev.vdm.io" title="Component Builder">
 				<img src="components/com_componentbuilder/assets/images/vdm-component.jpg"/>
 				</a>
-				<h3>Upgrade to Version 3.2.5-beta2 Was Successful! Let us know if anything is not working as expected.</h3></div>';
+				<h3>Upgrade to Version 3.2.5-beta3 Was Successful! Let us know if anything is not working as expected.</h3></div>';

 			// Set db if not set already.
 			if (!isset($db))