From 0982c85f8699c5f54125a195a5364533222480fb Mon Sep 17 00:00:00 2001
From: Matt Wiebe <wiebe@automattic.com>
Date: Thu, 11 Apr 2024 08:10:37 -0500
Subject: [PATCH] Abstract shared Dialog code (#723)

* Create and use DRYer shared Dialog component

* Add `copyDescription` to the shared modal

* Built assets

* the wp-scripts package now emits a different style

Previously, it emitted `style-index.css`, now it emits `style-view.css` which seems like a potential bug worth monitoring

---------

Co-authored-by: Matthias Pfefferle <pfefferle@users.noreply.github.com>
---
 build/follow-me/block.json         |   2 +-
 build/follow-me/index.asset.php    |   2 +-
 build/follow-me/index.js           |   2 +-
 build/follow-me/style-index.css    |   1 -
 build/follow-me/style-view.css     |   1 +
 build/follow-me/view.asset.php     |   2 +-
 build/follow-me/view.js            |   2 +-
 build/followers/index.asset.php    |   2 +-
 build/followers/index.js           |   6 +-
 build/followers/view.asset.php     |   2 +-
 build/followers/view.js            |   6 +-
 build/remote-reply/index.asset.php |   2 +-
 build/remote-reply/index.js        |   2 +-
 src/follow-me/block.json           |   2 +-
 src/follow-me/follow-me.js         | 100 ++++------------------------
 src/follow-me/style.scss           |   4 +-
 src/remote-reply/remote-reply.js   | 101 ++++-------------------------
 src/shared/dialog.js               |  92 ++++++++++++++++++++++++++
 18 files changed, 137 insertions(+), 194 deletions(-)
 delete mode 100644 build/follow-me/style-index.css
 create mode 100644 build/follow-me/style-view.css
 create mode 100644 src/shared/dialog.js

diff --git a/build/follow-me/block.json b/build/follow-me/block.json
index 8dcb824d..6e685671 100644
--- a/build/follow-me/block.json
+++ b/build/follow-me/block.json
@@ -41,7 +41,7 @@
   "editorScript": "file:./index.js",
   "viewScript": "file:./view.js",
   "style": [
-    "file:./style-index.css",
+    "file:./style-view.css",
     "wp-components"
   ]
 }
