Convert hashtags in activity content to clickable spans

// Convert hashtags in activity content to clickable spans
function convert_hashtags_to_spans($content) {
    // Remove existing <a> tags around hashtags
    $content = preg_replace('/<a[^>]*>(#\w+)<\/a>/', '$1', $content);

    // Convert hashtags to clickable spans
    $content = preg_replace('/#(\w+)/', '<span class="activity-hashtag" data-hashtag="$1">#$1</span>', $content);

    return $content;
}
add_filter('bp_get_activity_content_body', 'convert_hashtags_to_spans');

// JavaScript for Auto-Submitting the BuddyPress Search Form or Redirecting
add_action('wp_footer', function() {
    ?>
    <style>
        .activity-hashtag, .hashtag-widget {
            cursor: pointer;
            color: #0073aa;
            text-decoration: underline;
        }

        .activity-hashtag:hover, .hashtag-widget:hover {
            color: #005177;
            text-decoration: none;
        }

        .bpht-hashtags-wrapper.bpht-hashtags-wrapper-cloud > div span {
    display: inline-block;
    padding: 5px 15px;
    line-height: normal;
    text-decoration: none;
}
    </style>

    <script>
        document.addEventListener('DOMContentLoaded', function () {
            // Function to convert widget hashtag links to spans
            function convertWidgetHashtags() {
                const hashtagLinks = document.querySelectorAll('.bpht-widget--hashtags a.hashtag');
                hashtagLinks.forEach(link => {
                    const hashtag = link.textContent.trim();
                    const dataHashtag = link.id || hashtag.replace('#', '');

                    const span = document.createElement('span');
                    span.className = 'hashtag-widget';
                    span.dataset.hashtag = dataHashtag;
                    span.textContent = hashtag;

                    link.replaceWith(span);
                });
            }

            convertWidgetHashtags(); // Convert on page load

            // Function to fill the form and submit it
            function fillAndSubmitSearchForm(searchQuery) {
                const searchInput = document.getElementById('dir-activity-search');
                const searchForm = document.getElementById('dir-activity-search-form');

                if (searchInput && searchForm) {
                    // Set the search value directly
                    searchInput.value = searchQuery;

                    // Trigger input and change events to ensure BuddyPress detects changes
                    searchInput.dispatchEvent(new Event('input', { bubbles: true }));
                    searchInput.dispatchEvent(new Event('change', { bubbles: true }));

                    // Submit the form
                    searchForm.dispatchEvent(new Event('submit', { bubbles: true }));
                } else {
                    // Redirect to the Activity page with the hashtag as an anchor
                    const activityPageUrl = '/activity#' + searchQuery.replace('#', '');
                    window.location.href = activityPageUrl;
                }
            }

            // Check if there's a hashtag in the URL fragment on the Activity page
            const hashTagFromURL = window.location.hash.substring(1); // Remove the '#' symbol
            if (hashTagFromURL && document.getElementById('dir-activity-search-form')) {
                fillAndSubmitSearchForm(`#${hashTagFromURL}`);
            }

            // Event delegation for hashtag clicks in both activity content and widgets
            document.body.addEventListener('click', function (event) {
                const target = event.target.closest('.activity-hashtag, .hashtag-widget');

                if (target) {
                    event.preventDefault();  // Prevent default link behavior
                    const searchQuery = target.dataset.hashtag;

                    if (searchQuery) {
                        fillAndSubmitSearchForm(`#${searchQuery}`);
                    }
                }
            });
        });
    </script>
    <?php
});