Skip to content

Commit

Permalink
Merge pull request #1036 from 10up/feature/397
Browse files Browse the repository at this point in the history
Feature/397
  • Loading branch information
jeffpaul authored Aug 20, 2024
2 parents bbf724a + 49f7f9c commit 871564a
Show file tree
Hide file tree
Showing 4 changed files with 232 additions and 22 deletions.
60 changes: 60 additions & 0 deletions assets/css/admin.css
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,66 @@
width: 20px;
}

.distributor-panel span {
display: inline-block;
margin-bottom: 15px;
}

#distributed-unlink {
margin: 0;
}

#distributed-unlink .dashicons-editor-unlink {
color: #b50909;
margin-right: 7px;
text-decoration: none;
}

.distributed-modal-popup .components-modal__icon-container svg {
width: 25px;
}

.distributed-modal-popup h1 {
margin-left: 8px;
margin-top: -3px;
}

.distributed-modal-popup span {display: inline-block;}

.distributed-modal-popup .actions {
margin-top: 20px;
}

body .distributed-modal-popup button,
body .distributed-modal-popup .button {
opacity: 1;
pointer-events: initial;
cursor: pointer;
}

.distributed-modal-popup .actions a {
margin-right: 10px;
}

.distributed-modal-popup .actions a span {
display: inline-block;
margin-top: 5px;
margin-right: 5px;
color: #b50909;
}

.distributed-modal-popup .actions a span.dashicons-admin-links {
color: #046e04;
}

.distributed-modal-popup .actions #close {
margin-top: 5px;
}

.distributed-modal-popup {
max-width: 380px;
}

.distributor-toggle {
margin-bottom: 8px;
}
Expand Down
11 changes: 11 additions & 0 deletions assets/css/gutenberg-syndicated-post.scss
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,17 @@ body.dt-linked-post {
cursor: default;
}

.distributed-modal-popup {
& * {
pointer-events: auto;
opacity: 1;
}

a, button {
cursor: pointer;
}
}