\ No newline at end of file
diff --git a/build/follow-me/index.asset.php b/build/follow-me/index.asset.php
index ac15b343..80facf25 100644
--- a/build/follow-me/index.asset.php
+++ b/build/follow-me/index.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-api-fetch', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'c7c2319cdfac52a18445');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-compose', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '0708145714d72862bff0');
diff --git a/build/follow-me/index.js b/build/follow-me/index.js
index d95484d4..12897d8b 100644
--- a/build/follow-me/index.js
+++ b/build/follow-me/index.js
@@ -1 +1 @@
-(()=>{"use strict";var e,t={454:(e,t,n)=>{const o=window.wp.blocks,r=window.wp.element,l=window.wp.primitives,i=(0,r.createElement)(l.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,r.createElement)(l.Path,{d:"M15.5 9.5a1 1 0 100-2 1 1 0 000 2zm0 1.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5zm-2.25 6v-2a2.75 2.75 0 00-2.75-2.75h-4A2.75 2.75 0 003.75 15v2h1.5v-2c0-.69.56-1.25 1.25-1.25h4c.69 0 1.25.56 1.25 1.25v2h1.5zm7-2v2h-1.5v-2c0-.69-.56-1.25-1.25-1.25H15v-1.5h2.5A2.75 2.75 0 0120.25 15zM9.5 8.5a1 1 0 11-2 0 1 1 0 012 0zm1.5 0a2.5 2.5 0 11-5 0 2.5 2.5 0 015 0z",fillRule:"evenodd"})),a=window.wp.blockEditor,c=window.wp.i18n,u=window.wp.components,s=window.wp.data,p=window._activityPubOptions?.enabled,v=window.wp.apiFetch;var m=n.n(v);const d=(0,r.createElement)(l.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,r.createElement)(l.Path,{d:"M20.2 8v11c0 .7-.6 1.2-1.2 1.2H6v1.5h13c1.5 0 2.7-1.2 2.7-2.8V8zM18 16.4V4.6c0-.9-.7-1.6-1.6-1.6H4.6C3.7 3 3 3.7 3 4.6v11.8c0 .9.7 1.6 1.6 1.6h11.8c.9 0 1.6-.7 1.6-1.6zm-13.5 0V4.6c0-.1.1-.1.1-.1h11.8c.1 0 .1.1.1.1v11.8c0 .1-.1.1-.1.1H4.6l-.1-.1z"})),f=(0,r.createElement)(l.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,r.createElement)(l.Path,{d:"M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"})),b=function({icon:e,size:t=24,...n}){return(0,r.cloneElement)(e,{width:t,height:t,...n})},w=window.wp.compose;function y(e){return`var(--wp--preset--color--${e})`}function _(e){if("string"!=typeof e)return null;if(e.match(/^#/))return e.substring(0,7);const[,,t]=e.split("|");return y(t)}function h(e,t,n=null,o=""){return n?`${e}${o} { ${t}: ${n}; }\n`:""}function g(e,t,n,o){return h(e,"background-color",t)+h(e,"color",n)+h(e,"background-color",o,":hover")+h(e,"background-color",o,":focus")}function E({selector:e,style:t,backgroundColor:n}){const o=function(e,t,n){const o=`${e} .components-button`,r=("string"==typeof(l=n)?y(l):l?.color?.background||null)||t?.color?.background;var l;return g(o,_(t?.elements?.link?.color?.text),r,_(t?.elements?.link?.[":hover"]?.color?.text))}(e,t,n);return(0,r.createElement)("style",null,o)}const{namespace:k}=window._activityPubOptions,x={avatar:"",webfinger:"@well@hello.dolly",name:(0,c.__)("Hello Dolly Fan Account","activitypub"),url:"#"};function C(e){if(!e)return x;const t={...x,...e};return t.avatar=t?.icon?.url,t}function O({profile:e,popupStyles:t,userId:n}){const{avatar:o,name:l,webfinger:i}=e;return(0,r.createElement)("div",{className:"activitypub-profile"},(0,r.createElement)("img",{className:"activitypub-profile__avatar",src:o,alt:l}),(0,r.createElement)("div",{className:"activitypub-profile__content"},(0,r.createElement)("div",{className:"activitypub-profile__name"},l),(0,r.createElement)("div",{className:"activitypub-profile__handle",title:i},i)),(0,r.createElement)(S,{profile:e,popupStyles:t,userId:n}))}function S({profile:e,popupStyles:t,userId:n}){const[o,l]=(0,r.useState)(!1),i=(0,c.sprintf)((0,c.__)("Follow %s","activitypub"),e?.name);return(0,r.createElement)(r.Fragment,null,(0,r.createElement)(u.Button,{className:"activitypub-profile__follow",onClick:()=>l(!0)},(0,c.__)("Follow","activitypub")),o&&(0,r.createElement)(u.Modal,{className:"activitypub-profile__confirm activitypub__modal",onRequestClose:()=>l(!1),title:i},(0,r.createElement)($,{profile:e,userId:n}),(0,r.createElement)("style",null,t)))}function N(e){try{return new URL(e),!0}catch(e){return!1}}function $({profile:e,userId:t}){const{webfinger:n}=e,o=(0,c.__)("Follow","activitypub"),l=(0,c.__)("Loading...","activitypub"),i=(0,c.__)("Opening...","activitypub"),a=(0,c.__)("Error","activitypub"),s=(0,c.__)("Invalid","activitypub"),[p,v]=(0,r.useState)(o),[y,_]=(0,r.useState)(d),h=(0,w.useCopyToClipboard)(n,(()=>{_(f),setTimeout((()=>_(d)),1e3)})),[g,E]=(0,r.useState)(""),x=(0,r.useCallback)((()=>{let e;if(!N(g)&&!function(e){const t=e.replace(/^@/,"").split("@");return 2===t.length&&N(`https://${t[1]}`)}(g))return v(s),e=setTimeout((()=>v(o)),2e3),()=>clearTimeout(e);const n=`/${k}/users/${t}/remote-follow?resource=${g}`;v(l),m()({path:n}).then((({url:e})=>{v(i),setTimeout((()=>{window.open(e,"_blank"),v(o)}),200)})).catch((()=>{v(a),setTimeout((()=>v(o)),2e3)}))}),[g]);return(0,r.createElement)("div",{className:"activitypub__dialog"},(0,r.createElement)("div",{className:"activitypub-dialog__section"},(0,r.createElement)("h4",null,(0,c.__)("My Profile","activitypub")),(0,r.createElement)("div",{className:"activitypub-dialog-description"},(0,c.__)("Copy and paste my profile into the search field of your favorite fediverse app or server.","activitypub")),(0,r.createElement)("div",{className:"activitypub-dialog__button-group"},(0,r.createElement)("input",{type:"text",value:n,readOnly:!0}),(0,r.createElement)(u.Button,{ref:h},(0,r.createElement)(b,{icon:y}),(0,c.__)("Copy","activitypub")))),(0,r.createElement)("div",{className:"activitypub-dialog__section"},(0,r.createElement)("h4",null,(0,c.__)("Your Profile","activitypub")),(0,r.createElement)("div",{className:"activitypub-dialog__description"},(0,r.createInterpolateElement)((0,c.__)("Or, if you know your own profile, we can start things that way! (eg <code>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)","activitypub"),{code:(0,r.createElement)("code",null)})),(0,r.createElement)("div",{className:"activitypub-dialog__button-group"},(0,r.createElement)("input",{type:"text",value:g,onKeyDown:e=>{"Enter"===e?.code&&x()},onChange:e=>E(e.target.value)}),(0,r.createElement)(u.Button,{onClick:x},p))))}function z({selectedUser:e,style:t,backgroundColor:n,id:o,useId:l=!1,profileData:i=!1}){const[a,c]=(0,r.useState)(C()),u="site"===e?0:e,s=function(e){return g(".apfmd__button-group .components-button",_(e?.elements?.link?.color?.text)||"#111","#fff",_(e?.elements?.link?.[":hover"]?.color?.text)||"#333")}(t),p=l?{id:o}:{};function v(e){c(C(e))}return(0,r.useEffect)((()=>{if(i)return v(i);(function(e){const t={headers:{Accept:"application/activity+json"},path:`/${k}/users/${e}`};return m()(t)})(u).then(v)}),[u,i]),(0,r.createElement)("div",{...p},(0,r.createElement)(E,{selector:`#${o}`,style:t,backgroundColor:n}),(0,r.createElement)(O,{profile:a,userId:u,popupStyles:s}))}(0,o.registerBlockType)("activitypub/follow-me",{edit:function({attributes:e,setAttributes:t}){const n=(0,a.useBlockProps)({className:"activitypub-follow-me-block-wrapper"}),o=function(){const e=p?.users?(0,s.useSelect)((e=>e("core").getUsers({who:"authors"}))):[];return(0,r.useMemo)((()=>{if(!e)return[];const t=p?.site?[{label:(0,c.__)("Whole Site","activitypub"),value:"site"}]:[];return e.reduce(((e,t)=>(e.push({label:t.name,value:`${t.id}`}),e)),t)}),[e])}(),{selectedUser:l}=e;return(0,r.useEffect)((()=>{o.length&&(o.find((({value:e})=>e===l))||t({selectedUser:o[0].value}))}),[l,o]),(0,r.createElement)("div",{...n},o.length>1&&(0,r.createElement)(a.InspectorControls,{key:"setting"},(0,r.createElement)(u.PanelBody,{title:(0,c.__)("Followers Options","activitypub")},(0,r.createElement)(u.SelectControl,{label:(0,c.__)("Select User","activitypub"),value:e.selectedUser,options:o,onChange:e=>t({selectedUser:e})}))),(0,r.createElement)(z,{...e,id:n.id}))},save:()=>null,icon:i})}},n={};function o(e){var r=n[e];if(void 0!==r)return r.exports;var l=n[e]={exports:{}};return t[e](l,l.exports,o),l.exports}o.m=t,e=[],o.O=(t,n,r,l)=>{if(!n){var i=1/0;for(s=0;s<e.length;s++){n=e[s][0],r=e[s][1],l=e[s][2];for(var a=!0,c=0;c<n.length;c++)(!1&l||i>=l)&&Object.keys(o.O).every((e=>o.O[e](n[c])))?n.splice(c--,1):(a=!1,l<i&&(i=l));if(a){e.splice(s--,1);var u=r();void 0!==u&&(t=u)}}return t}l=l||0;for(var s=e.length;s>0&&e[s-1][2]>l;s--)e[s]=e[s-1];e[s]=[n,r,l]},o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={127:0,740:0};o.O.j=t=>0===e[t];var t=(t,n)=>{var r,l,i=n[0],a=n[1],c=n[2],u=0;if(i.some((t=>0!==e[t]))){for(r in a)o.o(a,r)&&(o.m[r]=a[r]);if(c)var s=c(o)}for(t&&t(n);u<i.length;u++)l=i[u],o.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return o.O(s)},n=self.webpackChunkwordpress_activitypub=self.webpackChunkwordpress_activitypub||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))})();var r=o.O(void 0,[740],(()=>o(454)));r=o.O(r)})();
\ No newline at end of file
+(()=>{"use strict";var e,t={647:(e,t,n)=>{const o=window.wp.blocks,r=window.React,l=window.wp.primitives,a=(0,r.createElement)(l.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,r.createElement)(l.Path,{d:"M15.5 9.5a1 1 0 100-2 1 1 0 000 2zm0 1.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5zm-2.25 6v-2a2.75 2.75 0 00-2.75-2.75h-4A2.75 2.75 0 003.75 15v2h1.5v-2c0-.69.56-1.25 1.25-1.25h4c.69 0 1.25.56 1.25 1.25v2h1.5zm7-2v2h-1.5v-2c0-.69-.56-1.25-1.25-1.25H15v-1.5h2.5A2.75 2.75 0 0120.25 15zM9.5 8.5a1 1 0 11-2 0 1 1 0 012 0zm1.5 0a2.5 2.5 0 11-5 0 2.5 2.5 0 015 0z",fillRule:"evenodd"})),i=window.wp.blockEditor,c=window.wp.i18n,u=window.wp.components,s=window.wp.data,p=window.wp.element,d=window._activityPubOptions?.enabled,v=window.wp.apiFetch;var m=n.n(v);function f(e){return`var(--wp--preset--color--${e})`}function w(e){if("string"!=typeof e)return null;if(e.match(/^#/))return e.substring(0,7);const[,,t]=e.split("|");return f(t)}function b(e,t,n=null,o=""){return n?`${e}${o} { ${t}: ${n}; }\n`:""}function y(e,t,n,o){return b(e,"background-color",t)+b(e,"color",n)+b(e,"background-color",o,":hover")+b(e,"background-color",o,":focus")}function _({selector:e,style:t,backgroundColor:n}){const o=function(e,t,n){const o=`${e} .components-button`,r=("string"==typeof(l=n)?f(l):l?.color?.background||null)||t?.color?.background;var l;return y(o,w(t?.elements?.link?.color?.text),r,w(t?.elements?.link?.[":hover"]?.color?.text))}(e,t,n);return(0,r.createElement)("style",null,o)}const h=(0,r.createElement)(l.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,r.createElement)(l.Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M5 4.5h11a.5.5 0 0 1 .5.5v11a.5.5 0 0 1-.5.5H5a.5.5 0 0 1-.5-.5V5a.5.5 0 0 1 .5-.5ZM3 5a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5Zm17 3v10.75c0 .69-.56 1.25-1.25 1.25H6v1.5h12.75a2.75 2.75 0 0 0 2.75-2.75V8H20Z"})),g=(0,r.createElement)(l.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,r.createElement)(l.Path,{d:"M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"})),E=(0,p.forwardRef)((function({icon:e,size:t=24,...n},o){return(0,p.cloneElement)(e,{width:t,height:t,...n,ref:o})})),k=window.wp.compose;function x(e){try{return new URL(e),!0}catch(e){return!1}}function C({actionText:e,copyDescription:t,handle:n,resourceUrl:o}){const l=(0,c.__)("Loading...","activitypub"),a=(0,c.__)("Opening...","activitypub"),i=(0,c.__)("Error","activitypub"),s=(0,c.__)("Invalid","activitypub"),[d,v]=(0,p.useState)(e),[f,w]=(0,p.useState)(h),b=(0,k.useCopyToClipboard)(n,(()=>{w(g),setTimeout((()=>w(h)),1e3)})),[y,_]=(0,p.useState)(""),C=(0,p.useCallback)((()=>{let t;if(!x(y)&&!function(e){const t=e.replace(/^@/,"").split("@");return 2===t.length&&x(`https://${t[1]}`)}(y))return v(s),t=setTimeout((()=>v(e)),2e3),()=>clearTimeout(t);const n=o+y;v(l),m()({path:n}).then((({url:t})=>{v(a),setTimeout((()=>{window.open(t,"_blank"),v(e)}),200)})).catch((()=>{v(i),setTimeout((()=>v(e)),2e3)}))}),[y]);return(0,r.createElement)("div",{className:"activitypub__dialog"},(0,r.createElement)("div",{className:"activitypub-dialog__section"},(0,r.createElement)("h4",null,(0,c.__)("My Profile","activitypub")),(0,r.createElement)("div",{className:"activitypub-dialog-description"},t),(0,r.createElement)("div",{className:"activitypub-dialog__button-group"},(0,r.createElement)("input",{type:"text",value:n,readOnly:!0}),(0,r.createElement)(u.Button,{ref:b},(0,r.createElement)(E,{icon:f}),(0,c.__)("Copy","activitypub")))),(0,r.createElement)("div",{className:"activitypub-dialog__section"},(0,r.createElement)("h4",null,(0,c.__)("Your Profile","activitypub")),(0,r.createElement)("div",{className:"activitypub-dialog__description"},(0,p.createInterpolateElement)((0,c.__)("Or, if you know your own profile, we can start things that way! (eg <code>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)","activitypub"),{code:(0,r.createElement)("code",null)})),(0,r.createElement)("div",{className:"activitypub-dialog__button-group"},(0,r.createElement)("input",{type:"text",value:y,onKeyDown:e=>{"Enter"===e?.code&&C()},onChange:e=>_(e.target.value)}),(0,r.createElement)(u.Button,{onClick:C},d))))}const{namespace:O}=window._activityPubOptions,S={avatar:"",webfinger:"@well@hello.dolly",name:(0,c.__)("Hello Dolly Fan Account","activitypub"),url:"#"};function N(e){if(!e)return S;const t={...S,...e};return t.avatar=t?.icon?.url,t}function $({profile:e,popupStyles:t,userId:n}){const{avatar:o,name:l,webfinger:a}=e;return(0,r.createElement)("div",{className:"activitypub-profile"},(0,r.createElement)("img",{className:"activitypub-profile__avatar",src:o,alt:l}),(0,r.createElement)("div",{className:"activitypub-profile__content"},(0,r.createElement)("div",{className:"activitypub-profile__name"},l),(0,r.createElement)("div",{className:"activitypub-profile__handle",title:a},a)),(0,r.createElement)(P,{profile:e,popupStyles:t,userId:n}))}function P({profile:e,popupStyles:t,userId:n}){const[o,l]=(0,p.useState)(!1),a=(0,c.sprintf)((0,c.__)("Follow %s","activitypub"),e?.name);return(0,r.createElement)(r.Fragment,null,(0,r.createElement)(u.Button,{className:"activitypub-profile__follow",onClick:()=>l(!0)},(0,c.__)("Follow","activitypub")),o&&(0,r.createElement)(u.Modal,{className:"activitypub-profile__confirm activitypub__modal",onRequestClose:()=>l(!1),title:a},(0,r.createElement)(T,{profile:e,userId:n}),(0,r.createElement)("style",null,t)))}function T({profile:e,userId:t}){const{webfinger:n}=e,o=(0,c.__)("Follow","activitypub"),l=`/${O}/users/${t}/remote-follow?resource=`,a=(0,c.__)("Copy and paste my profile into the search field of your favorite fediverse app or server.","activitypub");return(0,r.createElement)(C,{actionText:o,copyDescription:a,handle:n,resourceUrl:l})}function I({selectedUser:e,style:t,backgroundColor:n,id:o,useId:l=!1,profileData:a=!1}){const[i,c]=(0,p.useState)(N()),u="site"===e?0:e,s=function(e){return y(".apfmd__button-group .components-button",w(e?.elements?.link?.color?.text)||"#111","#fff",w(e?.elements?.link?.[":hover"]?.color?.text)||"#333")}(t),d=l?{id:o}:{};function v(e){c(N(e))}return(0,p.useEffect)((()=>{if(a)return v(a);(function(e){const t={headers:{Accept:"application/activity+json"},path:`/${O}/users/${e}`};return m()(t)})(u).then(v)}),[u,a]),(0,r.createElement)("div",{...d},(0,r.createElement)(_,{selector:`#${o}`,style:t,backgroundColor:n}),(0,r.createElement)($,{profile:i,userId:u,popupStyles:s}))}(0,o.registerBlockType)("activitypub/follow-me",{edit:function({attributes:e,setAttributes:t}){const n=(0,i.useBlockProps)({className:"activitypub-follow-me-block-wrapper"}),o=function(){const e=d?.users?(0,s.useSelect)((e=>e("core").getUsers({who:"authors"}))):[];return(0,p.useMemo)((()=>{if(!e)return[];const t=d?.site?[{label:(0,c.__)("Whole Site","activitypub"),value:"site"}]:[];return e.reduce(((e,t)=>(e.push({label:t.name,value:`${t.id}`}),e)),t)}),[e])}(),{selectedUser:l}=e;return(0,p.useEffect)((()=>{o.length&&(o.find((({value:e})=>e===l))||t({selectedUser:o[0].value}))}),[l,o]),(0,r.createElement)("div",{...n},o.length>1&&(0,r.createElement)(i.InspectorControls,{key:"setting"},(0,r.createElement)(u.PanelBody,{title:(0,c.__)("Followers Options","activitypub")},(0,r.createElement)(u.SelectControl,{label:(0,c.__)("Select User","activitypub"),value:e.selectedUser,options:o,onChange:e=>t({selectedUser:e})}))),(0,r.createElement)(I,{...e,id:n.id}))},save:()=>null,icon:a})}},n={};function o(e){var r=n[e];if(void 0!==r)return r.exports;var l=n[e]={exports:{}};return t[e](l,l.exports,o),l.exports}o.m=t,e=[],o.O=(t,n,r,l)=>{if(!n){var a=1/0;for(s=0;s<e.length;s++){for(var[n,r,l]=e[s],i=!0,c=0;c<n.length;c++)(!1&l||a>=l)&&Object.keys(o.O).every((e=>o.O[e](n[c])))?n.splice(c--,1):(i=!1,l<a&&(a=l));if(i){e.splice(s--,1);var u=r();void 0!==u&&(t=u)}}return t}l=l||0;for(var s=e.length;s>0&&e[s-1][2]>l;s--)e[s]=e[s-1];e[s]=[n,r,l]},o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={338:0,301:0};o.O.j=t=>0===e[t];var t=(t,n)=>{var r,l,[a,i,c]=n,u=0;if(a.some((t=>0!==e[t]))){for(r in i)o.o(i,r)&&(o.m[r]=i[r]);if(c)var s=c(o)}for(t&&t(n);u<a.length;u++)l=a[u],o.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return o.O(s)},n=globalThis.webpackChunkwordpress_activitypub=globalThis.webpackChunkwordpress_activitypub||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))})();var r=o.O(void 0,[301],(()=>o(647)));r=o.O(r)})();
\ No newline at end of file
diff --git a/build/follow-me/style-index.css b/build/follow-me/style-index.css
deleted file mode 100644
index 859950ec..00000000
--- a/build/follow-me/style-index.css
+++ /dev/null
@@ -1 +0,0 @@
-.activitypub-follow-me-block-wrapper{width:100%}.activitypub-follow-me-block-wrapper.has-background .activitypub-profile,.activitypub-follow-me-block-wrapper.has-border-color .activitypub-profile{padding-left:1rem;padding-right:1rem}.activitypub-follow-me-block-wrapper .activitypub-profile{align-items:center;display:flex;padding:1rem 0}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__avatar{border-radius:50%;height:75px;margin-right:1rem;width:75px}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__content{flex:1;min-width:0}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__handle,.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__name{line-height:1.2;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__name{font-size:1.25em}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__follow{align-self:center;background-color:var(--wp--preset--color--black);color:var(--wp--preset--color--white);margin-left:1rem}.activitypub__modal.components-modal__frame{background-color:#f7f7f7;color:#333}.activitypub__modal.components-modal__frame .components-modal__header-heading,.activitypub__modal.components-modal__frame h4{color:#333;letter-spacing:inherit;word-spacing:inherit}.activitypub__modal.components-modal__frame .components-modal__header .components-button:hover{color:var(--wp--preset--color--white)}.activitypub__dialog{max-width:40em}.activitypub__dialog h4{line-height:1;margin:0}.activitypub__dialog .activitypub-dialog__section{margin-bottom:2em}.activitypub__dialog .activitypub-dialog__description{font-size:var(--wp--preset--font-size--normal,.75rem);margin:.33em 0 1em}.activitypub__dialog .activitypub-dialog__button-group{align-items:flex-end;display:flex;justify-content:flex-end}.activitypub__dialog .activitypub-dialog__button-group svg{height:21px;margin-right:.5em;width:21px}.activitypub__dialog .activitypub-dialog__button-group input{background-color:var(--wp--preset--color--white);border:1px solid var(--wp--preset--color--black);border-radius:inherit 0;color:var(--wp--preset--color--black);flex:1;padding:6px 12px}.activitypub__dialog .activitypub-dialog__button-group button{align-self:center;background-color:var(--wp--preset--color--black);color:var(--wp--preset--color--white);margin-left:0;text-decoration:none}
diff --git a/build/follow-me/style-view.css b/build/follow-me/style-view.css
new file mode 100644
index 00000000..f614aaea
--- /dev/null
+++ b/build/follow-me/style-view.css
@@ -0,0 +1 @@
+.activitypub__modal.components-modal__frame{background-color:#f7f7f7;color:#333}.activitypub__modal.components-modal__frame .components-modal__header-heading,.activitypub__modal.components-modal__frame h4{color:#333;letter-spacing:inherit;word-spacing:inherit}.activitypub__modal.components-modal__frame .components-modal__header .components-button:hover{color:var(--wp--preset--color--white)}.activitypub__dialog{max-width:40em}.activitypub__dialog h4{line-height:1;margin:0}.activitypub__dialog .activitypub-dialog__section{margin-bottom:2em}.activitypub__dialog .activitypub-dialog__description{font-size:var(--wp--preset--font-size--normal,.75rem);margin:.33em 0 1em}.activitypub__dialog .activitypub-dialog__button-group{align-items:flex-end;display:flex;justify-content:flex-end}.activitypub__dialog .activitypub-dialog__button-group svg{height:21px;margin-right:.5em;width:21px}.activitypub__dialog .activitypub-dialog__button-group input{background-color:var(--wp--preset--color--white);border:1px solid var(--wp--preset--color--black);border-radius:inherit 0;color:var(--wp--preset--color--black);flex:1;padding:6px 12px}.activitypub__dialog .activitypub-dialog__button-group button{align-self:center;background-color:var(--wp--preset--color--black);color:var(--wp--preset--color--white);margin-left:0;text-decoration:none}.activitypub-follow-me-block-wrapper{width:100%}.activitypub-follow-me-block-wrapper.has-background .activitypub-profile,.activitypub-follow-me-block-wrapper.has-border-color .activitypub-profile{padding-left:1rem;padding-right:1rem}.activitypub-follow-me-block-wrapper .activitypub-profile{align-items:center;display:flex;padding:1rem 0}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__avatar{border-radius:50%;height:75px;margin-right:1rem;width:75px}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__content{flex:1;min-width:0}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__handle,.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__name{line-height:1.2;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__name{font-size:1.25em}.activitypub-follow-me-block-wrapper .activitypub-profile .activitypub-profile__follow{align-self:center;background-color:var(--wp--preset--color--black);color:var(--wp--preset--color--white);margin-left:1rem}
diff --git a/build/follow-me/view.asset.php b/build/follow-me/view.asset.php
index 15d9b4ca..e02268e8 100644
--- a/build/follow-me/view.asset.php
+++ b/build/follow-me/view.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-api-fetch', 'wp-components', 'wp-compose', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '1349fc90a3f33dde3595');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-compose', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => 'cbc379fca374f5f88e22');
diff --git a/build/follow-me/view.js b/build/follow-me/view.js
index a59d6bc4..3ebc7eab 100644
--- a/build/follow-me/view.js
+++ b/build/follow-me/view.js
@@ -1 +1 @@
-(()=>{"use strict";var e,t={703:(e,t,r)=>{const o=window.wp.element,n=window.wp.domReady;var a=r.n(n);const i=window.wp.apiFetch;var l=r.n(i);const c=window.wp.components,u=window.wp.i18n,s=window.wp.primitives,p=(0,o.createElement)(s.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,o.createElement)(s.Path,{d:"M20.2 8v11c0 .7-.6 1.2-1.2 1.2H6v1.5h13c1.5 0 2.7-1.2 2.7-2.8V8zM18 16.4V4.6c0-.9-.7-1.6-1.6-1.6H4.6C3.7 3 3 3.7 3 4.6v11.8c0 .9.7 1.6 1.6 1.6h11.8c.9 0 1.6-.7 1.6-1.6zm-13.5 0V4.6c0-.1.1-.1.1-.1h11.8c.1 0 .1.1.1.1v11.8c0 .1-.1.1-.1.1H4.6l-.1-.1z"})),m=(0,o.createElement)(s.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,o.createElement)(s.Path,{d:"M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"})),d=function({icon:e,size:t=24,...r}){return(0,o.cloneElement)(e,{width:t,height:t,...r})},v=window.wp.compose;function f(e){return`var(--wp--preset--color--${e})`}function y(e){if("string"!=typeof e)return null;if(e.match(/^#/))return e.substring(0,7);const[,,t]=e.split("|");return f(t)}function b(e,t,r=null,o=""){return r?`${e}${o} { ${t}: ${r}; }\n`:""}function w(e,t,r,o){return b(e,"background-color",t)+b(e,"color",r)+b(e,"background-color",o,":hover")+b(e,"background-color",o,":focus")}function _({selector:e,style:t,backgroundColor:r}){const n=function(e,t,r){const o=`${e} .components-button`,n=("string"==typeof(a=r)?f(a):a?.color?.background||null)||t?.color?.background;var a;return w(o,y(t?.elements?.link?.color?.text),n,y(t?.elements?.link?.[":hover"]?.color?.text))}(e,t,r);return(0,o.createElement)("style",null,n)}const{namespace:h}=window._activityPubOptions,g={avatar:"",webfinger:"@well@hello.dolly",name:(0,u.__)("Hello Dolly Fan Account","activitypub"),url:"#"};function E(e){if(!e)return g;const t={...g,...e};return t.avatar=t?.icon?.url,t}function k({profile:e,popupStyles:t,userId:r}){const{avatar:n,name:a,webfinger:i}=e;return(0,o.createElement)("div",{className:"activitypub-profile"},(0,o.createElement)("img",{className:"activitypub-profile__avatar",src:n,alt:a}),(0,o.createElement)("div",{className:"activitypub-profile__content"},(0,o.createElement)("div",{className:"activitypub-profile__name"},a),(0,o.createElement)("div",{className:"activitypub-profile__handle",title:i},i)),(0,o.createElement)(x,{profile:e,popupStyles:t,userId:r}))}function x({profile:e,popupStyles:t,userId:r}){const[n,a]=(0,o.useState)(!1),i=(0,u.sprintf)((0,u.__)("Follow %s","activitypub"),e?.name);return(0,o.createElement)(o.Fragment,null,(0,o.createElement)(c.Button,{className:"activitypub-profile__follow",onClick:()=>a(!0)},(0,u.__)("Follow","activitypub")),n&&(0,o.createElement)(c.Modal,{className:"activitypub-profile__confirm activitypub__modal",onRequestClose:()=>a(!1),title:i},(0,o.createElement)(C,{profile:e,userId:r}),(0,o.createElement)("style",null,t)))}function O(e){try{return new URL(e),!0}catch(e){return!1}}function C({profile:e,userId:t}){const{webfinger:r}=e,n=(0,u.__)("Follow","activitypub"),a=(0,u.__)("Loading...","activitypub"),i=(0,u.__)("Opening...","activitypub"),s=(0,u.__)("Error","activitypub"),f=(0,u.__)("Invalid","activitypub"),[y,b]=(0,o.useState)(n),[w,_]=(0,o.useState)(p),g=(0,v.useCopyToClipboard)(r,(()=>{_(m),setTimeout((()=>_(p)),1e3)})),[E,k]=(0,o.useState)(""),x=(0,o.useCallback)((()=>{let e;if(!O(E)&&!function(e){const t=e.replace(/^@/,"").split("@");return 2===t.length&&O(`https://${t[1]}`)}(E))return b(f),e=setTimeout((()=>b(n)),2e3),()=>clearTimeout(e);const r=`/${h}/users/${t}/remote-follow?resource=${E}`;b(a),l()({path:r}).then((({url:e})=>{b(i),setTimeout((()=>{window.open(e,"_blank"),b(n)}),200)})).catch((()=>{b(s),setTimeout((()=>b(n)),2e3)}))}),[E]);return(0,o.createElement)("div",{className:"activitypub__dialog"},(0,o.createElement)("div",{className:"activitypub-dialog__section"},(0,o.createElement)("h4",null,(0,u.__)("My Profile","activitypub")),(0,o.createElement)("div",{className:"activitypub-dialog-description"},(0,u.__)("Copy and paste my profile into the search field of your favorite fediverse app or server.","activitypub")),(0,o.createElement)("div",{className:"activitypub-dialog__button-group"},(0,o.createElement)("input",{type:"text",value:r,readOnly:!0}),(0,o.createElement)(c.Button,{ref:g},(0,o.createElement)(d,{icon:w}),(0,u.__)("Copy","activitypub")))),(0,o.createElement)("div",{className:"activitypub-dialog__section"},(0,o.createElement)("h4",null,(0,u.__)("Your Profile","activitypub")),(0,o.createElement)("div",{className:"activitypub-dialog__description"},(0,o.createInterpolateElement)((0,u.__)("Or, if you know your own profile, we can start things that way! (eg <code>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)","activitypub"),{code:(0,o.createElement)("code",null)})),(0,o.createElement)("div",{className:"activitypub-dialog__button-group"},(0,o.createElement)("input",{type:"text",value:E,onKeyDown:e=>{"Enter"===e?.code&&x()},onChange:e=>k(e.target.value)}),(0,o.createElement)(c.Button,{onClick:x},y))))}function N({selectedUser:e,style:t,backgroundColor:r,id:n,useId:a=!1,profileData:i=!1}){const[c,u]=(0,o.useState)(E()),s="site"===e?0:e,p=function(e){return w(".apfmd__button-group .components-button",y(e?.elements?.link?.color?.text)||"#111","#fff",y(e?.elements?.link?.[":hover"]?.color?.text)||"#333")}(t),m=a?{id:n}:{};function d(e){u(E(e))}return(0,o.useEffect)((()=>{if(i)return d(i);(function(e){const t={headers:{Accept:"application/activity+json"},path:`/${h}/users/${e}`};return l()(t)})(s).then(d)}),[s,i]),(0,o.createElement)("div",{...m},(0,o.createElement)(_,{selector:`#${n}`,style:t,backgroundColor:r}),(0,o.createElement)(k,{profile:c,userId:s,popupStyles:p}))}let S=1;a()((()=>{[].forEach.call(document.querySelectorAll(".activitypub-follow-me-block-wrapper"),(e=>{const t=JSON.parse(e.dataset.attrs);(0,o.render)((0,o.createElement)(N,{...t,id:"activitypub-follow-me-block-"+S++,useId:!0}),e)}))}))}},r={};function o(e){var n=r[e];if(void 0!==n)return n.exports;var a=r[e]={exports:{}};return t[e](a,a.exports,o),a.exports}o.m=t,e=[],o.O=(t,r,n,a)=>{if(!r){var i=1/0;for(s=0;s<e.length;s++){r=e[s][0],n=e[s][1],a=e[s][2];for(var l=!0,c=0;c<r.length;c++)(!1&a||i>=a)&&Object.keys(o.O).every((e=>o.O[e](r[c])))?r.splice(c--,1):(l=!1,a<i&&(i=a));if(l){e.splice(s--,1);var u=n();void 0!==u&&(t=u)}}return t}a=a||0;for(var s=e.length;s>0&&e[s-1][2]>a;s--)e[s]=e[s-1];e[s]=[r,n,a]},o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var r in t)o.o(t,r)&&!o.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={529:0,740:0};o.O.j=t=>0===e[t];var t=(t,r)=>{var n,a,i=r[0],l=r[1],c=r[2],u=0;if(i.some((t=>0!==e[t]))){for(n in l)o.o(l,n)&&(o.m[n]=l[n]);if(c)var s=c(o)}for(t&&t(r);u<i.length;u++)a=i[u],o.o(e,a)&&e[a]&&e[a][0](),e[a]=0;return o.O(s)},r=self.webpackChunkwordpress_activitypub=self.webpackChunkwordpress_activitypub||[];r.forEach(t.bind(null,0)),r.push=t.bind(null,r.push.bind(r))})();var n=o.O(void 0,[740],(()=>o(703)));n=o.O(n)})();
\ No newline at end of file
+(()=>{"use strict";var e,t={421:(e,t,o)=>{const r=window.React,n=window.wp.element,a=window.wp.domReady;var i=o.n(a);const l=window.wp.apiFetch;var c=o.n(l);const u=window.wp.components,s=window.wp.i18n;function p(e){return`var(--wp--preset--color--${e})`}function d(e){if("string"!=typeof e)return null;if(e.match(/^#/))return e.substring(0,7);const[,,t]=e.split("|");return p(t)}function m(e,t,o=null,r=""){return o?`${e}${r} { ${t}: ${o}; }\n`:""}function v(e,t,o,r){return m(e,"background-color",t)+m(e,"color",o)+m(e,"background-color",r,":hover")+m(e,"background-color",r,":focus")}function f({selector:e,style:t,backgroundColor:o}){const n=function(e,t,o){const r=`${e} .components-button`,n=("string"==typeof(a=o)?p(a):a?.color?.background||null)||t?.color?.background;var a;return v(r,d(t?.elements?.link?.color?.text),n,d(t?.elements?.link?.[":hover"]?.color?.text))}(e,t,o);return(0,r.createElement)("style",null,n)}const y=window.wp.primitives,b=(0,r.createElement)(y.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,r.createElement)(y.Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M5 4.5h11a.5.5 0 0 1 .5.5v11a.5.5 0 0 1-.5.5H5a.5.5 0 0 1-.5-.5V5a.5.5 0 0 1 .5-.5ZM3 5a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5Zm17 3v10.75c0 .69-.56 1.25-1.25 1.25H6v1.5h12.75a2.75 2.75 0 0 0 2.75-2.75V8H20Z"})),w=(0,r.createElement)(y.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,r.createElement)(y.Path,{d:"M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"})),_=(0,n.forwardRef)((function({icon:e,size:t=24,...o},r){return(0,n.cloneElement)(e,{width:t,height:t,...o,ref:r})})),h=window.wp.compose;function g(e){try{return new URL(e),!0}catch(e){return!1}}function E({actionText:e,copyDescription:t,handle:o,resourceUrl:a}){const i=(0,s.__)("Loading...","activitypub"),l=(0,s.__)("Opening...","activitypub"),p=(0,s.__)("Error","activitypub"),d=(0,s.__)("Invalid","activitypub"),[m,v]=(0,n.useState)(e),[f,y]=(0,n.useState)(b),E=(0,h.useCopyToClipboard)(o,(()=>{y(w),setTimeout((()=>y(b)),1e3)})),[k,x]=(0,n.useState)(""),O=(0,n.useCallback)((()=>{let t;if(!g(k)&&!function(e){const t=e.replace(/^@/,"").split("@");return 2===t.length&&g(`https://${t[1]}`)}(k))return v(d),t=setTimeout((()=>v(e)),2e3),()=>clearTimeout(t);const o=a+k;v(i),c()({path:o}).then((({url:t})=>{v(l),setTimeout((()=>{window.open(t,"_blank"),v(e)}),200)})).catch((()=>{v(p),setTimeout((()=>v(e)),2e3)}))}),[k]);return(0,r.createElement)("div",{className:"activitypub__dialog"},(0,r.createElement)("div",{className:"activitypub-dialog__section"},(0,r.createElement)("h4",null,(0,s.__)("My Profile","activitypub")),(0,r.createElement)("div",{className:"activitypub-dialog-description"},t),(0,r.createElement)("div",{className:"activitypub-dialog__button-group"},(0,r.createElement)("input",{type:"text",value:o,readOnly:!0}),(0,r.createElement)(u.Button,{ref:E},(0,r.createElement)(_,{icon:f}),(0,s.__)("Copy","activitypub")))),(0,r.createElement)("div",{className:"activitypub-dialog__section"},(0,r.createElement)("h4",null,(0,s.__)("Your Profile","activitypub")),(0,r.createElement)("div",{className:"activitypub-dialog__description"},(0,n.createInterpolateElement)((0,s.__)("Or, if you know your own profile, we can start things that way! (eg <code>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)","activitypub"),{code:(0,r.createElement)("code",null)})),(0,r.createElement)("div",{className:"activitypub-dialog__button-group"},(0,r.createElement)("input",{type:"text",value:k,onKeyDown:e=>{"Enter"===e?.code&&O()},onChange:e=>x(e.target.value)}),(0,r.createElement)(u.Button,{onClick:O},m))))}const{namespace:k}=window._activityPubOptions,x={avatar:"",webfinger:"@well@hello.dolly",name:(0,s.__)("Hello Dolly Fan Account","activitypub"),url:"#"};function O(e){if(!e)return x;const t={...x,...e};return t.avatar=t?.icon?.url,t}function N({profile:e,popupStyles:t,userId:o}){const{avatar:n,name:a,webfinger:i}=e;return(0,r.createElement)("div",{className:"activitypub-profile"},(0,r.createElement)("img",{className:"activitypub-profile__avatar",src:n,alt:a}),(0,r.createElement)("div",{className:"activitypub-profile__content"},(0,r.createElement)("div",{className:"activitypub-profile__name"},a),(0,r.createElement)("div",{className:"activitypub-profile__handle",title:i},i)),(0,r.createElement)(C,{profile:e,popupStyles:t,userId:o}))}function C({profile:e,popupStyles:t,userId:o}){const[a,i]=(0,n.useState)(!1),l=(0,s.sprintf)((0,s.__)("Follow %s","activitypub"),e?.name);return(0,r.createElement)(r.Fragment,null,(0,r.createElement)(u.Button,{className:"activitypub-profile__follow",onClick:()=>i(!0)},(0,s.__)("Follow","activitypub")),a&&(0,r.createElement)(u.Modal,{className:"activitypub-profile__confirm activitypub__modal",onRequestClose:()=>i(!1),title:l},(0,r.createElement)(S,{profile:e,userId:o}),(0,r.createElement)("style",null,t)))}function S({profile:e,userId:t}){const{webfinger:o}=e,n=(0,s.__)("Follow","activitypub"),a=`/${k}/users/${t}/remote-follow?resource=`,i=(0,s.__)("Copy and paste my profile into the search field of your favorite fediverse app or server.","activitypub");return(0,r.createElement)(E,{actionText:n,copyDescription:i,handle:o,resourceUrl:a})}function $({selectedUser:e,style:t,backgroundColor:o,id:a,useId:i=!1,profileData:l=!1}){const[u,s]=(0,n.useState)(O()),p="site"===e?0:e,m=function(e){return v(".apfmd__button-group .components-button",d(e?.elements?.link?.color?.text)||"#111","#fff",d(e?.elements?.link?.[":hover"]?.color?.text)||"#333")}(t),y=i?{id:a}:{};function b(e){s(O(e))}return(0,n.useEffect)((()=>{if(l)return b(l);(function(e){const t={headers:{Accept:"application/activity+json"},path:`/${k}/users/${e}`};return c()(t)})(p).then(b)}),[p,l]),(0,r.createElement)("div",{...y},(0,r.createElement)(f,{selector:`#${a}`,style:t,backgroundColor:o}),(0,r.createElement)(N,{profile:u,userId:p,popupStyles:m}))}let I=1;i()((()=>{[].forEach.call(document.querySelectorAll(".activitypub-follow-me-block-wrapper"),(e=>{const t=JSON.parse(e.dataset.attrs);(0,n.render)((0,r.createElement)($,{...t,id:"activitypub-follow-me-block-"+I++,useId:!0}),e)}))}))}},o={};function r(e){var n=o[e];if(void 0!==n)return n.exports;var a=o[e]={exports:{}};return t[e](a,a.exports,r),a.exports}r.m=t,e=[],r.O=(t,o,n,a)=>{if(!o){var i=1/0;for(s=0;s<e.length;s++){for(var[o,n,a]=e[s],l=!0,c=0;c<o.length;c++)(!1&a||i>=a)&&Object.keys(r.O).every((e=>r.O[e](o[c])))?o.splice(c--,1):(l=!1,a<i&&(i=a));if(l){e.splice(s--,1);var u=n();void 0!==u&&(t=u)}}return t}a=a||0;for(var s=e.length;s>0&&e[s-1][2]>a;s--)e[s]=e[s-1];e[s]=[o,n,a]},r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var o in t)r.o(t,o)&&!r.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={41:0,301:0};r.O.j=t=>0===e[t];var t=(t,o)=>{var n,a,[i,l,c]=o,u=0;if(i.some((t=>0!==e[t]))){for(n in l)r.o(l,n)&&(r.m[n]=l[n]);if(c)var s=c(r)}for(t&&t(o);u<i.length;u++)a=i[u],r.o(e,a)&&e[a]&&e[a][0](),e[a]=0;return r.O(s)},o=globalThis.webpackChunkwordpress_activitypub=globalThis.webpackChunkwordpress_activitypub||[];o.forEach(t.bind(null,0)),o.push=t.bind(null,o.push.bind(o))})();var n=r.O(void 0,[301],(()=>r(421)));n=r.O(n)})();
\ No newline at end of file
diff --git a/build/followers/index.asset.php b/build/followers/index.asset.php
index a6b5db01..b9383244 100644
--- a/build/followers/index.asset.php
+++ b/build/followers/index.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-url'), 'version' => 'c338a0364a63e21934ae');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-block-editor', 'wp-blocks', 'wp-components', 'wp-data', 'wp-element', 'wp-i18n', 'wp-primitives', 'wp-url'), 'version' => '536d43b3eaab93a5c9ef');
diff --git a/build/followers/index.js b/build/followers/index.js
index 4871225b..f10e58ff 100644
--- a/build/followers/index.js
+++ b/build/followers/index.js
@@ -1,3 +1,3 @@
-(()=>{var e={184:(e,t)=>{var a;!function(){"use strict";var l={}.hasOwnProperty;function n(){for(var e=[],t=0;t<arguments.length;t++){var a=arguments[t];if(a){var r=typeof a;if("string"===r||"number"===r)e.push(a);else if(Array.isArray(a)){if(a.length){var o=n.apply(null,a);o&&e.push(o)}}else if("object"===r){if(a.toString!==Object.prototype.toString&&!a.toString.toString().includes("[native code]")){e.push(a.toString());continue}for(var i in a)l.call(a,i)&&a[i]&&e.push(i)}}}return e.join(" ")}e.exports?(n.default=n,e.exports=n):void 0===(a=function(){return n}.apply(t,[]))||(e.exports=a)}()}},t={};function a(l){var n=t[l];if(void 0!==n)return n.exports;var r=t[l]={exports:{}};return e[l](r,r.exports,a),r.exports}a.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return a.d(t,{a:t}),t},a.d=(e,t)=>{for(var l in t)a.o(t,l)&&!a.o(e,l)&&Object.defineProperty(e,l,{enumerable:!0,get:t[l]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{"use strict";const e=window.wp.blocks,t=window.wp.element,l=window.wp.primitives,n=(0,t.createElement)(l.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,t.createElement)(l.Path,{d:"M15.5 9.5a1 1 0 100-2 1 1 0 000 2zm0 1.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5zm-2.25 6v-2a2.75 2.75 0 00-2.75-2.75h-4A2.75 2.75 0 003.75 15v2h1.5v-2c0-.69.56-1.25 1.25-1.25h4c.69 0 1.25.56 1.25 1.25v2h1.5zm7-2v2h-1.5v-2c0-.69-.56-1.25-1.25-1.25H15v-1.5h2.5A2.75 2.75 0 0120.25 15zM9.5 8.5a1 1 0 11-2 0 1 1 0 012 0zm1.5 0a2.5 2.5 0 11-5 0 2.5 2.5 0 015 0z",fillRule:"evenodd"})),r=window.wp.components,o=window.wp.blockEditor,i=window.wp.i18n,c=window.React,s=window.wp.apiFetch;var p=a.n(s);const u=window.wp.url;var v=a(184),m=a.n(v);function w({active:e,children:a,page:l,pageClick:n,className:r}){const o=m()("wp-block activitypub-pager",r,{current:e});return(0,t.createElement)("a",{className:o,onClick:t=>{t.preventDefault(),!e&&n(l)}},a)}const b={outlined:"outlined",minimal:"minimal"};function d({compact:e,nextLabel:a,page:l,pageClick:n,perPage:r,prevLabel:o,total:i,variant:c=b.outlined}){const s=((e,t)=>{let a=[1,e-2,e-1,e,e+1,e+2,t];a.sort(((e,t)=>e-t)),a=a.filter(((e,a,l)=>e>=1&&e<=t&&l.lastIndexOf(e)===a));for(let e=a.length-2;e>=0;e--)a[e]===a[e+1]&&a.splice(e+1,1);return a})(l,Math.ceil(i/r)),p=m()("alignwide wp-block-query-pagination is-content-justification-space-between is-layout-flex wp-block-query-pagination-is-layout-flex",`is-${c}`,{"is-compact":e});return(0,t.createElement)("nav",{className:p},o&&(0,t.createElement)(w,{key:"prev",page:l-1,pageClick:n,active:1===l,"aria-label":o,className:"wp-block-query-pagination-previous block-editor-block-list__block"},o),!e&&(0,t.createElement)("div",{className:"block-editor-block-list__block wp-block wp-block-query-pagination-numbers"},s.map((e=>(0,t.createElement)(w,{key:e,page:e,pageClick:n,active:e===l,className:"page-numbers"},e)))),a&&(0,t.createElement)(w,{key:"next",page:l+1,pageClick:n,active:l===Math.ceil(i/r),"aria-label":a,className:"wp-block-query-pagination-next block-editor-block-list__block"},a))}const{namespace:g}=window._activityPubOptions;function f({selectedUser:e,per_page:a,order:l,title:n,page:r,setPage:o,className:s="",followLinks:v=!0,followerData:m=!1}){const w="site"===e?0:e,[b,f]=(0,c.useState)([]),[h,k]=(0,c.useState)(0),[E,_]=(0,c.useState)(0),[x,C]=function(){const[e,t]=(0,c.useState)(1);return[e,t]}(),S=r||x,N=o||C,P=(0,t.createInterpolateElement)(/* translators: arrow for previous followers link */
-(0,i.__)("<span>←</span> Less","activitypub"),{span:(0,t.createElement)("span",{class:"wp-block-query-pagination-previous-arrow is-arrow-arrow","aria-hidden":"true"})}),L=(0,t.createInterpolateElement)(/* translators: arrow for next followers link */
-(0,i.__)("More <span>→</span>","activitypub"),{span:(0,t.createElement)("span",{class:"wp-block-query-pagination-next-arrow is-arrow-arrow","aria-hidden":"true"})}),O=(e,t)=>{f(e),_(t),k(Math.ceil(t/a))};return(0,c.useEffect)((()=>{if(m&&1===S)return O(m.followers,m.total);const e=function(e,t,a,l){const n=`/${g}/users/${e}/followers`,r={per_page:t,order:a,page:l,context:"full"};return(0,u.addQueryArgs)(n,r)}(w,a,l,S);p()({path:e}).then((e=>O(e.orderedItems,e.totalItems))).catch((()=>{}))}),[w,a,l,S,m]),(0,t.createElement)("div",{className:"activitypub-follower-block "+s},(0,t.createElement)("h3",null,n),(0,t.createElement)("ul",null,b&&b.map((e=>(0,t.createElement)("li",{key:e.url},(0,t.createElement)(y,{...e,followLinks:v}))))),h>1&&(0,t.createElement)(d,{page:S,perPage:a,total:E,pageClick:N,nextLabel:L,prevLabel:P,compact:"is-style-compact"===s}))}function y({name:e,icon:a,url:l,preferredUsername:n,followLinks:o=!0}){const i=`@${n}`,c={};return o||(c.onClick=e=>e.preventDefault()),(0,t.createElement)(r.ExternalLink,{className:"activitypub-link",href:l,title:i,...c},(0,t.createElement)("img",{width:"40",height:"40",src:a.url,class:"avatar activitypub-avatar",alt:e}),(0,t.createElement)("span",{class:"activitypub-actor"},(0,t.createElement)("strong",{className:"activitypub-name"},e),(0,t.createElement)("span",{class:"sep"},"/"),(0,t.createElement)("span",{class:"activitypub-handle"},i)))}const h=window.wp.data,k=window._activityPubOptions?.enabled;(0,e.registerBlockType)("activitypub/followers",{edit:function({attributes:e,setAttributes:a}){const{order:l,per_page:n,selectedUser:c,title:s}=e,p=(0,o.useBlockProps)(),[u,v]=(0,t.useState)(1),m=[{label:(0,i.__)("New to old","activitypub"),value:"desc"},{label:(0,i.__)("Old to new","activitypub"),value:"asc"}],w=function(){const e=k?.users?(0,h.useSelect)((e=>e("core").getUsers({who:"authors"}))):[];return(0,t.useMemo)((()=>{if(!e)return[];const t=k?.site?[{label:(0,i.__)("Whole Site","activitypub"),value:"site"}]:[];return e.reduce(((e,t)=>(e.push({label:t.name,value:`${t.id}`}),e)),t)}),[e])}(),b=e=>t=>{v(1),a({[e]:t})};return(0,t.useEffect)((()=>{w.length&&(w.find((({value:e})=>e===c))||a({selectedUser:w[0].value}))}),[c,w]),(0,t.createElement)("div",{...p},(0,t.createElement)(o.InspectorControls,{key:"setting"},(0,t.createElement)(r.PanelBody,{title:(0,i.__)("Followers Options","activitypub")},(0,t.createElement)(r.TextControl,{label:(0,i.__)("Title","activitypub"),help:(0,i.__)("Title to display above the list of followers. Blank for none.","activitypub"),value:s,onChange:e=>a({title:e})}),w.length>1&&(0,t.createElement)(r.SelectControl,{label:(0,i.__)("Select User","activitypub"),value:c,options:w,onChange:b("selectedUser")}),(0,t.createElement)(r.SelectControl,{label:(0,i.__)("Sort","activitypub"),value:l,options:m,onChange:b("order")}),(0,t.createElement)(r.RangeControl,{label:(0,i.__)("Number of Followers","activitypub"),value:n,onChange:b("per_page"),min:1,max:10}))),(0,t.createElement)(f,{...e,page:u,setPage:v,followLinks:!1}))},save:()=>null,icon:n})})()})();
\ No newline at end of file
+(()=>{var e={942:(e,t)=>{var a;!function(){"use strict";var n={}.hasOwnProperty;function r(){for(var e="",t=0;t<arguments.length;t++){var a=arguments[t];a&&(e=o(e,l(a)))}return e}function l(e){if("string"==typeof e||"number"==typeof e)return e;if("object"!=typeof e)return"";if(Array.isArray(e))return r.apply(null,e);if(e.toString!==Object.prototype.toString&&!e.toString.toString().includes("[native code]"))return e.toString();var t="";for(var a in e)n.call(e,a)&&e[a]&&(t=o(t,a));return t}function o(e,t){return t?e?e+" "+t:e+t:e}e.exports?(r.default=r,e.exports=r):void 0===(a=function(){return r}.apply(t,[]))||(e.exports=a)}()}},t={};function a(n){var r=t[n];if(void 0!==r)return r.exports;var l=t[n]={exports:{}};return e[n](l,l.exports,a),l.exports}a.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return a.d(t,{a:t}),t},a.d=(e,t)=>{for(var n in t)a.o(t,n)&&!a.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{"use strict";const e=window.wp.blocks,t=window.React,n=window.wp.primitives,r=(0,t.createElement)(n.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,t.createElement)(n.Path,{d:"M15.5 9.5a1 1 0 100-2 1 1 0 000 2zm0 1.5a2.5 2.5 0 100-5 2.5 2.5 0 000 5zm-2.25 6v-2a2.75 2.75 0 00-2.75-2.75h-4A2.75 2.75 0 003.75 15v2h1.5v-2c0-.69.56-1.25 1.25-1.25h4c.69 0 1.25.56 1.25 1.25v2h1.5zm7-2v2h-1.5v-2c0-.69-.56-1.25-1.25-1.25H15v-1.5h2.5A2.75 2.75 0 0120.25 15zM9.5 8.5a1 1 0 11-2 0 1 1 0 012 0zm1.5 0a2.5 2.5 0 11-5 0 2.5 2.5 0 015 0z",fillRule:"evenodd"})),l=window.wp.components,o=window.wp.element,i=window.wp.blockEditor,c=window.wp.i18n,s=window.wp.apiFetch;var p=a.n(s);const u=window.wp.url;var v=a(942),m=a.n(v);function w({active:e,children:a,page:n,pageClick:r,className:l}){const o=m()("wp-block activitypub-pager",l,{current:e});return(0,t.createElement)("a",{className:o,onClick:t=>{t.preventDefault(),!e&&r(n)}},a)}const b={outlined:"outlined",minimal:"minimal"};function d({compact:e,nextLabel:a,page:n,pageClick:r,perPage:l,prevLabel:o,total:i,variant:c=b.outlined}){const s=((e,t)=>{let a=[1,e-2,e-1,e,e+1,e+2,t];a.sort(((e,t)=>e-t)),a=a.filter(((e,a,n)=>e>=1&&e<=t&&n.lastIndexOf(e)===a));for(let e=a.length-2;e>=0;e--)a[e]===a[e+1]&&a.splice(e+1,1);return a})(n,Math.ceil(i/l)),p=m()("alignwide wp-block-query-pagination is-content-justification-space-between is-layout-flex wp-block-query-pagination-is-layout-flex",`is-${c}`,{"is-compact":e});return(0,t.createElement)("nav",{className:p},o&&(0,t.createElement)(w,{key:"prev",page:n-1,pageClick:r,active:1===n,"aria-label":o,className:"wp-block-query-pagination-previous block-editor-block-list__block"},o),!e&&(0,t.createElement)("div",{className:"block-editor-block-list__block wp-block wp-block-query-pagination-numbers"},s.map((e=>(0,t.createElement)(w,{key:e,page:e,pageClick:r,active:e===n,className:"page-numbers"},e)))),a&&(0,t.createElement)(w,{key:"next",page:n+1,pageClick:r,active:n===Math.ceil(i/l),"aria-label":a,className:"wp-block-query-pagination-next block-editor-block-list__block"},a))}const{namespace:f}=window._activityPubOptions;function g({selectedUser:e,per_page:a,order:n,title:r,page:l,setPage:i,className:s="",followLinks:v=!0,followerData:m=!1}){const w="site"===e?0:e,[b,g]=(0,t.useState)([]),[k,h]=(0,t.useState)(0),[E,_]=(0,t.useState)(0),[x,C]=function(){const[e,a]=(0,t.useState)(1);return[e,a]}(),S=l||x,N=i||C,P=(0,o.createInterpolateElement)(/* translators: arrow for previous followers link */ /* translators: arrow for previous followers link */
+(0,c.__)("<span>←</span> Less","activitypub"),{span:(0,t.createElement)("span",{class:"wp-block-query-pagination-previous-arrow is-arrow-arrow","aria-hidden":"true"})}),L=(0,o.createInterpolateElement)(/* translators: arrow for next followers link */ /* translators: arrow for next followers link */
+(0,c.__)("More <span>→</span>","activitypub"),{span:(0,t.createElement)("span",{class:"wp-block-query-pagination-next-arrow is-arrow-arrow","aria-hidden":"true"})}),O=(e,t)=>{g(e),_(t),h(Math.ceil(t/a))};return(0,t.useEffect)((()=>{if(m&&1===S)return O(m.followers,m.total);const e=function(e,t,a,n){const r=`/${f}/users/${e}/followers`,l={per_page:t,order:a,page:n,context:"full"};return(0,u.addQueryArgs)(r,l)}(w,a,n,S);p()({path:e}).then((e=>O(e.orderedItems,e.totalItems))).catch((()=>{}))}),[w,a,n,S,m]),(0,t.createElement)("div",{className:"activitypub-follower-block "+s},(0,t.createElement)("h3",null,r),(0,t.createElement)("ul",null,b&&b.map((e=>(0,t.createElement)("li",{key:e.url},(0,t.createElement)(y,{...e,followLinks:v}))))),k>1&&(0,t.createElement)(d,{page:S,perPage:a,total:E,pageClick:N,nextLabel:L,prevLabel:P,compact:"is-style-compact"===s}))}function y({name:e,icon:a,url:n,preferredUsername:r,followLinks:o=!0}){const i=`@${r}`,c={};return o||(c.onClick=e=>e.preventDefault()),(0,t.createElement)(l.ExternalLink,{className:"activitypub-link",href:n,title:i,...c},(0,t.createElement)("img",{width:"40",height:"40",src:a.url,class:"avatar activitypub-avatar",alt:e}),(0,t.createElement)("span",{class:"activitypub-actor"},(0,t.createElement)("strong",{className:"activitypub-name"},e),(0,t.createElement)("span",{class:"sep"},"/"),(0,t.createElement)("span",{class:"activitypub-handle"},i)))}const k=window.wp.data,h=window._activityPubOptions?.enabled;(0,e.registerBlockType)("activitypub/followers",{edit:function({attributes:e,setAttributes:a}){const{order:n,per_page:r,selectedUser:s,title:p}=e,u=(0,i.useBlockProps)(),[v,m]=(0,o.useState)(1),w=[{label:(0,c.__)("New to old","activitypub"),value:"desc"},{label:(0,c.__)("Old to new","activitypub"),value:"asc"}],b=function(){const e=h?.users?(0,k.useSelect)((e=>e("core").getUsers({who:"authors"}))):[];return(0,o.useMemo)((()=>{if(!e)return[];const t=h?.site?[{label:(0,c.__)("Whole Site","activitypub"),value:"site"}]:[];return e.reduce(((e,t)=>(e.push({label:t.name,value:`${t.id}`}),e)),t)}),[e])}(),d=e=>t=>{m(1),a({[e]:t})};return(0,o.useEffect)((()=>{b.length&&(b.find((({value:e})=>e===s))||a({selectedUser:b[0].value}))}),[s,b]),(0,t.createElement)("div",{...u},(0,t.createElement)(i.InspectorControls,{key:"setting"},(0,t.createElement)(l.PanelBody,{title:(0,c.__)("Followers Options","activitypub")},(0,t.createElement)(l.TextControl,{label:(0,c.__)("Title","activitypub"),help:(0,c.__)("Title to display above the list of followers. Blank for none.","activitypub"),value:p,onChange:e=>a({title:e})}),b.length>1&&(0,t.createElement)(l.SelectControl,{label:(0,c.__)("Select User","activitypub"),value:s,options:b,onChange:d("selectedUser")}),(0,t.createElement)(l.SelectControl,{label:(0,c.__)("Sort","activitypub"),value:n,options:w,onChange:d("order")}),(0,t.createElement)(l.RangeControl,{label:(0,c.__)("Number of Followers","activitypub"),value:r,onChange:d("per_page"),min:1,max:10}))),(0,t.createElement)(g,{...e,page:v,setPage:m,followLinks:!1}))},save:()=>null,icon:r})})()})();
\ No newline at end of file
diff --git a/build/followers/view.asset.php b/build/followers/view.asset.php
index 47972bbf..c11c39ca 100644
--- a/build/followers/view.asset.php
+++ b/build/followers/view.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-url'), 'version' => 'ed5a13e66f8b10323435');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-url'), 'version' => '23bc54443801976420cd');
diff --git a/build/followers/view.js b/build/followers/view.js
index 6c42c39f..97227046 100644
--- a/build/followers/view.js
+++ b/build/followers/view.js
@@ -1,3 +1,3 @@
-(()=>{var e,t={142:(e,t,a)=>{"use strict";const r=window.wp.element,n=window.React,l=window.wp.apiFetch;var i=a.n(l);const o=window.wp.url,c=window.wp.i18n;var s=a(184),p=a.n(s);function u({active:e,children:t,page:a,pageClick:n,className:l}){const i=p()("wp-block activitypub-pager",l,{current:e});return(0,r.createElement)("a",{className:i,onClick:t=>{t.preventDefault(),!e&&n(a)}},t)}const m={outlined:"outlined",minimal:"minimal"};function f({compact:e,nextLabel:t,page:a,pageClick:n,perPage:l,prevLabel:i,total:o,variant:c=m.outlined}){const s=((e,t)=>{let a=[1,e-2,e-1,e,e+1,e+2,t];a.sort(((e,t)=>e-t)),a=a.filter(((e,a,r)=>e>=1&&e<=t&&r.lastIndexOf(e)===a));for(let e=a.length-2;e>=0;e--)a[e]===a[e+1]&&a.splice(e+1,1);return a})(a,Math.ceil(o/l)),f=p()("alignwide wp-block-query-pagination is-content-justification-space-between is-layout-flex wp-block-query-pagination-is-layout-flex",`is-${c}`,{"is-compact":e});return(0,r.createElement)("nav",{className:f},i&&(0,r.createElement)(u,{key:"prev",page:a-1,pageClick:n,active:1===a,"aria-label":i,className:"wp-block-query-pagination-previous block-editor-block-list__block"},i),!e&&(0,r.createElement)("div",{className:"block-editor-block-list__block wp-block wp-block-query-pagination-numbers"},s.map((e=>(0,r.createElement)(u,{key:e,page:e,pageClick:n,active:e===a,className:"page-numbers"},e)))),t&&(0,r.createElement)(u,{key:"next",page:a+1,pageClick:n,active:a===Math.ceil(o/l),"aria-label":t,className:"wp-block-query-pagination-next block-editor-block-list__block"},t))}const v=window.wp.components,{namespace:d}=window._activityPubOptions;function b({selectedUser:e,per_page:t,order:a,title:l,page:s,setPage:p,className:u="",followLinks:m=!0,followerData:v=!1}){const b="site"===e?0:e,[g,k]=(0,n.useState)([]),[y,h]=(0,n.useState)(0),[E,x]=(0,n.useState)(0),[_,O]=function(){const[e,t]=(0,n.useState)(1);return[e,t]}(),N=s||_,S=p||O,C=(0,r.createInterpolateElement)(/* translators: arrow for previous followers link */
-(0,c.__)("<span>←</span> Less","activitypub"),{span:(0,r.createElement)("span",{class:"wp-block-query-pagination-previous-arrow is-arrow-arrow","aria-hidden":"true"})}),L=(0,r.createInterpolateElement)(/* translators: arrow for next followers link */
-(0,c.__)("More <span>→</span>","activitypub"),{span:(0,r.createElement)("span",{class:"wp-block-query-pagination-next-arrow is-arrow-arrow","aria-hidden":"true"})}),j=(e,a)=>{k(e),x(a),h(Math.ceil(a/t))};return(0,n.useEffect)((()=>{if(v&&1===N)return j(v.followers,v.total);const e=function(e,t,a,r){const n=`/${d}/users/${e}/followers`,l={per_page:t,order:a,page:r,context:"full"};return(0,o.addQueryArgs)(n,l)}(b,t,a,N);i()({path:e}).then((e=>j(e.orderedItems,e.totalItems))).catch((()=>{}))}),[b,t,a,N,v]),(0,r.createElement)("div",{className:"activitypub-follower-block "+u},(0,r.createElement)("h3",null,l),(0,r.createElement)("ul",null,g&&g.map((e=>(0,r.createElement)("li",{key:e.url},(0,r.createElement)(w,{...e,followLinks:m}))))),y>1&&(0,r.createElement)(f,{page:N,perPage:t,total:E,pageClick:S,nextLabel:L,prevLabel:C,compact:"is-style-compact"===u}))}function w({name:e,icon:t,url:a,preferredUsername:n,followLinks:l=!0}){const i=`@${n}`,o={};return l||(o.onClick=e=>e.preventDefault()),(0,r.createElement)(v.ExternalLink,{className:"activitypub-link",href:a,title:i,...o},(0,r.createElement)("img",{width:"40",height:"40",src:t.url,class:"avatar activitypub-avatar",alt:e}),(0,r.createElement)("span",{class:"activitypub-actor"},(0,r.createElement)("strong",{className:"activitypub-name"},e),(0,r.createElement)("span",{class:"sep"},"/"),(0,r.createElement)("span",{class:"activitypub-handle"},i)))}const g=window.wp.domReady;a.n(g)()((()=>{[].forEach.call(document.querySelectorAll(".activitypub-follower-block"),(e=>{const t=JSON.parse(e.dataset.attrs);(0,r.render)((0,r.createElement)(b,{...t}),e)}))}))},184:(e,t)=>{var a;!function(){"use strict";var r={}.hasOwnProperty;function n(){for(var e=[],t=0;t<arguments.length;t++){var a=arguments[t];if(a){var l=typeof a;if("string"===l||"number"===l)e.push(a);else if(Array.isArray(a)){if(a.length){var i=n.apply(null,a);i&&e.push(i)}}else if("object"===l){if(a.toString!==Object.prototype.toString&&!a.toString.toString().includes("[native code]")){e.push(a.toString());continue}for(var o in a)r.call(a,o)&&a[o]&&e.push(o)}}}return e.join(" ")}e.exports?(n.default=n,e.exports=n):void 0===(a=function(){return n}.apply(t,[]))||(e.exports=a)}()}},a={};function r(e){var n=a[e];if(void 0!==n)return n.exports;var l=a[e]={exports:{}};return t[e](l,l.exports,r),l.exports}r.m=t,e=[],r.O=(t,a,n,l)=>{if(!a){var i=1/0;for(p=0;p<e.length;p++){a=e[p][0],n=e[p][1],l=e[p][2];for(var o=!0,c=0;c<a.length;c++)(!1&l||i>=l)&&Object.keys(r.O).every((e=>r.O[e](a[c])))?a.splice(c--,1):(o=!1,l<i&&(i=l));if(o){e.splice(p--,1);var s=n();void 0!==s&&(t=s)}}return t}l=l||0;for(var p=e.length;p>0&&e[p-1][2]>l;p--)e[p]=e[p-1];e[p]=[a,n,l]},r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var a in t)r.o(t,a)&&!r.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={638:0,962:0};r.O.j=t=>0===e[t];var t=(t,a)=>{var n,l,i=a[0],o=a[1],c=a[2],s=0;if(i.some((t=>0!==e[t]))){for(n in o)r.o(o,n)&&(r.m[n]=o[n]);if(c)var p=c(r)}for(t&&t(a);s<i.length;s++)l=i[s],r.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return r.O(p)},a=self.webpackChunkwordpress_activitypub=self.webpackChunkwordpress_activitypub||[];a.forEach(t.bind(null,0)),a.push=t.bind(null,a.push.bind(a))})();var n=r.O(void 0,[962],(()=>r(142)));n=r.O(n)})();
\ No newline at end of file
+(()=>{var e,t={250:(e,t,a)=>{"use strict";const r=window.React,n=window.wp.apiFetch;var l=a.n(n);const o=window.wp.url,i=window.wp.element,c=window.wp.i18n;var s=a(942),p=a.n(s);function u({active:e,children:t,page:a,pageClick:n,className:l}){const o=p()("wp-block activitypub-pager",l,{current:e});return(0,r.createElement)("a",{className:o,onClick:t=>{t.preventDefault(),!e&&n(a)}},t)}const m={outlined:"outlined",minimal:"minimal"};function f({compact:e,nextLabel:t,page:a,pageClick:n,perPage:l,prevLabel:o,total:i,variant:c=m.outlined}){const s=((e,t)=>{let a=[1,e-2,e-1,e,e+1,e+2,t];a.sort(((e,t)=>e-t)),a=a.filter(((e,a,r)=>e>=1&&e<=t&&r.lastIndexOf(e)===a));for(let e=a.length-2;e>=0;e--)a[e]===a[e+1]&&a.splice(e+1,1);return a})(a,Math.ceil(i/l)),f=p()("alignwide wp-block-query-pagination is-content-justification-space-between is-layout-flex wp-block-query-pagination-is-layout-flex",`is-${c}`,{"is-compact":e});return(0,r.createElement)("nav",{className:f},o&&(0,r.createElement)(u,{key:"prev",page:a-1,pageClick:n,active:1===a,"aria-label":o,className:"wp-block-query-pagination-previous block-editor-block-list__block"},o),!e&&(0,r.createElement)("div",{className:"block-editor-block-list__block wp-block wp-block-query-pagination-numbers"},s.map((e=>(0,r.createElement)(u,{key:e,page:e,pageClick:n,active:e===a,className:"page-numbers"},e)))),t&&(0,r.createElement)(u,{key:"next",page:a+1,pageClick:n,active:a===Math.ceil(i/l),"aria-label":t,className:"wp-block-query-pagination-next block-editor-block-list__block"},t))}const v=window.wp.components,{namespace:b}=window._activityPubOptions;function d({selectedUser:e,per_page:t,order:a,title:n,page:s,setPage:p,className:u="",followLinks:m=!0,followerData:v=!1}){const d="site"===e?0:e,[g,y]=(0,r.useState)([]),[k,h]=(0,r.useState)(0),[E,x]=(0,r.useState)(0),[_,O]=function(){const[e,t]=(0,r.useState)(1);return[e,t]}(),N=s||_,S=p||O,C=(0,i.createInterpolateElement)(/* translators: arrow for previous followers link */ /* translators: arrow for previous followers link */
+(0,c.__)("<span>←</span> Less","activitypub"),{span:(0,r.createElement)("span",{class:"wp-block-query-pagination-previous-arrow is-arrow-arrow","aria-hidden":"true"})}),L=(0,i.createInterpolateElement)(/* translators: arrow for next followers link */ /* translators: arrow for next followers link */
+(0,c.__)("More <span>→</span>","activitypub"),{span:(0,r.createElement)("span",{class:"wp-block-query-pagination-next-arrow is-arrow-arrow","aria-hidden":"true"})}),q=(e,a)=>{y(e),x(a),h(Math.ceil(a/t))};return(0,r.useEffect)((()=>{if(v&&1===N)return q(v.followers,v.total);const e=function(e,t,a,r){const n=`/${b}/users/${e}/followers`,l={per_page:t,order:a,page:r,context:"full"};return(0,o.addQueryArgs)(n,l)}(d,t,a,N);l()({path:e}).then((e=>q(e.orderedItems,e.totalItems))).catch((()=>{}))}),[d,t,a,N,v]),(0,r.createElement)("div",{className:"activitypub-follower-block "+u},(0,r.createElement)("h3",null,n),(0,r.createElement)("ul",null,g&&g.map((e=>(0,r.createElement)("li",{key:e.url},(0,r.createElement)(w,{...e,followLinks:m}))))),k>1&&(0,r.createElement)(f,{page:N,perPage:t,total:E,pageClick:S,nextLabel:L,prevLabel:C,compact:"is-style-compact"===u}))}function w({name:e,icon:t,url:a,preferredUsername:n,followLinks:l=!0}){const o=`@${n}`,i={};return l||(i.onClick=e=>e.preventDefault()),(0,r.createElement)(v.ExternalLink,{className:"activitypub-link",href:a,title:o,...i},(0,r.createElement)("img",{width:"40",height:"40",src:t.url,class:"avatar activitypub-avatar",alt:e}),(0,r.createElement)("span",{class:"activitypub-actor"},(0,r.createElement)("strong",{className:"activitypub-name"},e),(0,r.createElement)("span",{class:"sep"},"/"),(0,r.createElement)("span",{class:"activitypub-handle"},o)))}const g=window.wp.domReady;a.n(g)()((()=>{[].forEach.call(document.querySelectorAll(".activitypub-follower-block"),(e=>{const t=JSON.parse(e.dataset.attrs);(0,i.render)((0,r.createElement)(d,{...t}),e)}))}))},942:(e,t)=>{var a;!function(){"use strict";var r={}.hasOwnProperty;function n(){for(var e="",t=0;t<arguments.length;t++){var a=arguments[t];a&&(e=o(e,l(a)))}return e}function l(e){if("string"==typeof e||"number"==typeof e)return e;if("object"!=typeof e)return"";if(Array.isArray(e))return n.apply(null,e);if(e.toString!==Object.prototype.toString&&!e.toString.toString().includes("[native code]"))return e.toString();var t="";for(var a in e)r.call(e,a)&&e[a]&&(t=o(t,a));return t}function o(e,t){return t?e?e+" "+t:e+t:e}e.exports?(n.default=n,e.exports=n):void 0===(a=function(){return n}.apply(t,[]))||(e.exports=a)}()}},a={};function r(e){var n=a[e];if(void 0!==n)return n.exports;var l=a[e]={exports:{}};return t[e](l,l.exports,r),l.exports}r.m=t,e=[],r.O=(t,a,n,l)=>{if(!a){var o=1/0;for(p=0;p<e.length;p++){for(var[a,n,l]=e[p],i=!0,c=0;c<a.length;c++)(!1&l||o>=l)&&Object.keys(r.O).every((e=>r.O[e](a[c])))?a.splice(c--,1):(i=!1,l<o&&(o=l));if(i){e.splice(p--,1);var s=n();void 0!==s&&(t=s)}}return t}l=l||0;for(var p=e.length;p>0&&e[p-1][2]>l;p--)e[p]=e[p-1];e[p]=[a,n,l]},r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var a in t)r.o(t,a)&&!r.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={996:0,528:0};r.O.j=t=>0===e[t];var t=(t,a)=>{var n,l,[o,i,c]=a,s=0;if(o.some((t=>0!==e[t]))){for(n in i)r.o(i,n)&&(r.m[n]=i[n]);if(c)var p=c(r)}for(t&&t(a);s<o.length;s++)l=o[s],r.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return r.O(p)},a=globalThis.webpackChunkwordpress_activitypub=globalThis.webpackChunkwordpress_activitypub||[];a.forEach(t.bind(null,0)),a.push=t.bind(null,a.push.bind(a))})();var n=r.O(void 0,[528],(()=>r(250)));n=r.O(n)})();
\ No newline at end of file
diff --git a/build/remote-reply/index.asset.php b/build/remote-reply/index.asset.php
index 0e5d8d1a..31d03481 100644
--- a/build/remote-reply/index.asset.php
+++ b/build/remote-reply/index.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('wp-api-fetch', 'wp-components', 'wp-compose', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '0235743f089d22122d70');
+<?php return array('dependencies' => array('react', 'wp-api-fetch', 'wp-components', 'wp-compose', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-primitives'), 'version' => '9aee45886ecf2680fbd4');
diff --git a/build/remote-reply/index.js b/build/remote-reply/index.js
index fa6d0e65..5373b0fa 100644
--- a/build/remote-reply/index.js
+++ b/build/remote-reply/index.js
@@ -1 +1 @@
-(()=>{"use strict";var e,t={664:(e,t,n)=>{const o=window.wp.element,a=window.wp.domReady;var i=n.n(a);const r=window.wp.apiFetch;var c=n.n(r);const l=window.wp.components,u=window.wp.i18n,s=window.wp.primitives,p=(0,o.createElement)(s.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,o.createElement)(s.Path,{d:"M20.2 8v11c0 .7-.6 1.2-1.2 1.2H6v1.5h13c1.5 0 2.7-1.2 2.7-2.8V8zM18 16.4V4.6c0-.9-.7-1.6-1.6-1.6H4.6C3.7 3 3 3.7 3 4.6v11.8c0 .9.7 1.6 1.6 1.6h11.8c.9 0 1.6-.7 1.6-1.6zm-13.5 0V4.6c0-.1.1-.1.1-.1h11.8c.1 0 .1.1.1.1v11.8c0 .1-.1.1-.1.1H4.6l-.1-.1z"})),m=(0,o.createElement)(s.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,o.createElement)(s.Path,{d:"M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"})),d=function({icon:e,size:t=24,...n}){return(0,o.cloneElement)(e,{width:t,height:t,...n})},v=window.wp.compose,{namespace:y}=window._activityPubOptions;function _(e){try{return new URL(e),!0}catch(e){return!1}}function w({selectedComment:e,commentId:t}){const n=(0,u.__)("Reply","activitypub"),a=(0,u.__)("Loading...","activitypub"),i=(0,u.__)("Opening...","activitypub"),r=(0,u.__)("Error","activitypub"),s=(0,u.__)("Invalid","activitypub"),[w,b]=(0,o.useState)(n),[h,f]=(0,o.useState)(p),E=(0,v.useCopyToClipboard)(e,(()=>{f(m),setTimeout((()=>f(p)),1e3)})),[g,C]=(0,o.useState)(""),O=(0,o.useCallback)((()=>{let e;if(!_(g)&&!function(e){const t=e.replace(/^@/,"").split("@");return 2===t.length&&_(`https://${t[1]}`)}(g))return b(s),e=setTimeout((()=>b(n)),2e3),()=>clearTimeout(e);const o=`/${y}/comments/${t}/remote-reply?resource=${g}`;b(a),c()({path:o}).then((({url:e})=>{b(i),setTimeout((()=>{window.open(e,"_blank"),b(n)}),200)})).catch((()=>{b(r),setTimeout((()=>b(n)),2e3)}))}),[g]);return(0,o.createElement)("div",{className:"activitypub__dialog"},(0,o.createElement)("div",{className:"activitypub-dialog__section"},(0,o.createElement)("h4",null,(0,u.__)("The Comment-URL","activitypub")),(0,o.createElement)("div",{className:"activitypub-dialog__description"},(0,u.__)("Copy and paste the Comment-URL into the search field of your favorite fediverse app or server to reply to this Comment.","activitypub")),(0,o.createElement)("div",{className:"activitypub-dialog__button-group"},(0,o.createElement)("input",{type:"text",value:e,readOnly:!0}),(0,o.createElement)(l.Button,{ref:E},(0,o.createElement)(d,{icon:h}),(0,u.__)("Copy","activitypub")))),(0,o.createElement)("div",{className:"activitypub-dialog__section"},(0,o.createElement)("h4",null,(0,u.__)("Your Profile","activitypub")),(0,o.createElement)("div",{className:"activitypub-dialog__description"},(0,o.createInterpolateElement)((0,u.__)("Or, if you know your own profile, we can start things that way! (eg <code>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)","activitypub"),{code:(0,o.createElement)("code",null)})),(0,o.createElement)("div",{className:"activitypub-dialog__button-group"},(0,o.createElement)("input",{type:"text",value:g,onKeyDown:e=>{"Enter"===e?.code&&O()},onChange:e=>C(e.target.value)}),(0,o.createElement)(l.Button,{onClick:O},w))))}function b({selectedComment:e,commentId:t}){const[n,a]=(0,o.useState)(!1),i=(0,u.__)("Remote Reply","activitypub");return(0,o.createElement)(o.Fragment,null,(0,o.createElement)(l.Button,{isLink:!0,className:"comment-reply-link activitypub-remote-reply__button",onClick:()=>a(!0)},(0,u.__)("Reply on the Fediverse","activitypub")),n&&(0,o.createElement)(l.Modal,{className:"activitypub-remote-reply__modal activitypub__modal",onRequestClose:()=>a(!1),title:i},(0,o.createElement)(w,{selectedComment:e,commentId:t})))}let h=1;i()((()=>{[].forEach.call(document.querySelectorAll(".activitypub-remote-reply"),(e=>{const t=JSON.parse(e.dataset.attrs);(0,o.createRoot)(e).render((0,o.createElement)(b,{...t,id:"activitypub-remote-reply-link-"+h++,useId:!0}))}))}))}},n={};function o(e){var a=n[e];if(void 0!==a)return a.exports;var i=n[e]={exports:{}};return t[e](i,i.exports,o),i.exports}o.m=t,e=[],o.O=(t,n,a,i)=>{if(!n){var r=1/0;for(s=0;s<e.length;s++){n=e[s][0],a=e[s][1],i=e[s][2];for(var c=!0,l=0;l<n.length;l++)(!1&i||r>=i)&&Object.keys(o.O).every((e=>o.O[e](n[l])))?n.splice(l--,1):(c=!1,i<r&&(r=i));if(c){e.splice(s--,1);var u=a();void 0!==u&&(t=u)}}return t}i=i||0;for(var s=e.length;s>0&&e[s-1][2]>i;s--)e[s]=e[s-1];e[s]=[n,a,i]},o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={805:0,881:0};o.O.j=t=>0===e[t];var t=(t,n)=>{var a,i,r=n[0],c=n[1],l=n[2],u=0;if(r.some((t=>0!==e[t]))){for(a in c)o.o(c,a)&&(o.m[a]=c[a]);if(l)var s=l(o)}for(t&&t(n);u<r.length;u++)i=r[u],o.o(e,i)&&e[i]&&e[i][0](),e[i]=0;return o.O(s)},n=self.webpackChunkwordpress_activitypub=self.webpackChunkwordpress_activitypub||[];n.forEach(t.bind(null,0)),n.push=t.bind(null,n.push.bind(n))})();var a=o.O(void 0,[881],(()=>o(664)));a=o.O(a)})();
\ No newline at end of file
+(()=>{"use strict";var e,t={202:(e,t,a)=>{const n=window.React,o=window.wp.element,r=window.wp.domReady;var i=a.n(r);const c=window.wp.components,l=window.wp.i18n,u=window.wp.apiFetch;var s=a.n(u);const p=window.wp.primitives,m=(0,n.createElement)(p.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,n.createElement)(p.Path,{fillRule:"evenodd",clipRule:"evenodd",d:"M5 4.5h11a.5.5 0 0 1 .5.5v11a.5.5 0 0 1-.5.5H5a.5.5 0 0 1-.5-.5V5a.5.5 0 0 1 .5-.5ZM3 5a2 2 0 0 1 2-2h11a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5Zm17 3v10.75c0 .69-.56 1.25-1.25 1.25H6v1.5h12.75a2.75 2.75 0 0 0 2.75-2.75V8H20Z"})),d=(0,n.createElement)(p.SVG,{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},(0,n.createElement)(p.Path,{d:"M16.7 7.1l-6.3 8.5-3.3-2.5-.9 1.2 4.5 3.4L17.9 8z"})),v=(0,o.forwardRef)((function({icon:e,size:t=24,...a},n){return(0,o.cloneElement)(e,{width:t,height:t,...a,ref:n})})),y=window.wp.compose;function w(e){try{return new URL(e),!0}catch(e){return!1}}function _({actionText:e,copyDescription:t,handle:a,resourceUrl:r}){const i=(0,l.__)("Loading...","activitypub"),u=(0,l.__)("Opening...","activitypub"),p=(0,l.__)("Error","activitypub"),_=(0,l.__)("Invalid","activitypub"),[b,h]=(0,o.useState)(e),[f,E]=(0,o.useState)(m),g=(0,y.useCopyToClipboard)(a,(()=>{E(d),setTimeout((()=>E(m)),1e3)})),[O,C]=(0,o.useState)(""),x=(0,o.useCallback)((()=>{let t;if(!w(O)&&!function(e){const t=e.replace(/^@/,"").split("@");return 2===t.length&&w(`https://${t[1]}`)}(O))return h(_),t=setTimeout((()=>h(e)),2e3),()=>clearTimeout(t);const a=r+O;h(i),s()({path:a}).then((({url:t})=>{h(u),setTimeout((()=>{window.open(t,"_blank"),h(e)}),200)})).catch((()=>{h(p),setTimeout((()=>h(e)),2e3)}))}),[O]);return(0,n.createElement)("div",{className:"activitypub__dialog"},(0,n.createElement)("div",{className:"activitypub-dialog__section"},(0,n.createElement)("h4",null,(0,l.__)("My Profile","activitypub")),(0,n.createElement)("div",{className:"activitypub-dialog-description"},t),(0,n.createElement)("div",{className:"activitypub-dialog__button-group"},(0,n.createElement)("input",{type:"text",value:a,readOnly:!0}),(0,n.createElement)(c.Button,{ref:g},(0,n.createElement)(v,{icon:f}),(0,l.__)("Copy","activitypub")))),(0,n.createElement)("div",{className:"activitypub-dialog__section"},(0,n.createElement)("h4",null,(0,l.__)("Your Profile","activitypub")),(0,n.createElement)("div",{className:"activitypub-dialog__description"},(0,o.createInterpolateElement)((0,l.__)("Or, if you know your own profile, we can start things that way! (eg <code>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)","activitypub"),{code:(0,n.createElement)("code",null)})),(0,n.createElement)("div",{className:"activitypub-dialog__button-group"},(0,n.createElement)("input",{type:"text",value:O,onKeyDown:e=>{"Enter"===e?.code&&x()},onChange:e=>C(e.target.value)}),(0,n.createElement)(c.Button,{onClick:x},b))))}const{namespace:b}=window._activityPubOptions;function h({selectedComment:e,commentId:t}){const a=(0,l.__)("Reply","activitypub"),o=`/${b}/comments/${t}/remote-reply?resource=`,r=(0,l.__)("Copy and paste the Comment URL into the search field of your favorite fediverse app or server.","activitypub");return(0,n.createElement)(_,{actionText:a,copyDescription:r,handle:e,resourceUrl:o})}function f({selectedComment:e,commentId:t}){const[a,r]=(0,o.useState)(!1),i=(0,l.__)("Remote Reply","activitypub");return(0,n.createElement)(n.Fragment,null,(0,n.createElement)(c.Button,{isLink:!0,className:"comment-reply-link activitypub-remote-reply__button",onClick:()=>r(!0)},(0,l.__)("Reply on the Fediverse","activitypub")),a&&(0,n.createElement)(c.Modal,{className:"activitypub-remote-reply__modal activitypub__modal",onRequestClose:()=>r(!1),title:i},(0,n.createElement)(h,{selectedComment:e,commentId:t})))}let E=1;i()((()=>{[].forEach.call(document.querySelectorAll(".activitypub-remote-reply"),(e=>{const t=JSON.parse(e.dataset.attrs);(0,o.createRoot)(e).render((0,n.createElement)(f,{...t,id:"activitypub-remote-reply-link-"+E++,useId:!0}))}))}))}},a={};function n(e){var o=a[e];if(void 0!==o)return o.exports;var r=a[e]={exports:{}};return t[e](r,r.exports,n),r.exports}n.m=t,e=[],n.O=(t,a,o,r)=>{if(!a){var i=1/0;for(s=0;s<e.length;s++){for(var[a,o,r]=e[s],c=!0,l=0;l<a.length;l++)(!1&r||i>=r)&&Object.keys(n.O).every((e=>n.O[e](a[l])))?a.splice(l--,1):(c=!1,r<i&&(i=r));if(c){e.splice(s--,1);var u=o();void 0!==u&&(t=u)}}return t}r=r||0;for(var s=e.length;s>0&&e[s-1][2]>r;s--)e[s]=e[s-1];e[s]=[a,o,r]},n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var a in t)n.o(t,a)&&!n.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:t[a]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={227:0,739:0};n.O.j=t=>0===e[t];var t=(t,a)=>{var o,r,[i,c,l]=a,u=0;if(i.some((t=>0!==e[t]))){for(o in c)n.o(c,o)&&(n.m[o]=c[o]);if(l)var s=l(n)}for(t&&t(a);u<i.length;u++)r=i[u],n.o(e,r)&&e[r]&&e[r][0](),e[r]=0;return n.O(s)},a=globalThis.webpackChunkwordpress_activitypub=globalThis.webpackChunkwordpress_activitypub||[];a.forEach(t.bind(null,0)),a.push=t.bind(null,a.push.bind(a))})();var o=n.O(void 0,[739],(()=>n(202)));o=n.O(o)})();
\ No newline at end of file
diff --git a/src/follow-me/block.json b/src/follow-me/block.json
index fba3a2f0..9e679e07 100644
--- a/src/follow-me/block.json
+++ b/src/follow-me/block.json
@@ -40,5 +40,5 @@
 	},
 	"editorScript": "file:./index.js",
 	"viewScript": "file:./view.js",
-	"style": ["file:./style-index.css", "wp-components"]
+	"style": ["file:./style-view.css", "wp-components"]
 }
\ No newline at end of file
diff --git a/src/follow-me/follow-me.js b/src/follow-me/follow-me.js
index a8f2bc28..62022f4d 100644
--- a/src/follow-me/follow-me.js
+++ b/src/follow-me/follow-me.js
@@ -1,11 +1,10 @@
 
 import apiFetch from '@wordpress/api-fetch';
-import { useCallback, useEffect, useState, createInterpolateElement } from '@wordpress/element';
+import { useEffect, useState } from '@wordpress/element';
 import { Button, Modal } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
-import { copy, check, Icon } from '@wordpress/icons';
-import { useCopyToClipboard } from '@wordpress/compose';
 import { ButtonStyle, getPopupStyles } from './button-style';
+import { Dialog } from '../shared/dialog';
 import './style.scss';
 const { namespace } = window._activityPubOptions;
 
@@ -62,7 +61,7 @@ function Follow( { profile, popupStyles, userId } ) {
 				onRequestClose={ () => setIsOpen( false ) }
 				title={ title }
 				>
-					<Dialog profile={ profile } userId={ userId } />
+					<DialogFollow profile={ profile } userId={ userId } />
 					<style>{ popupStyles }</style>
 			</Modal>
 			) }
@@ -70,91 +69,18 @@ function Follow( { profile, popupStyles, userId } ) {
 	);
 }
 
-function isUrl( string ) {
-	try {
-		new URL( string );
-		return true;
-	} catch ( _ ) {
-		return false;
-	}
-}
-
-function isHandle( string ) {
-	// remove leading @, there should still be an @ in there
-	const parts = string.replace( /^@/, '' ).split( '@' );
-	return parts.length === 2 && isUrl( `https://${ parts[ 1 ] }` );
-}
-
-function Dialog( { profile, userId } ) {
+function DialogFollow( { profile, userId } ) {
 	const { webfinger } = profile;
-	const followText = __( 'Follow', 'activitypub' );
-	const loadingText = __( 'Loading...', 'activitypub' );
-	const openingText = __( 'Opening...', 'activitypub' );
-	const errorText = __( 'Error', 'activitypub' );
-	const invalidText = __( 'Invalid', 'activitypub' );
-	const [ buttonText, setButtonText ] = useState( followText );
-	const [ buttonIcon, setButtonIcon ] = useState( copy );
-	const ref = useCopyToClipboard( webfinger, () => {
-		setButtonIcon( check );
-		setTimeout( () => setButtonIcon( copy ), 1000 );
-	} );
-	const [ remoteProfile, setRemoteProfile ] = useState( '' );
-	const retrieveAndFollow = useCallback( () => {
-		let timeout;
-		if ( ! ( isUrl( remoteProfile ) || isHandle( remoteProfile ) ) ) {
-			setButtonText( invalidText );
-			timeout = setTimeout( () => setButtonText( followText ), 2000 );
-			return () => clearTimeout( timeout );
-		}
-		const path = `/${ namespace }/users/${userId}/remote-follow?resource=${ remoteProfile }`;
-		setButtonText( loadingText );
-		apiFetch( { path } ).then( ( { url } ) => {
-			setButtonText( openingText );
-			setTimeout( () => {
-				window.open( url, '_blank' );
-				setButtonText( followText );
-			}, 200 );
-		} ).catch( () => {
-			setButtonText( errorText );
-			setTimeout( () => setButtonText( followText ), 2000 );
-		} );
-	}, [ remoteProfile ] );
+	const actionText = __( 'Follow', 'activitypub' );
+	const resourceUrl = `/${ namespace }/users/${userId}/remote-follow?resource=`;
+	const copyDescription = __( 'Copy and paste my profile into the search field of your favorite fediverse app or server.', 'activitypub' );
 
-	return (
-		<div className="activitypub__dialog">
-			<div className="activitypub-dialog__section">
-				<h4>{ __( 'My Profile', 'activitypub' ) }</h4>
-				<div className="activitypub-dialog-description">
-					{ __( 'Copy and paste my profile into the search field of your favorite fediverse app or server.', 'activitypub' ) }
-				</div>
-				<div className="activitypub-dialog__button-group">
-					<input type="text" value={ webfinger } readOnly />
-					<Button ref={ ref }>
-						<Icon icon={ buttonIcon } />
-						{ __( 'Copy', 'activitypub' ) }
-					</Button>
-				</div>
-			</div>
-			<div className="activitypub-dialog__section">
-				<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>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)', 'activitypub' ),
-						{ code: <code /> }
-					) }
-				</div>
-				<div className="activitypub-dialog__button-group">
-					<input
-						type="text"
-						value={ remoteProfile }
-						onKeyDown={ ( event ) => { event?.code === 'Enter' && retrieveAndFollow() } }
-						onChange={ e => setRemoteProfile( e.target.value ) }
-					/>
-					<Button onClick={ retrieveAndFollow }>{ buttonText }</Button>
-				</div>
-			</div>
-		</div>
-	);
+	return <Dialog
+		actionText={ actionText }
+		copyDescription={ copyDescription }
+		handle={ webfinger }
+		resourceUrl={ resourceUrl }
+	/>;
 }
 
 export default function FollowMe( { selectedUser, style, backgroundColor, id, useId = false, profileData = false } ) {
diff --git a/src/follow-me/style.scss b/src/follow-me/style.scss
index 25038d5b..49611b21 100644
--- a/src/follow-me/style.scss
+++ b/src/follow-me/style.scss
@@ -1,3 +1,5 @@
+@import '../shared/lightbox';
+
 .activitypub-follow-me-block-wrapper {
 	width: 100%;
 
@@ -44,5 +46,3 @@
 		}
 	}
 }
