mirror of
https://github.com/WordPress/five-for-the-future.git
synced 2025-04-16 16:43:42 +03:00
Pledge Management: Add "request link" form to the manage pledge (#126)
When a pledge is selected but the auth token is missing/incorrect, show the email form. Like on the pledge page, submitting the correct email will trigger a new auth token + link to be emailed to the pledge manager. This makes for a clearer path for re-requesting a valid link. Fixes #114
This commit is contained in:
parent
a5d4228c6d
commit
a91c2733d2
|
@ -1,14 +1,12 @@
|
|||
/* global FFTF_Dialog, jQuery */
|
||||
jQuery( document ).ready( function( $ ) {
|
||||
const button = document.getElementById( 'toggle-management-link-form' );
|
||||
const template = wp.template( '5ftf-send-link-dialog' );
|
||||
const template = document.getElementById( 'tmpl-5ftf-send-link-dialog' ) && wp.template( '5ftf-send-link-dialog' );
|
||||
|
||||
if ( ! template && ! button ) {
|
||||
// No modal on this page.
|
||||
return;
|
||||
if ( !! template ) {
|
||||
$( document.body ).prepend( template() );
|
||||
}
|
||||
|
||||
$( document.body ).prepend( template() );
|
||||
const modal = document.getElementById( 'send-link-dialog' );
|
||||
const modalBg = document.getElementById( 'send-link-dialog-bg' );
|
||||
const children = document.querySelectorAll( 'body > *:not([role="dialog"])' );
|
||||
|
@ -81,14 +79,15 @@ jQuery( document ).ready( function( $ ) {
|
|||
function sendRequest( event ) {
|
||||
event.preventDefault();
|
||||
const email = $( event.target.querySelector( 'input[type="email"]' ) ).val();
|
||||
const pledgeId = $( event.target.querySelector( 'input[name="pledge_id"]' ) ).val();
|
||||
$( event.target.querySelector( '.message' ) ).html( '' );
|
||||
$.ajax( {
|
||||
type: 'POST',
|
||||
url: FFTF_Dialog.ajaxurl,
|
||||
data: {
|
||||
action: 'send-manage-email',
|
||||
pledge_id: FFTF_Dialog.pledgeId,
|
||||
email,
|
||||
pledge_id: pledgeId,
|
||||
email: email,
|
||||
_ajax_nonce: FFTF_Dialog.ajaxNonce,
|
||||
},
|
||||
success( response ) {
|
||||
|
@ -96,10 +95,11 @@ jQuery( document ).ready( function( $ ) {
|
|||
// Say the message for screen reader users.
|
||||
wp.a11y.speak( response.message );
|
||||
|
||||
if ( response.success ) {
|
||||
if ( response.success && !! button ) {
|
||||
closeModal();
|
||||
$( button ).after( $( '<p>' ).html( '<em>' + response.message + '<em>' ) );
|
||||
} else {
|
||||
$( 'div.notice' ).remove();
|
||||
const $message = $( '<div>' )
|
||||
.addClass( 'notice notice-alt' )
|
||||
.addClass( response.success ? 'notice-success' : 'notice-error' )
|
||||
|
@ -124,13 +124,16 @@ jQuery( document ).ready( function( $ ) {
|
|||
}
|
||||
} );
|
||||
|
||||
$( modalBg ).on( 'click', closeModal );
|
||||
$( modal ).on( 'click', '.pledge-dialog__close', closeModal );
|
||||
$( document ).on( 'keydown', function( event ) {
|
||||
if ( 27 === event.which ) { // Esc
|
||||
closeModal( event );
|
||||
}
|
||||
} );
|
||||
// Make sure `modal` exists before using it.
|
||||
if ( !! modal ) {
|
||||
$( modalBg ).on( 'click', closeModal );
|
||||
$( modal ).on( 'click', '.pledge-dialog__close', closeModal );
|
||||
$( document ).on( 'keydown', function( event ) {
|
||||
if ( 27 === event.which ) { // Esc
|
||||
closeModal( event );
|
||||
}
|
||||
} );
|
||||
|
||||
$( modal.querySelector( 'form' ) ).submit( sendRequest );
|
||||
$( modal.querySelector( 'form' ) ).submit( sendRequest );
|
||||
}
|
||||
} );
|
||||
|
|
|
@ -178,10 +178,7 @@ function can_manage_pledge( $requested_pledge_id, $auth_token = '' ) {
|
|||
|
||||
return new WP_Error(
|
||||
'invalid_token',
|
||||
sprintf(
|
||||
__( 'Your link has expired, please <a href="%s">obtain a new one.</a>', 'wporg-5ftf' ),
|
||||
get_permalink( $requested_pledge_id )
|
||||
)
|
||||
__( 'Your link has expired.', 'wporg-5ftf' )
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
@ -34,7 +34,6 @@ function render_form_new() {
|
|||
$pledge = null;
|
||||
$complete = false;
|
||||
$directory_url = home_url( 'pledges' );
|
||||
$view = 'form-pledge-new.php';
|
||||
|
||||
if ( 'Submit Pledge' === $action ) {
|
||||
$pledge_id = process_form_new();
|
||||
|
@ -48,7 +47,7 @@ function render_form_new() {
|
|||
|
||||
ob_start();
|
||||
$readonly = false;
|
||||
require FiveForTheFuture\get_views_path() . $view;
|
||||
require FiveForTheFuture\get_views_path() . 'form-pledge-new.php';
|
||||
|
||||
return ob_get_clean();
|
||||
}
|
||||
|
@ -123,8 +122,8 @@ function render_form_manage() {
|
|||
$can_view_form = Auth\can_manage_pledge( $pledge_id, $auth_token );
|
||||
|
||||
if ( is_wp_error( $can_view_form ) ) {
|
||||
$errors = array( $can_view_form->get_error_message() );
|
||||
} else if ( ! in_array( get_post_status( $pledge_id ), array( 'pending', 'publish' ), true ) ) {
|
||||
$errors = array( strip_tags( $can_view_form->get_error_message() ) );
|
||||
} else if ( ! Pledge\is_active_pledge( $pledge_id ) ) {
|
||||
$errors = array(
|
||||
sprintf(
|
||||
__( 'This pledge has been removed from Five for the Future. If this was a mistake, please <a href="%s">contact us</a> to reactivate your pledge.', 'wporg-5ftf' ),
|
||||
|
@ -133,9 +132,15 @@ function render_form_manage() {
|
|||
);
|
||||
}
|
||||
|
||||
if ( Pledge\is_active_pledge( $pledge_id ) && is_wp_error( $can_view_form ) ) {
|
||||
ob_start();
|
||||
require FiveForTheFuture\get_views_path() . 'partial-request-manage-link.php';
|
||||
return ob_get_clean();
|
||||
}
|
||||
|
||||
if ( count( $errors ) > 0 ) {
|
||||
ob_start();
|
||||
require FiveForTheFuture\PATH . 'views/partial-result-messages.php';
|
||||
require FiveForTheFuture\get_views_path() . 'partial-result-messages.php';
|
||||
return ob_get_clean();
|
||||
}
|
||||
|
||||
|
@ -154,7 +159,7 @@ function render_form_manage() {
|
|||
}
|
||||
|
||||
ob_start();
|
||||
require FiveForTheFuture\PATH . 'views/partial-result-messages.php';
|
||||
require FiveForTheFuture\get_views_path() . 'partial-result-messages.php';
|
||||
return ob_get_clean();
|
||||
} else if ( 'Update Pledge' === $action ) {
|
||||
$results = process_form_manage( $pledge_id, $auth_token );
|
||||
|
@ -177,7 +182,7 @@ function render_form_manage() {
|
|||
ob_start();
|
||||
$readonly = false;
|
||||
$is_manage = true;
|
||||
require FiveForTheFuture\PATH . 'views/form-pledge-manage.php';
|
||||
require FiveForTheFuture\get_views_path() . 'form-pledge-manage.php';
|
||||
|
||||
return ob_get_clean();
|
||||
}
|
||||
|
|
|
@ -327,6 +327,17 @@ function populate_list_table_columns( $column, $post_id ) {
|
|||
break;
|
||||
}
|
||||
}
|
||||
/**
|
||||
* Check if a post is an active pledge (pending or published).
|
||||
*
|
||||
* @param int $post_id The ID of a post to check.
|
||||
*
|
||||
* @return bool
|
||||
*/
|
||||
function is_active_pledge( $post_id ) {
|
||||
return CPT_ID === get_post_type( $post_id ) &&
|
||||
in_array( get_post_status( $post_id ), array( 'pending', 'publish' ), true );
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a new pledge post.
|
||||
|
@ -486,7 +497,7 @@ function has_existing_pledge( $key, $key_type, int $current_pledge_id = 0 ) {
|
|||
function enqueue_assets() {
|
||||
wp_register_script( 'wicg-inert', plugins_url( 'assets/js/inert.min.js', __DIR__ ), array(), '3.0.0', true );
|
||||
|
||||
if ( CPT_ID === get_post_type() ) {
|
||||
if ( CPT_ID === get_post_type() || is_page( 'manage-pledge' ) ) {
|
||||
wp_enqueue_script(
|
||||
'5ftf-dialog',
|
||||
plugins_url( 'assets/js/dialog.js', __DIR__ ),
|
||||
|
@ -496,9 +507,8 @@ function enqueue_assets() {
|
|||
);
|
||||
|
||||
$script_data = array(
|
||||
'ajaxurl' => admin_url( 'admin-ajax.php', 'relative' ), // The global ajaxurl is not set on the frontend.
|
||||
'pledgeId' => get_the_ID(),
|
||||
'ajaxNonce' => wp_create_nonce( 'send-manage-email' ),
|
||||
'ajaxurl' => admin_url( 'admin-ajax.php', 'relative' ), // The global ajaxurl is not set on the frontend.
|
||||
'ajaxNonce' => wp_create_nonce( 'send-manage-email' ),
|
||||
);
|
||||
wp_add_inline_script(
|
||||
'5ftf-dialog',
|
||||
|
|
34
plugins/wporg-5ftf/views/form-request-manage-link.php
Normal file
34
plugins/wporg-5ftf/views/form-request-manage-link.php
Normal file
|
@ -0,0 +1,34 @@
|
|||
<?php
|
||||
|
||||
namespace WordPressDotOrg\FiveForTheFuture\View;
|
||||
use WordPressDotOrg\FiveForTheFuture\Pledge;
|
||||
|
||||
defined( 'WPINC' ) || die();
|
||||
|
||||
$pledge_id = ( Pledge\CPT_ID === get_post_type() ) ? get_post()->ID : absint( $_REQUEST['pledge_id'] ?? 0 );
|
||||
?>
|
||||
|
||||
<form method="post" class="pledge-email-form">
|
||||
<input type="hidden" name="pledge_id" value="<?php echo esc_attr( $pledge_id ); ?>" />
|
||||
|
||||
<label for="pledge_admin_address">
|
||||
<?php esc_html_e( 'Email Address', 'wporg-5ftf' ); ?>
|
||||
</label>
|
||||
|
||||
<input
|
||||
id="pledge_admin_address"
|
||||
name="pledge_admin_address"
|
||||
type="email"
|
||||
required
|
||||
value=""
|
||||
/>
|
||||
|
||||
<div class="message"></div>
|
||||
|
||||
<input
|
||||
type="submit"
|
||||
class="button"
|
||||
name="get_manage_pledge_link"
|
||||
value="<?php esc_attr_e( 'Submit', 'wporg-5ftf' ); ?>"
|
||||
/>
|
||||
</form>
|
|
@ -1,6 +1,7 @@
|
|||
<?php
|
||||
|
||||
namespace WordPressDotOrg\FiveForTheFuture\View;
|
||||
use function WordPressDotOrg\FiveForTheFuture\get_views_path;
|
||||
|
||||
defined( 'WPINC' ) || die();
|
||||
|
||||
|
@ -16,30 +17,7 @@ defined( 'WPINC' ) || die();
|
|||
<?php esc_html_e( "If you're the admin, enter your email address and a confirmation link will be sent to you.", 'wporg-5ftf' ); ?>
|
||||
</p>
|
||||
|
||||
<form method="post">
|
||||
<input type="hidden" name="pledge_id" value="<?php echo esc_attr( get_post()->ID ); ?>" />
|
||||
|
||||
<label for="pledge_admin_address">
|
||||
<?php esc_html_e( 'Email Address', 'wporg-5ftf' ); ?>
|
||||
</label>
|
||||
|
||||
<input
|
||||
id="pledge_admin_address"
|
||||
name="pledge_admin_address"
|
||||
type="email"
|
||||
required
|
||||
value=""
|
||||
/>
|
||||
|
||||
<div class="message"></div>
|
||||
|
||||
<input
|
||||
type="submit"
|
||||
class="button"
|
||||
name="get_manage_pledge_link"
|
||||
value="<?php esc_attr_e( 'Submit', 'wporg-5ftf' ); ?>"
|
||||
/>
|
||||
</form>
|
||||
<?php require get_views_path() . 'form-request-manage-link.php'; ?>
|
||||
<button type="button" class="button button-link pledge-dialog__close" aria-label="Close"><span class="dashicons dashicons-no-alt" aria-hidden="true"></span></button></div>
|
||||
</div>
|
||||
</script>
|
||||
|
|
24
plugins/wporg-5ftf/views/partial-request-manage-link.php
Normal file
24
plugins/wporg-5ftf/views/partial-request-manage-link.php
Normal file
|
@ -0,0 +1,24 @@
|
|||
<?php
|
||||
|
||||
namespace WordPressDotOrg\FiveForTheFuture\View;
|
||||
use const WordPressDotOrg\FiveForTheFuture\Pledge\CPT_ID;
|
||||
use function WordPressDotOrg\FiveForTheFuture\get_views_path;
|
||||
|
||||
defined( 'WPINC' ) || die();
|
||||
|
||||
$pledge_id = ( CPT_ID === get_post_type() ) ? get_post()->ID : absint( $_REQUEST['pledge_id'] ?? 0 );
|
||||
$pledge_name = get_the_title( $pledge_id );
|
||||
?>
|
||||
|
||||
<div id="send-link-dialog">
|
||||
<?php require get_views_path() . 'partial-result-messages.php'; ?>
|
||||
|
||||
<p>
|
||||
<?php echo esc_html( sprintf(
|
||||
__( "If you're an admin for %s, you can request a new edit link using this form. Enter your email address and we'll send you a new link.", 'wporg-5ftf' ),
|
||||
$pledge_name
|
||||
) ); ?>
|
||||
</p>
|
||||
|
||||
<?php require get_views_path() . 'form-request-manage-link.php'; ?>
|
||||
</div>
|
|
@ -29,27 +29,6 @@
|
|||
border-bottom-color: $color-gray-light-400;
|
||||
}
|
||||
|
||||
label {
|
||||
display: inline-block;
|
||||
margin-bottom: 4px;
|
||||
font-size: ms(-4);
|
||||
font-weight: bold;
|
||||
color: $color-gray-500;
|
||||
}
|
||||
|
||||
input[type="email"] {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin: 0 0 20px 0;
|
||||
padding: ms(-7) ms(-2);
|
||||
border: 1px solid $color-gray-100;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
font-size: ms(-3);
|
||||
}
|
||||
|
||||
.notice p {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
@ -75,3 +54,26 @@
|
|||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.pledge-email-form {
|
||||
label {
|
||||
display: inline-block;
|
||||
margin-bottom: 4px;
|
||||
font-size: ms(-4);
|
||||
font-weight: bold;
|
||||
color: $color-gray-500;
|
||||
}
|
||||
|
||||
input[type="email"] {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin: 0 0 20px 0;
|
||||
padding: ms(-7) ms(-2);
|
||||
border: 1px solid $color-gray-100;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
font-size: ms(-3);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue