Skip to content

Commit

Permalink
Pagination use disabled links
Browse files Browse the repository at this point in the history 
Previously pagination not showing links altogether instead use
disabled state when links are not required for a given page.

Example: On last pagination page the last page link is disabled instead
of being visible.
  • Loading branch information
@PatelUtkarsh
PatelUtkarsh committed Feb 4, 2022
1 parent fbe3c43 commit 6a234ce
Show file tree
Hide file tree
Showing 4 changed files with 112 additions and 134 deletions.
58 changes: 26 additions & 32 deletions theme/template-parts/blocks/query-pagination-first.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,47 +30,41 @@
$label = isset( $attributes['label'] ) && ! empty( $attributes['label'] ) ? $attributes['label'] : $default_label;
$content = '';
$url = '';
$wrapper_attributes = str_replace( 'class="', 'class="mdc-ripple-surface ', $wrapper_attributes );

// Check if the pagination is for Query that inherits the global context
// and handle appropriately.
if ( isset( $block->context['query']['inherit'] ) && $block->context['query']['inherit'] ) {
$url = get_pagenum_link( 1 );
} elseif ( 1 !== $page_number ) {
global $wp_query;
$url = get_pagenum_link( 1 );
$query_page_number = (int) get_query_var( 'paged' );
$page_number = $query_page_number > 0 ? $query_page_number : $page_number;
} else {
$url = add_query_arg( $page_key, 1 );
}
$is_disabled = 1 === $page_number;

if ( ! empty( $url ) ) :
ob_start();
$screen_reader = sprintf(
/* translators: available page description. */
esc_html__( '%s page', 'material-design-google' ),
esc_html( $label )
);
$inner_content = sprintf(
'<span class="material-icons" aria-hidden="true">first_page</span>
<span class="screen-reader-text">%s</span>',
$screen_reader
);
$inner_content_with_anchor = $is_disabled ? $inner_content : sprintf(
'<a href="%s" class="mdc-ripple-surface">%s</a>',
esc_url( $url ),
$inner_content
);
$content = sprintf(
'<li %s>%s</li>',
$wrapper_attributes,
$inner_content_with_anchor
);
?>
<li>
<a
href="<?php echo esc_url( $url ); ?>"
<?php
/**
* Esc_attr breaks the markup.
* Turns the closing " into &quote;
*/
?>
<?php echo $wrapper_attributes; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
>
<span class="material-icons" aria-hidden="true">
first_page
</span>
<span class="screen-reader-text">
<?php
printf(
/* translators: available page description. */
esc_html__( '%s page', 'material-design-google' ),
esc_html( $label )
);
?>
</span>
</a>
</li>
<?php

$content = ob_get_clean();

echo wp_kses_post( $content );
endif;
63 changes: 27 additions & 36 deletions theme/template-parts/blocks/query-pagination-last.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,58 +31,49 @@
$label = isset( $attributes['label'] ) && ! empty( $attributes['label'] ) ? $attributes['label'] : $default_label;
$content = '';
$url = '';

$is_disabled = false;
// Check if the pagination is for Query that inherits the global context.
if ( isset( $block->context['query']['inherit'] ) && $block->context['query']['inherit'] ) {

// Take into account if we have set a bigger `max page`
// than what the query has.
global $wp_query;
$url = get_pagenum_link( $wp_query->max_num_pages );
$max_page = $wp_query->max_num_pages;
$url = get_pagenum_link( $max_page );
$current_page_num = get_query_var( 'paged' );
$is_disabled = (int) $current_page_num === (int) $max_page;

} elseif ( ! $max_page || $max_page > $page_number ) {
$custom_query = new WP_Query( build_query_vars_from_query_block( $block, $page_number ) );
$custom_query_max_pages = (int) $custom_query->max_num_pages;
$wrapper_attributes = str_replace( 'class="', 'class="mdc-ripple-surface ', $wrapper_attributes );

if ( $custom_query_max_pages && $custom_query_max_pages !== $page_number ) :
$url = add_query_arg( $page_key, $custom_query_max_pages );
endif;
$is_disabled = $custom_query_max_pages === $page_number;
$url = add_query_arg( $page_key, $custom_query_max_pages );

wp_reset_postdata(); // Restore original Post Data.
}

if ( ! empty( $url ) ) :
ob_start();
$screen_reader = sprintf(
/* translators: available page description. */
esc_html__( '%s page', 'material-design-google' ),
esc_html( $label )
);
$inner_content = sprintf(
'<span class="material-icons" aria-hidden="true">last_page</span>
<span class="screen-reader-text">%s</span>',
$screen_reader
);
$inner_content_with_anchor = $is_disabled ? $inner_content : sprintf(
'<a href="%s" class="mdc-ripple-surface">%s</a>',
esc_url( $url ),
$inner_content
);
$content = sprintf(
'<li %s>%s</li>',
$wrapper_attributes,
$inner_content_with_anchor
);
?>
<li>
<a
href="<?php echo esc_url( $url ); ?>"
<?php
/**
* Esc_attr breaks the markup.
* Turns the closing " into &quote;
*/
?>
<?php echo $wrapper_attributes; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
>
<span class="material-icons" aria-hidden="true">
last_page
</span>
<span class="screen-reader-text">
<?php
printf(
/* translators: available page description. */
esc_html__( '%s page', 'material-design-google' ),
esc_html( $label )
);
?>
</span>
</a>
</li>
<?php