/* Allow clicks on confirmation dialog buttons */
.components-confirm-dialog button {
opacity: 1;
Expand Down
152 changes: 143 additions & 9 deletions assets/js/gutenberg-plugin.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,11 @@
import { pluginIcon } from './components/plugin-icon';

import { Icon } from '@wordpress/components';
import { Icon, Modal, Button, Flex } from '@wordpress/components';
import { select, useSelect } from '@wordpress/data';
import { PluginDocumentSettingPanel } from '@wordpress/edit-post';
import { __, _n, _x, sprintf } from '@wordpress/i18n';
import { registerPlugin } from '@wordpress/plugins';
import { useState } from '@wordpress/element';

const { document, dt, dtGutenberg, MouseEvent } = window;

Expand Down Expand Up @@ -131,14 +132,136 @@ const RenderDistributedTo = () => {
* Render the distributed from component
*/
const RenderDistributedFrom = () => {
const [ isOpen, setOpen ] = useState( false );
const openModal = () => setOpen( true );
const closeModal = () => setOpen( false );

if ( ! parseInt( dtGutenberg.unlinked ) ) {
return (
<div>
<span id="distributed-from">
{ sprintf(
/* translators: 1: Syndication date and time. */
__(
'Pulled & linked on %1$s from %2$s',
'distributor'
),
dtGutenberg.syndicationTime,
dtGutenberg.originalLocationName
) }
</span>
<span id="distributed-data">
{ __( 'Updating the ', 'distributor' ) }
<a href={ dtGutenberg.postUrl }>
{ __( 'Original Content', 'distributor' ) }
</a>
{ ', ' }
{ __(
'will update this post automatically.',
'distributor'
) }
</span>
<span id="distributed-unlink" onClick={ openModal }> {/* eslint-disable-line */}
<a href='javascript:void(0);'> {/* eslint-disable-line */}
<span className="dashicons dashicons-editor-unlink"></span>
{ __( 'Unlink from Original', 'distributor' ) }
</a>
</span>
{ isOpen && (
<Modal
title="Unlink from Original"
icon={ pluginIcon }
size={ 50 }
onRequestClose={ closeModal }
className="distributed-modal-popup"
overlayClassName="distributed-modal-overlay"
>
<p
dangerouslySetInnerHTML={ {
__html: sprintf(
/* translators: %1$s: Original Content URL Opening Tag, %2$s: Original Content URL Closing Tag */
__(
'Unlinking from the %1$sOriginal Content%2$s will stop updating this post automatically.',
'distributor'
),
'<a href="' + dtGutenberg.postUrl + '">',
'</a>'
),
} }
/>
<Flex justify="flex-start" className={ 'actions' }>
<Button
icon={ <Icon icon="editor-unlink" /> }
variant="secondary"
href={ dtGutenberg.unlinkNonceUrl }
>
{ __( 'Unlink', 'distributor' ) }
</Button>
<Button variant="link" onClick={ closeModal }>
{ __( 'Cancel', 'distributor' ) }
</Button>
</Flex>
</Modal>
) }
</div>
);
}
return (
<span id="distributed-from">
{ sprintf(
/* translators: 1: Syndication date and time. */
__( 'Distributed on: %1$s', 'distributor' ),
dtGutenberg.syndicationTime
<div>
<span id="distributed-from">
{ sprintf(
/* translators: 1: Syndication date and time. */
__( 'Pulled on %1$s from %2$s', 'distributor' ),
dtGutenberg.syndicationTime,
dtGutenberg.originalLocationName
) }
</span>
<span id="distributed-data">
{ __( 'This post has been unlinked from the ', 'distributor' ) }
<a href={ dtGutenberg.postUrl }>
{ __( 'Original Content', 'distributor' ) }
</a>
{ '.' }
</span>
<span id="distributed-restorelink" onClick={ openModal }> {/* eslint-disable-line */}
<span className="dashicons dashicons-admin-links"></span>
<a href='javascript:void(0);'> {/* eslint-disable-line */}
{ __( 'Restore link to Original', 'distributor' ) }
</a>
</span>
{ isOpen && (
<Modal
title="Restore link to Original"
icon={ pluginIcon }
size={ 50 }
onRequestClose={ closeModal }
className="distributed-modal-popup"
overlayClassName="distributed-modal-overlay"
>
<span id="distributed-data">
{ __( 'Restoring the link to the ', 'distributor' ) }
<a href={ dtGutenberg.postUrl }>
{ __( 'Original Content', 'distributor' ) }
</a>
{ __(
' will start updating this post automatically from the Original, overwriting current content.',
'distributor'
) }
</span>
<div className="actions">
<a href={ dtGutenberg.linkNonceUrl } className="button">
<span className="dashicons dashicons-admin-links"></span>
{ __( 'Restore link', 'distributor' ) }
</a>
<span id="close" onClick={ closeModal } aria-label="Cancel"> {/* eslint-disable-line */}
<a href='javascript:void(0);'> {/* eslint-disable-line */}
{ __( 'Cancel', 'distributor' ) }
</a>
</span>
</div>
</Modal>
) }
</span>
</div>
);
};

Expand All @@ -149,6 +272,17 @@ const DistributorIcon = () => (
<Icon className="components-panel__icon" icon={ pluginIcon } size={ 20 } />
);

/**
* Create the Distributor title
*/
const isUnlinkedContent = parseInt( dtGutenberg.unlinked ) !== 0;

const DistributorTitle = () => {
return isUnlinkedContent
? __( 'Unlinked Content', 'distributor' )
: __( 'Pulled Content', 'distributor' );
};

/**
* Add the Distributor panel to Gutenberg
*/
Expand Down Expand Up @@ -201,7 +335,7 @@ const DistributorPlugin = () => {
distributorTopMenu?.classList.add( 'hide' );
return (
<PluginDocumentSettingPanel
title={ __( 'Distributor', 'distributor' ) }
title={ <DistributorTitle /> }
icon={ DistributorIcon }
className="distributor-panel"
>
Expand All @@ -214,7 +348,7 @@ const DistributorPlugin = () => {
distributorTopMenu?.classList.remove( 'hide' );
return (
<PluginDocumentSettingPanel
title={ __( 'Distributor', 'distributor' ) }
title={ <DistributorTitle /> }
icon={ DistributorIcon }
className="distributor-panel"
>
Expand Down
31 changes: 18 additions & 13 deletions includes/syndicated-post-ui.php
Original file line number Diff line number Diff line change
Expand Up @@ -79,18 +79,23 @@ function output_distributor_column( $column_name, $post_id ) {
$original_blog_id = get_post_meta( $post_id, 'dt_original_blog_id', true );
$original_source_id = get_post_meta( $post_id, 'dt_original_source_id', true );
$original_deleted = (bool) get_post_meta( $post_id, 'dt_original_post_deleted', true );
$connection_map = get_post_meta( $post_id, 'dt_connection_map', true );

if ( ( empty( $original_blog_id ) && empty( $original_source_id ) ) || $original_deleted ) {
echo '';
if ( ( ( empty( $original_blog_id ) && empty( $original_source_id ) ) || $original_deleted ) && ! $connection_map ) {
echo '';
} else {
$unlinked = (bool) get_post_meta( $post_id, 'dt_unlinked', true );
$post_type_object = get_post_type_object( get_post_type( $post_id ) );
$post_url = get_post_meta( $post_id, 'dt_original_post_url', true );

if ( $unlinked ) {
echo '<a href="' . esc_url( $post_url ) . '"><img class="dt-unlinked" src="' . esc_url( plugins_url( 'assets/img/icon.svg', __DIR__ ) ) . '" alt="' . esc_attr__( 'Unlinked', 'distributor' ) . '" title="' . esc_attr__( 'Unlinked', 'distributor' ) . '"></a>';
if ( $connection_map ) {
// When a post is pushed from current site or pulled by other sites.
echo '<span title="' . esc_attr__( 'Pushed', 'distributor' ) . '" class="dashicons dashicons-admin-page"></span>';
} else {
echo '<a href="' . esc_url( $post_url ) . '"><img src="' . esc_url( plugins_url( 'assets/img/icon.svg', __DIR__ ) ) . '" alt="' . esc_attr__( 'Linked', 'distributor' ) . '" title="' . esc_attr__( 'Linked', 'distributor' ) . '"></a>';
$unlinked = (bool) get_post_meta( $post_id, 'dt_unlinked', true );
$post_url = get_post_meta( $post_id, 'dt_original_post_url', true );

if ( $unlinked ) {
echo '<a target="_blank" href="' . esc_url( $post_url ) . '"><span title="' . esc_attr__( 'Unlinked', 'distributor' ) . '" class="dashicons dashicons-editor-unlink"></span></span></a>';
} else {
echo '<a target="_blank" href="' . esc_url( $post_url ) . '"><span title="' . esc_attr__( 'Linked', 'distributor' ) . '" class="dashicons dashicons-admin-links"></span></a>';
}
}
}
}
Expand Down Expand Up @@ -373,12 +378,12 @@ function link() {

if ( ! empty( $update ) ) {
wp_update_post(
[
array(
'ID' => $post_id,
'post_title' => $update['post_title'],
'post_content' => $update['post_content'],
'post_excerpt' => $update['post_excerpt'],
]
)
);

if ( null !== $update['meta'] ) {
Expand Down Expand Up @@ -640,7 +645,7 @@ function enqueue_gutenberg_edit_scripts() {
'gutenberg-syndicated-post.min'
);

$localize_data = [
$localize_data = array(
'originalBlogId' => (int) $original_blog_id,
'originalPostId' => (int) $original_post_id,
'originalSourceId' => (int) $original_source_id,
Expand All @@ -658,7 +663,7 @@ function enqueue_gutenberg_edit_scripts() {
'supportedPostStati' => \Distributor\Utils\distributable_post_statuses(),
// Filter documented in includes/push-ui.php.
'noPermissions' => ! is_user_logged_in() || ! current_user_can( apply_filters( 'dt_syndicatable_capabilities', 'edit_posts' ) ),
];
);

$gutenberg_syndicated_post_script
->load_in_footer()
Expand Down

0 comments on commit 871564a

Please sign in to comment.