-
-@import "./../shared/lightbox.scss";
diff --git a/src/remote-reply/remote-reply.js b/src/remote-reply/remote-reply.js
index e90dd153..2132203a 100644
--- a/src/remote-reply/remote-reply.js
+++ b/src/remote-reply/remote-reply.js
@@ -1,97 +1,22 @@
-import apiFetch from '@wordpress/api-fetch';
-import { useCallback, useEffect, useState, createInterpolateElement } from '@wordpress/element';
+import { useState } from '@wordpress/element';
 import { Button, Modal } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
-import { copy, check, Icon } from '@wordpress/icons';
-import { useCopyToClipboard } from '@wordpress/compose';
+import { Dialog } from '../shared/dialog';
 import './style.scss';
 const { namespace } = window._activityPubOptions;
 
-function isUrl( string ) {
-	try {
-		new URL( string );
-		return true;
-	} catch ( _ ) {
-		return false;
-	}
-}
 
-function isHandle( string ) {
-	// remove leading @, there should still be an @ in there
-	const parts = string.replace( /^@/, '' ).split( '@' );
-	return parts.length === 2 && isUrl( `https://${ parts[ 1 ] }` );
-}
+function DialogReply( { selectedComment, commentId } ) {
+	const actionText = __( 'Reply', 'activitypub' );
+	const resourceUrl = `/${ namespace }/comments/${commentId}/remote-reply?resource=`;
+	const copyDescription = __( 'Copy and paste the Comment URL into the search field of your favorite fediverse app or server.', 'activitypub' );
 
-function Dialog( { selectedComment, commentId } ) {
-	const replyText = __( 'Reply', 'activitypub' );
-	const loadingText = __( 'Loading...', 'activitypub' );
-	const openingText = __( 'Opening...', 'activitypub' );
-	const errorText = __( 'Error', 'activitypub' );
-	const invalidText = __( 'Invalid', 'activitypub' );
-	const [ buttonText, setButtonText ] = useState( replyText );
-	const [ buttonIcon, setButtonIcon ] = useState( copy );
-	const ref = useCopyToClipboard( selectedComment, () => {
-		setButtonIcon( check );
-		setTimeout( () => setButtonIcon( copy ), 1000 );
-	} );
-
-	const [ remoteProfile, setRemoteProfile ] = useState( '' );
-	const retrieveAndFollow = useCallback( () => {
-		let timeout;
-		if ( ! ( isUrl( remoteProfile ) || isHandle( remoteProfile ) ) ) {
-			setButtonText( invalidText );
-			timeout = setTimeout( () => setButtonText( replyText ), 2000 );
-			return () => clearTimeout( timeout );
-		}
-		const path = `/${ namespace }/comments/${commentId}/remote-reply?resource=${ remoteProfile }`;
-		setButtonText( loadingText );
-		apiFetch( { path } ).then( ( { url } ) => {
-			setButtonText( openingText );
-			setTimeout( () => {
-				window.open( url, '_blank' );
-				setButtonText( replyText );
-			}, 200 );
-		} ).catch( () => {
-			setButtonText( errorText );
-			setTimeout( () => setButtonText( replyText ), 2000 );
-		} );
-	}, [ remoteProfile ] );
-
-	return (
-		<div className="activitypub__dialog">
-			<div className="activitypub-dialog__section">
-				<h4>{ __( 'The Comment-URL', 'activitypub' ) }</h4>
-				<div className="activitypub-dialog__description">
-					{ __( 'Copy and paste the Comment-URL into the search field of your favorite fediverse app or server to reply to this Comment.', 'activitypub' ) }
-				</div>
-				<div className="activitypub-dialog__button-group">
-					<input type="text" value={ selectedComment } readOnly />
-					<Button ref={ ref }>
-						<Icon icon={ buttonIcon } />
-						{ __( 'Copy', 'activitypub' ) }
-					</Button>
-				</div>
-			</div>
-			<div className="activitypub-dialog__section">
-				<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>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)', 'activitypub' ),
-						{ code: <code /> }
-					) }
-				</div>
-				<div className="activitypub-dialog__button-group">
-					<input
-						type="text"
-						value={ remoteProfile }
-						onKeyDown={ ( event ) => { event?.code === 'Enter' && retrieveAndFollow() } }
-						onChange={ e => setRemoteProfile( e.target.value ) }
-					/>
-					<Button onClick={ retrieveAndFollow }>{ buttonText }</Button>
-				</div>
-			</div>
-		</div>
-	);
+	return <Dialog
+		actionText={ actionText }
+		copyDescription={ copyDescription }
+		handle={ selectedComment }
+		resourceUrl={ resourceUrl }
+	/>;
 }
 
 export default function RemoteReply( { selectedComment, commentId } ) {
@@ -109,7 +34,7 @@ export default function RemoteReply( { selectedComment, commentId } ) {
 					onRequestClose={ () => setIsOpen( false ) }
 					title={ title }
 					>
-					<Dialog selectedComment={ selectedComment } commentId={ commentId } />
+					<DialogReply selectedComment={ selectedComment } commentId={ commentId } />
 				</Modal>
 			) }
 		</>
