fix missing @ in Follow-Me block (#898)

build/follow-me/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-core-data', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'f33252a2026002ddb56c');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-core-data', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '1ec66c1edf3d9b0b6678');

build/follow-me/view.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-compose', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'ab8c0dad126bb0a61ed6');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-compose', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'bc272e3d4aaa7992f4c7');

build/remote-reply/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-compose', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'ab787305c7ed07812b96');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-compose', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '45f08e094782c24c4c34');

build/reply/index.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '9eb1d863fcf6d209ef29');
+<?php return array('dependencies' => array('react', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '808c98599517db815fc5');

build/reply/index.js

@@ -1 +1 @@
-(()=>{"use strict";var e={20:(e,t,r)=>{var o=r(609),n=Symbol.for("react.element"),i=(Symbol.for("react.fragment"),Object.prototype.hasOwnProperty),a=o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,s={key:!0,ref:!0,__self:!0,__source:!0};t.jsx=function(e,t,r){var o,l={},p=null,c=null;for(o in void 0!==r&&(p=""+r),void 0!==t.key&&(p=""+t.key),void 0!==t.ref&&(c=t.ref),t)i.call(t,o)&&!s.hasOwnProperty(o)&&(l[o]=t[o]);if(e&&e.defaultProps)for(o in t=e.defaultProps)void 0===l[o]&&(l[o]=t[o]);return{$$typeof:n,type:e,key:p,ref:c,props:l,_owner:a.current}}},848:(e,t,r)=>{e.exports=r(20)},609:e=>{e.exports=window.React}},t={};function r(o){var n=t[o];if(void 0!==n)return n.exports;var i=t[o]={exports:{}};return e[o](i,i.exports,r),i.exports}(()=>{const e=window.wp.blocks,t=window.wp.primitives;var o=r(848);const n=(0,o.jsx)(t.SVG,{width:"24",height:"24",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:(0,o.jsx)(t.Path,{d:"M6.68822 10.625L6.24878 11.0649L5.5 11.8145L5.5 5.5L12.5 5.5V8L14 6.5V5C14 4.44772 13.5523 4 13 4H5C4.44772 4 4 4.44771 4 5V13.5247C4 13.8173 4.16123 14.086 4.41935 14.2237C4.72711 14.3878 5.10601 14.3313 5.35252 14.0845L7.31 12.125H8.375L9.875 10.625H7.31H6.68822ZM14.5605 10.4983L11.6701 13.75H16.9975C17.9963 13.75 18.7796 14.1104 19.3553 14.7048C19.9095 15.2771 20.2299 16.0224 20.4224 16.7443C20.7645 18.0276 20.7543 19.4618 20.7487 20.2544C20.7481 20.345 20.7475 20.4272 20.7475 20.4999L19.2475 20.5001C19.2475 20.4191 19.248 20.3319 19.2484 20.2394V20.2394C19.2526 19.4274 19.259 18.2035 18.973 17.1307C18.8156 16.5401 18.586 16.0666 18.2778 15.7483C17.9909 15.4521 17.5991 15.25 16.9975 15.25H11.8106L14.5303 17.9697L13.4696 19.0303L8.96956 14.5303L13.4394 9.50171L14.5605 10.4983Z"})});var i=r(609);const a=window.wp.i18n,s=window.wp.blockEditor,l=window.wp.components,p=window.wp.element,c=window.wp.data;(0,e.registerBlockType)("activitypub/reply",{edit:function({attributes:e,setAttributes:t,clientId:r,isSelected:o}){const[n,w]=(0,p.useState)(""),{insertAfterBlock:u,removeBlock:d}=(0,c.useDispatch)(s.store),v=(0,a.__)("For example: Paste a URL from a Mastodon post or note into the field above to leave a comment.","activitypub"),[f,y]=(0,p.useState)(v);return(0,i.createElement)("div",{...(0,s.useBlockProps)()},(0,i.createElement)(l.TextControl,{label:(0,a.__)("This post is a reply to the following URL","activitypub"),value:e.url,onChange:e=>{!function(e){try{return new URL(e),!0}catch(e){return!1}}(e)?(w("error"),y((0,a.__)("Please enter a valid URL.","activitypub"))):(w(""),y(v)),t({url:e})},onKeyDown:t=>{"Enter"===t.key&&u(r),!e.url&&["Backspace","Delete"].includes(t.key)&&d(r)},type:"url",placeholder:"https://example.org/path",className:n,help:o?f:""}))},save:()=>null,icon:n})})()})();
+(()=>{"use strict";var e={20:(e,t,r)=>{var o=r(609),n=Symbol.for("react.element"),i=(Symbol.for("react.fragment"),Object.prototype.hasOwnProperty),a=o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,s={key:!0,ref:!0,__self:!0,__source:!0};t.jsx=function(e,t,r){var o,l={},p=null,c=null;for(o in void 0!==r&&(p=""+r),void 0!==t.key&&(p=""+t.key),void 0!==t.ref&&(c=t.ref),t)i.call(t,o)&&!s.hasOwnProperty(o)&&(l[o]=t[o]);if(e&&e.defaultProps)for(o in t=e.defaultProps)void 0===l[o]&&(l[o]=t[o]);return{$$typeof:n,type:e,key:p,ref:c,props:l,_owner:a.current}}},848:(e,t,r)=>{e.exports=r(20)},609:e=>{e.exports=window.React}},t={};function r(o){var n=t[o];if(void 0!==n)return n.exports;var i=t[o]={exports:{}};return e[o](i,i.exports,r),i.exports}const o=window.wp.blocks,n=window.wp.primitives;var i=r(848);const a=(0,i.jsx)(n.SVG,{width:"24",height:"24",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg",children:(0,i.jsx)(n.Path,{d:"M6.68822 10.625L6.24878 11.0649L5.5 11.8145L5.5 5.5L12.5 5.5V8L14 6.5V5C14 4.44772 13.5523 4 13 4H5C4.44772 4 4 4.44771 4 5V13.5247C4 13.8173 4.16123 14.086 4.41935 14.2237C4.72711 14.3878 5.10601 14.3313 5.35252 14.0845L7.31 12.125H8.375L9.875 10.625H7.31H6.68822ZM14.5605 10.4983L11.6701 13.75H16.9975C17.9963 13.75 18.7796 14.1104 19.3553 14.7048C19.9095 15.2771 20.2299 16.0224 20.4224 16.7443C20.7645 18.0276 20.7543 19.4618 20.7487 20.2544C20.7481 20.345 20.7475 20.4272 20.7475 20.4999L19.2475 20.5001C19.2475 20.4191 19.248 20.3319 19.2484 20.2394V20.2394C19.2526 19.4274 19.259 18.2035 18.973 17.1307C18.8156 16.5401 18.586 16.0666 18.2778 15.7483C17.9909 15.4521 17.5991 15.25 16.9975 15.25H11.8106L14.5303 17.9697L13.4696 19.0303L8.96956 14.5303L13.4394 9.50171L14.5605 10.4983Z"})});var s=r(609);const l=window.wp.i18n,p=window.wp.blockEditor,c=window.wp.components,w=window.wp.element,u=window.wp.data;(0,o.registerBlockType)("activitypub/reply",{edit:function({attributes:e,setAttributes:t,clientId:r,isSelected:o}){const[n,i]=(0,w.useState)(""),{insertAfterBlock:a,removeBlock:d}=(0,u.useDispatch)(p.store),v=(0,l.__)("For example: Paste a URL from a Mastodon post or note into the field above to leave a comment.","activitypub"),[f,y]=(0,w.useState)(v);return(0,s.createElement)("div",{...(0,p.useBlockProps)()},(0,s.createElement)(c.TextControl,{label:(0,l.__)("This post is a reply to the following URL","activitypub"),value:e.url,onChange:e=>{!function(e){try{return new URL(e),!0}catch(e){return!1}}(e)?(i("error"),y((0,l.__)("Please enter a valid URL.","activitypub"))):(i(""),y(v)),t({url:e})},onKeyDown:t=>{"Enter"===t.key&&a(r),!e.url&&["Backspace","Delete"].includes(t.key)&&d(r)},type:"url",placeholder:"https://example.org/path",className:n,help:o?f:""}))},save:()=>null,icon:a})})();

includes/class-blocks.php

@@ -152,11 +152,6 @@ class Blocks {
 			array( 'icon', 'name', 'webfinger' )
 		);
 
-		// add `@` prefix if it's missing
-		if ( '@' !== substr( $attrs['profileData']['webfinger'], 0, 1 ) ) {
-			$attrs['profileData']['webfinger'] = '@' . $attrs['profileData']['webfinger'];
-		}
-
 		$wrapper_attributes = get_block_wrapper_attributes(
 			array(
 				'aria-label' => __( 'Follow me on the Fediverse', 'activitypub' ),

src/follow-me/follow-me.js

@@ -33,13 +33,15 @@ function fetchProfile( userId ) {
 }
 
 function Profile( { profile, popupStyles, userId } ) {
-	const { avatar, name, webfinger } = profile;
+	const { webfinger, avatar, name } = profile;
+	// check if webfinger starts with @ and add it if it doesn't
+	const webfingerWithAt = webfinger.startsWith( '@' ) ? webfinger : `@${ webfinger }`;
 	return (
 		<div className="activitypub-profile">
 			<img className="activitypub-profile__avatar" src={ avatar } alt={ name } />
 			<div className="activitypub-profile__content">
 				<div className="activitypub-profile__name">{ name }</div>
-				<div className="activitypub-profile__handle" title={ webfinger }>{ webfinger }</div>
+				<div className="activitypub-profile__handle" title={ webfingerWithAt }>{ webfingerWithAt }</div>
 			</div>
 			<Follow profile={ profile } popupStyles={ popupStyles } userId={ userId } />
 		</div>
@@ -74,11 +76,12 @@ function DialogFollow( { profile, userId } ) {
 	const actionText = __( 'Follow', 'activitypub' );
 	const resourceUrl = `/${ namespace }/actors/${userId}/remote-follow?resource=`;
 	const copyDescription = __( 'Copy and paste my profile into the search field of your favorite fediverse app or server.', 'activitypub' );
+	const webfingerWithAt = webfinger.startsWith( '@' ) ? webfinger : `@${ webfinger }`;
 
 	return <Dialog
 		actionText={ actionText }
 		copyDescription={ copyDescription }
-		handle={ webfinger }
+		handle={ webfingerWithAt }
 		resourceUrl={ resourceUrl }
 	/>;
 }

src/shared/dialog.js

@@ -80,7 +80,7 @@ export function Dialog( { actionText, copyDescription, handle, resourceUrl, myPr
 				<h4>{ __( 'Your Profile', 'activitypub' ) }</h4>
 				<div className="activitypub-dialog__description">
 					{ createInterpolateElement(
-						__( 'Or, if you know your own profile, we can start things that way! (eg <code>yourusername@example.com</code>)', 'activitypub' ),
+						__( 'Or, if you know your own profile, we can start things that way! (eg <code>@yourusername@example.com</code>)', 'activitypub' ),
 						{ code: <code /> }
 					) }
 				</div>