Merge remote-tracking branch 'origin/spike-follow-by-email' into dev

# Conflicts: # go.mod # go.sum
EmissarySocial · Apr 23, 2024 · a55c709 · a55c709
2 parents eade359 + 6e62fae
commit a55c709
Show file tree

Hide file tree

Showing 51 changed files with 1,151 additions and 462 deletions.
diff --git a/_embed/emails/follower-activity.html b/_embed/emails/follower-activity.html
@@ -0,0 +1,14 @@
+{{- $object := .Activity.object -}}
+{{- $title := $object.name -}}
+{{- $content := $object.content -}}
+
+<!-- This email uses the FOLLOWER object.  It is sent to email followers when there's new activity in the outbox they're following.  -->
+<p>Hello {{.Name}},</p>
+<p>Here's the latest new post from <b>{{.Name}}</b> on <b>{{.Host}}</b>. (<a href="{{.URL}}">View in browser</a>)</p>
+<hr>
+<p><b>{{$title}}</b></p>
+<p>{{$content | html}}</p>
+<br>
+<br>
+<hr>
+<p>Click <a href="{{.ParentLink}}/follower-unsubscribe?followerId={{.FollowerID}}&secret={{.Secret}}">Unsubscribe</a> to stop receiving emails.</p>
diff --git a/_embed/emails/follower-confirmation.html b/_embed/emails/follower-confirmation.html
@@ -0,0 +1,6 @@
+<!-- This email uses the FOLLOWER object.  It is sent to people who request to be email followers  -->
+<p>Hello {{.Name}},</p>
+<p>We received a request to send you email updates from <b>{{.Actor.Name}}</b> whenever they post to <b>{{.Host}}</b>.</p>
+<p>If you would like to receive these updates, please click the link below to confirm. We cannot send you updates until you complete this step.</p>
+<p>If you did not request this, you can safely ignore this message and your email will not be added to the list.</p>
+<p><a href="{{.Actor.ProfileURL}}/follower-confirm?followerId={{.FollowerID}}&secret={{.Secret}}">Confirm Subscription</a></p>
diff --git a/_embed/templates/admin-users/template.hjson b/_embed/templates/admin-users/template.hjson
@@ -14,7 +14,7 @@
 				do: "as-modal"
 				steps: [
 					{
-						do: "add"
+						do: "edit"
 						type: "user"
 						form: {
 							type: "layout-vertical"

diff --git a/_embed/templates/base-social/follow-button.html b/_embed/templates/base-social/follow-button.html
diff --git a/_embed/templates/base-social/follow-dialog-activitypub.html b/_embed/templates/base-social/follow-dialog-activitypub.html
diff --git a/_embed/templates/base-social/follow-dialog-email.html b/_embed/templates/base-social/follow-dialog-email.html
diff --git a/_embed/templates/base-social/follow-dialog.html b/_embed/templates/base-social/follow-dialog.html
diff --git a/_embed/templates/base-social/template.hjson b/_embed/templates/base-social/template.hjson
@@ -2,6 +2,12 @@
 	templateId:"base-social"
 	actions:{
 
+		follow-button: {
+			steps: [
+				{do:"view-html"}
+			]
+		}
+
 		like-button: {
 			roles:["authenticated"]
 			steps:[

diff --git a/_embed/templates/user-outbox/follow-activitypub.html b/_embed/templates/user-outbox/follow-activitypub.html
@@ -0,0 +1,39 @@
+{{- template "follow-heading" . -}}
+
+<h3>Have an Account?</h3>
+
+<div class="margin-bottom">
+	Enter your Emissary address (or other Fediverse address) to get automatic updates on your social timeline.
+</div>
+
+<form hx-post="/.ostatus/discover" hx-target="#htmx-response-message" hx-swap="innerHTML" class="margin-bottom">
+	<div class="flex-row" style="margin-bottom:4px;">
+		<input type="hidden" name="localAccount" value="{{.ProfileURL}}"/>
+		<input type="text" name="remoteAccount" placeholder="https://yoursite.social/@yourname" autofocus autocomplete="url"/>
+		<button class="primary nowrap">Follow on<br>my site</button>
+	</div>
+	<div id="htmx-response-message" class="text-red">&nbsp;</div>
+</form>
+
+<div>
+	<h3>Need an Account?</h3>
+
+	Emissary is a private social app that you own.  Post updates to friends and family anywhere on the 
+	Fediverse or IndieWeb and say goodbye to ads and tracking.
+	<br><br>
+
+	{{- if .DomainHasSignupForm -}}
+		<a href="/register" class="primary button">Sign Up Now</a>
+		<a href="https://emissary.social/hosting" class="button">Find Another Host</a>
+		<button script="on click trigger closeModal">Cancel</button>
+
+	{{- else -}}
+		Signups on this site are closed, but you can follow {{.DisplayName}} from any other 
+		Fediverse app. Click below for a list of trustworthy providers.<br>
+		<br>
+		<a href="https://emissary.social/hosting" class="primary button" target="_blank">Find a Fediverse Host</a>
+			<button script="on click trigger closeModal">Cancel</button>
+	{{- end -}}
+</div>
+
+
diff --git a/_embed/templates/user-outbox/follow-email-sent.html b/_embed/templates/user-outbox/follow-email-sent.html
@@ -0,0 +1,19 @@
+<div class="page">
+
+	<h1>{{icon "thumbs-up"}} You're Half-Way There</h1>
+
+	<p>We've sent a subscription confirmation to your email address.</p>
+	<p>To receive updates from <b>{{.DisplayName}}</b>:</p>
+	<ol>
+		<li>Please open your email application.</li>
+		<li>Find the email from <b>{{.Hostname}}</b>.</li>
+		<li>Click the "confirm subscription" link to continue.</li>
+	</ol>
+
+	<p class="margin-top"><b>Why Click Again?</b> We double-check so you don't get unwanted emails.</p>
+
+	<p class="margin-top-lg">
+		<a class="button text-sm primary" href="/@{{.UserID}}">Continue to {{.DisplayName}} Profile {{icon "arrow-right"}}</a>
+	</p>
+
+</div>
diff --git a/_embed/templates/user-outbox/follow-email.html b/_embed/templates/user-outbox/follow-email.html
@@ -0,0 +1,31 @@
+{{- template "follow-heading" . -}}
+
+<h3>Sign Up for Email Updates</h3>
+<div class="margin-bottom">
+	Enter your name and email below, to receive updates from <b>{{.DisplayName}}</b> in your email inbox.
+</div>
+
+<form action="/.follower/new" method="post">
+
+	<input type="hidden" name="type", value="User">
+	<input type="hidden" name="parentId" value="{{.UserID}}">
+
+	<div class="layout layout-vertical">
+		<div class="layout-vertical-elements">
+			<div class="layout-vertical-element">
+				<label>Full Name</label>
+				<input type="text" name="name" required autofocus autocomplete="name">
+			</div>
+			<div class="layout-vertical-element">
+				<label>Email Address</label>
+				<input type="email" name="email" required autocomplete="email">
+			</div>
+		</div>
+	</div>
+
+	<div>
+		<button type="submit" class="primary">Follow via Email</button>
+		<button script="on click trigger closeModal">Cancel</button>
+	</div>
+
+</form>
diff --git a/_embed/templates/user-outbox/follow-heading.html b/_embed/templates/user-outbox/follow-heading.html
@@ -0,0 +1,8 @@
+<div class="flex-row flex-align-center">
+	<img src="{{.IconURL}}" class="circle-64">
+	<div>
+		<div class="text-xl margin-none">Follow {{.DisplayName}}</div>
+		<div class="text-gray"><a href="{{.ProfileURL}}">@{{.Username}}@{{.Hostname}}</a></div>
+	</div>
+</div>
+<hr>
diff --git a/_embed/templates/user-outbox/follow.html b/_embed/templates/user-outbox/follow.html
@@ -1,47 +1,23 @@
-<div class="flex-row" style="align-items:center;">
-	<img src="{{.IconURL}}" class="circle-64">
-	<div>
-		<h1 style="margin-bottom:0px">Follow {{.DisplayName}}</h1>
-		<div class="text-gray">{{.ProfileURL}}</div>
-	</div>
-</div>
-
-<hr>
-
-<h3>Have an Account?</h3>
-
-<div class="margin-bottom">
-	Enter your Emissary address (or other Fediverse address) to get automatic updates on your social timeline.
-</div>
+{{- template "follow-heading" . -}}
 
-<form hx-post="/.ostatus/discover" hx-target="#htmx-response-message" hx-swap="innerHTML" class="margin-bottom">
-	<div class="flex-row" style="margin-bottom:4px;">
-		<input type="hidden" name="localAccount" value="{{.ProfileURL}}"/>
-		<input type="text" name="remoteAccount" placeholder="https://yoursite.social/@yourname" autofocus autocomplete="url"/>
-		<button class="primary nowrap">Follow on<br>my site</button>
+<button hx-get="/@{{.UserID}}/follow-activitypub" class="flex-row width-100-percent">
+	<div class="text-3xl margin-none margin-right-sm">{{icon "activitypub"}}</div>
+	<div class="flex-grow">
+		<div class="text-lg margin-none">My Fediverse Account</div>
+		<div class="text-sm text-gray">Updates in your ActivityPub inbox (better)</div>
 	</div>
-	<div id="htmx-response-message" class="text-red">&nbsp;</div>
-</form>
-
-<div>
-	<h3>Need an Account?</h3>
-
-	Emissary is a private social app that you own.  Post updates to friends and family anywhere on the 
-	Fediverse or IndieWeb and say goodbye to ads and tracking.
-	<br><br>
-
-	{{- if .DomainHasSignupForm -}}
-		<a href="/register" class="primary button">Sign Up Now</a>
-		<a href="https://emissary.social/hosting" class="button">Find Another Host</a>
-		<button script="on click trigger closeModal">Cancel</button>
-
-	{{- else -}}
-		Signups on this site are closed, but you can follow {{.DisplayName}} from any other 
-		Fediverse app. Click below for a list of trustworthy providers.<br>
-		<br>
-		<a href="https://emissary.social/hosting" class="primary button" target="_blank">Find a Fediverse Host</a>
-			<button script="on click trigger closeModal">Cancel</button>
-	{{- end -}}
-</div>
+	<div class="text-lg">{{icon "chevron-right"}}</div>
+</button>
+
+<button hx-get="/@{{.UserID}}/follow-email" class="text-lg flex-row width-100-percent">
+	<div class="text-3xl margin-none margin-right-sm">{{icon "email"}}</div>
+	<div class="flex-grow">
+		<div class="text-lg margin-none">My Email Account</div>
+		<div class="text-sm text-gray">Updates in your email inbox</div>
+	</div>
+	<div class="text-lg">{{icon "chevron-right"}}</div>
+</button>
 
+<hr>
 
+<button script="on click trigger closeModal">Close Window</button>
diff --git a/_embed/templates/user-outbox/follower-confirm.html b/_embed/templates/user-outbox/follower-confirm.html
@@ -0,0 +1,25 @@
+{{- $follower := .Object -}}
+{{- $secret := $follower.Data.GetString "secret" -}}
+{{- $parentURL := $follower.ParentURL .Host -}}
+{{- $actor := .ActivityStream $parentURL -}}
+
+<div class="page">
+
+	<h1 class="margin-bottom-xl">{{icon "thumbs-up"}} Your Email Subscription is Confirmed</h1>
+
+	<div class="flex-row flex-align-center margin-bottom-xl">
+		<img src="{{$actor.Icon.Href}}" class="circle-64">
+		<div>
+			<div class="margin-none text-lg bold">{{$actor.Name}}</div>
+			<div class="margin-none text-gray">Receiving updates via email</div>
+		</div>
+	</div>
+
+	<p>Updates will be sent to your email inbox whenever <b>{{$actor.Name}}</b> posts.</p>
+	<p>You can <a href="{{$parentURL}}/follower-unsubscribe?followerId={{$follower.FollowerID.Hex}}&secret={{$secret}}">unsubscribe any time</a> using links in the emails you receive.</p>
+
+	<div class="margin-vertical-xl">
+		<a href="{{$parentURL}}" class="button primary">Continue to Profile Page {{icon "arrow-right"}}</a>
+	</div>
+
+</div>
diff --git a/_embed/templates/user-outbox/follower-unsubscribe.html b/_embed/templates/user-outbox/follower-unsubscribe.html
@@ -0,0 +1,25 @@
+{{- $follower := .Object -}}
+{{- $parentURL := $follower.ParentURL .Host -}}
+{{- $actor := .ActivityStream $parentURL -}}
+
+<div class="page">
+
+	<h1>{{icon "email"}} Unsubscribe from {{$actor.Name}}?</h1>
+
+	<div class="flex-row flex-align-center margin-vertical-lg">
+		<img src="{{$actor.Icon.Href}}" class="circle-64">
+		<div>
+			<div class="margin-none text-lg bold">{{$actor.Name}}</div>
+			<div class="margin-none text-gray">Receiving updates via email</div>
+		</div>
+	</div>
+
+	<div class="margin-vertical">You're currently receiving email updates whenever <b>{{$actor.Name}}</b> posts.</div>
+	<div class="margin-bottom-xl">Do you want to keep receiving updates, or cancel your email subscription?</div>
+
+	<div id="htmx-response-message">
+		<button hx-post="{{.URL}}" class="primary">Cancel Email Subscription</button>
+		<a class="button" href="/@{{.Object.ParentID.Hex}}">Keep Receiving Updates</a>
+	</div>
+
+</div>
diff --git a/_embed/templates/user-outbox/template.hjson b/_embed/templates/user-outbox/template.hjson
@@ -135,7 +135,45 @@
 		follow: {
 			steps: [
 				{do:"as-modal", background:"profile", steps:[
-					{do:"view-html", file:"follow"}
+					{do:"view-html"}
+				]}
+			]
+		}
+
+		follow-activitypub: {
+			steps: [
+				{do:"as-modal", background:"profile", steps:[
+					{do:"view-html"}
+				]}
+			]
+		}
+
+		follow-email: {
+			steps: [
+				{do:"as-modal", background:"profile", steps:[
+					{do:"view-html"}
+				]}
+			]
+		}
+
+		follow-email-sent: {do:"view-html"}
+
+		follower-confirm: {
+			steps:[
+				{do:"with-follower", steps:[
+					{do:"set-data", values:{"stateId":"ACTIVE"}}
+					{do:"save", method:"get", comment:"Email confirmed by user"}
+					{do:"view-html"}
+				]}
+			]
+		}
+
+		follower-unsubscribe: {
+			steps: [
+				{do:"with-follower", steps:[
+					{do:"view-html", file:"follower-unsubscribe"}
+					{do:"delete", method:"post", comment:"Unsubscribed from email notifications"}
+					{do:"inline-success", message:"Done.  You have been unsubscribed from email notifications."}
 				]}
 			]
 		}