Changeset 13004 for trunk/src/bp-groups/bp-groups-blocks.php

Timestamp:

07/14/2021 06:45:11 PM (4 years ago)

Author:

imath

Message:

Merge the BP Blocks plugin's 'bp/dynamic-groups' Block

• Adds a new assets/widgets/dynamic-groups.php JavaScript template to our two template packs.
• Add a front-end script to the Groups component to manage Widget Block sort filters dynamically.
• Adapt Grunt sass tasks.
• Add the Block JavaScript source files into src/js/bp-groups/js/blocks.
• Add the Block Scss source file into src/bp-groups/sass.
• Generate the development files to ease testing.

Fixes #8523

File:

• trunk/src/bp-groups/bp-groups-blocks.php (modified) (1 diff)

trunk/src/bp-groups/bp-groups-blocks.php

@@ -311 +311 @@
     return apply_filters( 'bp_groups_render_groups_block_output', $output, $block_args, $groups );
 }
+
+/**
+ * Adds specific script data for the BP Groups blocks.
+ *
+ * Only used for the BP Dynamic Groups block.
+ *
+ * @since 9.0.0
+ */
+function bp_groups_blocks_add_script_data() {
+    $dynamic_groups_blocks = array_filter( buddypress()->groups->block_globals['bp/dynamic-groups']->items );
+
+    if ( ! $dynamic_groups_blocks ) {
+        return;
+    }
+
+    // Include the common JS template.
+    echo bp_get_dynamic_template_part( 'assets/widgets/dynamic-groups.php' );
+
+    // List the block specific props.
+    wp_add_inline_script(
+        'bp-dynamic-groups-script',
+        sprintf( 'var bpDynamicGroupsBlocks = %s;', wp_json_encode( array_values( $dynamic_groups_blocks ) ) ),
+        'before'
+    );
+}
+
+/**
+ * Callback function to render the Dynamic Groups Block.
+ *
+ * @since 9.0.0
+ *
+ * @param array $attributes The block attributes.
+ * @return string           HTML output.
+ */
+function bp_groups_render_dynamic_groups_block( $attributes = array() ) {
+    $block_args = wp_parse_args(
+        $attributes,
+        array(
+            'title'        => __( 'Groups', 'buddypress' ),
+            'maxGroups'    => 5,
+            'groupDefault' => 'active',
+            'linkTitle'    => false,
+        )
+    );
+
+    $classnames         = 'widget_bp_groups_widget buddypress widget';
+    $wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $classnames ) );
+
+    $max_groups = (int) $block_args['maxGroups'];
+    $no_groups  = __( 'There are no groups to display.', 'buddypress' );
+
+    /** This filter is documented in buddypress/src/bp-groups/classes/class-bp-groups-widget.php */
+    $separator = apply_filters( 'bp_groups_widget_separator', '|' );
+
+    // Make sure the widget ID is unique.
+    $widget_id             = uniqid( 'groups-list-' );
+    $groups_directory_link = bp_get_groups_directory_permalink();
+
+    // Set the Block's title.
+    if ( true === $block_args['linkTitle'] ) {
+        $widget_content = sprintf(
+            '<h2 class="widget-title"><a href="%1$s">%2$s</a></h2>',
+            esc_url( $groups_directory_link ),
+            esc_html( $block_args['title'] )
+        );
+    } else {
+        $widget_content = sprintf( '<h2 class="widget-title">%s</h2>', esc_html( $block_args['title'] ) );
+    }
+
+    $item_options = array(
+        'newest'       => array(
+            'class' => '',
+            'label' => __( 'Newest', 'buddypress' ),
+        ),
+        'active'       => array(
+            'class' => '',
+            'label' => __( 'Active', 'buddypress' ),
+        ),
+        'popular'      => array(
+            'class' => '',
+            'label' => __( 'Popular', 'buddypress' ),
+        ),
+        'alphabetical' => array(
+            'class' => '',
+            'label' => __( 'Alphabetical', 'buddypress' ),
+        ),
+    );
+
+    $item_options_output = array();
+    $separator_output    = sprintf( ' <span class="bp-separator" role="separator">%s</span> ', esc_html( $separator ) );
+
+    foreach ( $item_options as $item_type => $item_attr ) {
+        if ( $block_args['groupDefault'] === $item_type ) {
+            $item_attr['class'] = ' class="selected"';
+        }
+
+        $item_options_output[] = sprintf(
+            '<a href="%1$s" data-bp-sort="%2$s"%3$s>%4$s</a>',
+            esc_url( $groups_directory_link ),
+            esc_attr( $item_type ),
+            $item_attr['class'],
+            esc_html( $item_attr['label'] )
+        );
+    }
+
+    $preview      = '';
+    $default_args = array(
+        'type'            => $block_args['groupDefault'],
+        'per_page'        => $max_groups,
+        'populate_extras' => true,
+    );
+
+    // Previewing the Block inside the editor.
+    if ( defined( 'REST_REQUEST' ) && REST_REQUEST ) {
+        $bp_query = groups_get_groups( $default_args );
+        $preview  = sprintf( '<div class="widget-error">%s</div>', $no_groups );
+
+        if ( is_array( $bp_query['groups'] ) && 0 < count( $bp_query['groups'] ) ) {
+            $preview = '';
+            foreach ( $bp_query['groups'] as $group ) {
+                if ( 'newest' === $block_args['groupDefault'] ) {
+                    /* translators: %s is time elapsed since the group was created */
+                    $extra = sprintf( __( 'Created %s', 'buddypress' ), bp_get_group_date_created( $group ) );
+                } elseif ( 'popular' === $block_args['groupDefault'] ) {
+                    $count = (int) $group->total_member_count;
+
+                    /* translators: %s is the number of Group members */
+                    $extra = sprintf( _n( '%s member', '%s members', $count, 'buddypress' ), bp_core_number_format( $count ) );
+                } else {
+                    /* translators: %s: a human time diff. */
+                    $extra = sprintf( __( 'Active %s', 'buddypress' ), bp_get_group_last_active( $group ) );
+                }
+
+                $preview .= bp_get_dynamic_template_part(
+                    'assets/widgets/dynamic-groups.php',
+                    'php',
+                    array(
+                        'data.link'              => bp_get_group_permalink( $group ),
+                        'data.name'              => bp_get_group_name( $group ),
+                        'data.avatar_urls.thumb' => bp_core_fetch_avatar(
+                            array(
+                                'item_id' => $group->id,
+                                'html'    => false,
+                                'object'  => 'group',
+                            )
+                        ),
+                        'data.avatar_alt'        => esc_attr(
+                            sprintf(
+                                /* Translators: %s is the group's name. */
+                                __( 'Group Profile photo of %s', 'buddypress' ),
+                                $group->name
+                            )
+                        ),
+                        'data.id'                => $group->id,
+                        'data.extra'             => $extra,
+                    )
+                );
+            }
+        }
+    } else {
+        // Get corresponding members.
+        $path = sprintf(
+            '/%1$s/%2$s/%3$s',
+            bp_rest_namespace(),
+            bp_rest_version(),
+            buddypress()->groups->id
+        );
+
+        $default_path = add_query_arg(
+            $default_args,
+            $path
+        );
+
+        $preloaded_groups = array();
+        if ( bp_is_running_wp( '5.0.0' ) ) {
+            $preloaded_groups = rest_preload_api_request( '', $default_path );
+        }
+
+        buddypress()->groups->block_globals['bp/dynamic-groups']->items[ $widget_id ] = (object) array(
+            'selector'   => $widget_id,
+            'query_args' => $default_args,
+            'preloaded'  => reset( $preloaded_groups ),
+        );
+
+        // Only enqueue common/specific scripts and data once per page load.
+        if ( ! has_action( 'wp_footer', 'bp_groups_blocks_add_script_data', 1 ) ) {
+            wp_set_script_translations( 'bp-dynamic-groups-script', 'buddypress' );
+            wp_enqueue_script( 'bp-dynamic-groups-script' );
+            wp_localize_script(
+                'bp-dynamic-groups-script',
+                'bpDynamicGroupsSettings',
+                array(
+                    'path'  => ltrim( $path, '/' ),
+                    'root'  => esc_url_raw( get_rest_url() ),
+                    'nonce' => wp_create_nonce( 'wp_rest' ),
+                )
+            );
+
+            add_action( 'wp_footer', 'bp_groups_blocks_add_script_data', 1 );
+        }
+    }
+
+    $widget_content .= sprintf(
+        '<div class="item-options">
+            %1$s
+        </div>
+        <ul id="%2$s" class="item-list" aria-live="polite" aria-relevant="all" aria-atomic="true">
+            %3$s
+        </ul>',
+        implode( $separator_output, $item_options_output ),
+        esc_attr( $widget_id ),
+        $preview
+    );
+
+    // Adds a container to make sure the block is styled even when used into the Columns parent block.
+    $widget_content = sprintf( '<div class="bp-dynamic-block-container">%s</div>', "\n" . $widget_content . "\n" );
+
+    // Only add a block wrapper if not loaded into a Widgets sidebar.
+    if ( ! did_action( 'dynamic_sidebar_before' ) ) {
+        return sprintf(
+            '<div %1$s>%2$s</div>',
+            $wrapper_attributes,
+            $widget_content
+        );
+    }
+
+    return $widget_content;
+}