$content = ob_get_clean();

echo wp_kses_post( $content );
endif;
67 changes: 31 additions & 36 deletions theme/template-parts/blocks/query-pagination-next.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
$url = '';
$content = '';
$wrapper_attributes = get_block_wrapper_attributes();
$wrapper_attributes = str_replace( 'class="', 'class="mdc-ripple-surface ', $wrapper_attributes );
$is_disabled = false;

// Check if the pagination is for Query that inherits the global context.
if ( isset( $block->context['query']['inherit'] ) && $block->context['query']['inherit'] ) {
Expand All @@ -42,49 +42,44 @@
if ( $max_page > $wp_query->max_num_pages ) {
$max_page = $wp_query->max_num_pages;
}

$url = next_posts( $max_page, false );
$max_page = $wp_query->max_num_pages;
$url = get_pagenum_link( $max_page );
$current_page_num = get_query_var( 'paged' );
$is_disabled = (int) $current_page_num === (int) $max_page;
$url = next_posts( $max_page, false );
// Force in loop to show disabled state, as next_posts returns empty when on last page.
$url = $url ? $url : '#';
} elseif ( ! $max_page || $max_page > $page_number ) {
$custom_query = new WP_Query( build_query_vars_from_query_block( $block, $page_number ) );
$custom_query_max_pages = (int) $custom_query->max_num_pages;

if ( $custom_query_max_pages && $custom_query_max_pages !== $page_number ) :
$url = add_query_arg( $page_key, $page_number + 1 );
endif;
$is_disabled = $custom_query_max_pages === $page_number;
// In case of disabled - url won't be used.
$url = add_query_arg( $page_key, $page_number + 1 );
wp_reset_postdata(); // Restore original Post Data.
}

if ( ! empty( $url ) ) :
ob_start();
$screen_reader = sprintf(
/* translators: available page description. */
esc_html__( '%s page', 'material-design-google' ),
esc_html( $label )
);
$inner_content = sprintf(
'<span class="material-icons" aria-hidden="true">chevron_right</span>
<span class="screen-reader-text">%s</span>',
$screen_reader
);
$inner_content_with_anchor = $is_disabled ? $inner_content : sprintf(
'<a href="%s" class="mdc-ripple-surface">%s</a>',
esc_url( $url ),
$inner_content
);
$content = sprintf(
'<li %s>%s</li>',
$wrapper_attributes,
$inner_content_with_anchor
);
?>
<li>
<a
href="<?php echo esc_url( $url ); ?>"
<?php
/**
* Esc_attr breaks the markup.
* Turns the closing " into &quote;
*/
?>
<?php echo $wrapper_attributes; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
>
<span class="material-icons" aria-hidden="true">
chevron_right
</span>
<span class="screen-reader-text">
<?php
printf(
/* translators: available page description. */
esc_html__( '%s page', 'material-design-google' ),
esc_html( $label )
);
?>
</span>
</a>
</li>
<?php

$content = ob_get_clean();

echo wp_kses_post( $content );
endif;
58 changes: 28 additions & 30 deletions theme/template-parts/blocks/query-pagination-previous.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,46 +30,44 @@
$content = '';
$url = '';
$wrapper_attributes = get_block_wrapper_attributes();
$wrapper_attributes = str_replace( 'class="', 'class="mdc-ripple-surface ', $wrapper_attributes );

// Check if the pagination is for Query that inherits the global context
// and handle appropriately.
if ( isset( $block->context['query']['inherit'] ) && $block->context['query']['inherit'] ) {
global $wp_query;
$url = previous_posts( false );
} elseif ( 1 !== $page_number ) {
// Force in loop to show disabled state, as previous_posts returns empty when on first page.
$url = $url ? $url : '#';
$query_page_number = (int) get_query_var( 'paged' );
$page_number = $query_page_number > 0 ? $query_page_number : $page_number;
} else {
$url = add_query_arg( $page_key, $page_number - 1 );
}

$is_disabled = 1 === $page_number;

if ( ! empty( $url ) ) :
ob_start();
$screen_reader = sprintf(
/* translators: available page description. */
esc_html__( '%s page', 'material-design-google' ),
esc_html( $label )
);
$inner_content = sprintf(
'<span class="material-icons" aria-hidden="true">chevron_left</span>
<span class="screen-reader-text">%s</span>',
$screen_reader
);
$inner_content_with_anchor = $is_disabled ? $inner_content : sprintf(
'<a href="%s" class="mdc-ripple-surface">%s</a>',
esc_url( $url ),
$inner_content
);
$content = sprintf(
'<li %s>%s</li>',
$wrapper_attributes,
$inner_content_with_anchor
);
?>
<li>
<a
href="<?php echo esc_url( $url ); ?>"
<?php
/**
* Esc_attr breaks the markup.
* Turns the closing " into &quote;
*/
?>
<?php echo $wrapper_attributes; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?>
>
<span class="material-icons" aria-hidden="true">
chevron_left
</span>
<span class="screen-reader-text">
<?php
printf(
/* translators: available page description. */
esc_html__( '%s page', 'material-design-google' ),
esc_html( $label )
);
?>
</span>
</a>
</li>
<?php
$content = ob_get_clean();

echo wp_kses_post( $content );
endif;

0 comments on commit 6a234ce

Please sign in to comment.