diff --git a/src/shared/dialog.js b/src/shared/dialog.js
new file mode 100644
index 00000000..1a302b31
--- /dev/null
+++ b/src/shared/dialog.js
@@ -0,0 +1,92 @@
+import apiFetch from '@wordpress/api-fetch';
+import { useCallback, useState, createInterpolateElement } from '@wordpress/element';
+import { __ } from '@wordpress/i18n';
+import { copy, check, Icon } from '@wordpress/icons';
+import { useCopyToClipboard } from '@wordpress/compose';
+import { Button, Modal } from '@wordpress/components';
+
+function isUrl( string ) {
+	try {
+		new URL( string );
+		return true;
+	} catch ( _ ) {
+		return false;
+	}
+}
+
+function isHandle( string ) {
+	// remove leading @, there should still be an @ in there
+	const parts = string.replace( /^@/, '' ).split( '@' );
+	return parts.length === 2 && isUrl( `https://${ parts[ 1 ] }` );
+}
+
+export function Dialog( { actionText, copyDescription, handle, resourceUrl } ) {
+	const loadingText = __( 'Loading...', 'activitypub' );
+	const openingText = __( 'Opening...', 'activitypub' );
+	const errorText = __( 'Error', 'activitypub' );
+	const invalidText = __( 'Invalid', 'activitypub' );
+	const [ buttonText, setButtonText ] = useState( actionText );
+	const [ buttonIcon, setButtonIcon ] = useState( copy );
+	const ref = useCopyToClipboard( handle, () => {
+		setButtonIcon( check );
+		setTimeout( () => setButtonIcon( copy ), 1000 );
+	} );
+	const [ remoteProfile, setRemoteProfile ] = useState( '' );
+	const retrieveAndFollow = useCallback( () => {
+		let timeout;
+		if ( ! ( isUrl( remoteProfile ) || isHandle( remoteProfile ) ) ) {
+			setButtonText( invalidText );
+			timeout = setTimeout( () => setButtonText( actionText ), 2000 );
+			return () => clearTimeout( timeout );
+		}
+		// use the resourceUrl
+		const path = resourceUrl + remoteProfile;
+		setButtonText( loadingText );
+		apiFetch( { path } ).then( ( { url } ) => {
+			setButtonText( openingText );
+			setTimeout( () => {
+				window.open( url, '_blank' );
+				setButtonText( actionText );
+			}, 200 );
+		} ).catch( () => {
+			setButtonText( errorText );
+			setTimeout( () => setButtonText( actionText ), 2000 );
+		} );
+	}, [ remoteProfile ] );
+
+	return (
+		<div className="activitypub__dialog">
+			<div className="activitypub-dialog__section">
+				<h4>{ __( 'My Profile', 'activitypub' ) }</h4>
+				<div className="activitypub-dialog-description">
+					{ copyDescription }
+				</div>
+				<div className="activitypub-dialog__button-group">
+					<input type="text" value={ handle } readOnly />
+					<Button ref={ ref }>
+						<Icon icon={ buttonIcon } />
+						{ __( 'Copy', 'activitypub' ) }
+					</Button>
+				</div>
+			</div>
+			<div className="activitypub-dialog__section">
+				<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>https://example.com/yourusername</code> or <code>yourusername@example.com</code>)', 'activitypub' ),
+						{ code: <code /> }
+					) }
+				</div>
+				<div className="activitypub-dialog__button-group">
+					<input
+						type="text"
+						value={ remoteProfile }
+						onKeyDown={ ( event ) => { event?.code === 'Enter' && retrieveAndFollow() } }
+						onChange={ e => setRemoteProfile( e.target.value ) }
+					/>
+					<Button onClick={ retrieveAndFollow }>{ buttonText }</Button>
+				</div>
+			</div>
+		</div>
+	);
+}