Add dedicated HTML previews for posts

Author: bvisness

src/admintools/adminproject.go

@@ -34,7 +34,7 @@ func addCreateProjectCommand(projectCommand *cobra.Command) {
 			personal, _ := cmd.Flags().GetBool("personal")
 			userIDs, _ := cmd.Flags().GetIntSlice("userids")
 
-			descParsed := parsing.ParseMarkdown(description, parsing.ForumRealMarkdown)
+			descParsed := parsing.ParseMarkdown(description, parsing.PostMarkdown)
 
 			ctx := context.Background()
 			conn := db.NewConn()

src/hmndata/threads_and_posts_helper.go

@@ -829,16 +829,24 @@ func CreatePostVersion(ctx context.Context, tx pgx.Tx, postId int, unparsedConte
 		unparsedContent = unparsedContent[:maxPostContentLength-1]
 	}
 
-	parsed := parsing.ParseMarkdown(unparsedContent, parsing.ForumRealMarkdown)
-	ip := net.ParseIP(ipString)
-
-	const previewMaxLength = 100
-	parsedPlaintext := parsing.ParseMarkdown(unparsedContent, parsing.PlaintextMarkdown)
-	preview := parsedPlaintext
-	if len(preview) > previewMaxLength-1 {
-		preview = preview[:previewMaxLength-1] + "…"
+	htmlContent := parsing.ParseMarkdown(unparsedContent, parsing.PostMarkdown)
+
+	const plaintextPreviewMaxLength = 100
+	const htmlPreviewMaxLength = 600
+	var plaintextPreview, htmlPreview string
+	{
+		plaintextPreview = parsing.ParseMarkdown(unparsedContent, parsing.PlaintextMarkdown)
+		if len(plaintextPreview) > plaintextPreviewMaxLength-1 {
+			plaintextPreview = plaintextPreview[:plaintextPreviewMaxLength-1] + "…"
+		}
+	}
+	{
+		previewMD := unparsedContent[:min(htmlPreviewMaxLength, len(unparsedContent))]
+		htmlPreview = parsing.ParseMarkdown(previewMD, parsing.PostPreviewMarkdown)
 	}
 
+	ip := net.ParseIP(ipString)
+
 	// Create post version
 	err := tx.QueryRow(ctx,
 		`
@@ -849,7 +857,7 @@ func CreatePostVersion(ctx context.Context, tx pgx.Tx, postId int, unparsedConte
 		`,
 		postId,
 		unparsedContent,
-		parsed,
+		htmlContent,
 		ip,
 		time.Now(),
 		editReason,
@@ -864,11 +872,12 @@ func CreatePostVersion(ctx context.Context, tx pgx.Tx, postId int, unparsedConte
 		`
 		---- Update post to new version
 		UPDATE post
-		SET current_id = $1, preview = $2
-		WHERE id = $3
+		SET current_id = $1, preview = $2, preview_html = $3
+		WHERE id = $4
 		`,
 		versionId,
-		preview,
+		plaintextPreview,
+		htmlPreview,
 		postId,
 	)
 	if err != nil {

src/migration/migrations/2026-03-06T170958Z_AddHTMLPreview.go

@@ -0,0 +1,47 @@
+package migrations
+
+import (
+	"context"
+	"time"
+
+	"git.handmade.network/hmn/hmn/src/migration/types"
+	"github.com/jackc/pgx/v5"
+)
+
+func init() {
+	registerMigration(AddHTMLPreview{})
+}
+
+type AddHTMLPreview struct{}
+
+func (m AddHTMLPreview) Version() types.MigrationVersion {
+	return types.MigrationVersion(time.Date(2026, 3, 6, 17, 9, 58, 0, time.UTC))
+}
+
+func (m AddHTMLPreview) Name() string {
+	return "AddHTMLPreview"
+}
+
+func (m AddHTMLPreview) Description() string {
+	return "Adds an explicit HTML preview to post versions"
+}
+
+func (m AddHTMLPreview) Up(ctx context.Context, tx pgx.Tx) error {
+	_, err := tx.Exec(ctx,
+		`
+		ALTER TABLE post
+			ADD COLUMN preview_html TEXT NOT NULL DEFAULT '';
+		`,
+	)
+	return err
+}
+
+func (m AddHTMLPreview) Down(ctx context.Context, tx pgx.Tx) error {
+	_, err := tx.Exec(ctx,
+		`
+		ALTER TABLE post
+			DROP COLUMN preview_html;
+		`,
+	)
+	return err
+}

src/migration/seed.go

@@ -281,7 +281,7 @@ func seedProject(ctx context.Context, tx pgx.Tx, input models.Project, owners []
 		`,
 		utils.OrDefault(input.ID, latestProjectId+1),
 		input.Slug, input.Name, input.Blurb,
-		input.Description, parsing.ParseMarkdown(input.Description, parsing.ForumRealMarkdown),
+		input.Description, parsing.ParseMarkdown(input.Description, parsing.PostMarkdown),
 		input.Color1, input.Color2,
 		input.Featured, input.Personal, utils.OrDefault(input.Lifecycle, models.ProjectLifecycleActive), input.Hidden,
 		input.ForumEnabled, input.BlogEnabled,

src/models/post.go

@@ -19,8 +19,9 @@ type Post struct {
 	PostDate time.Time `db:"postdate"`
 	Deleted  bool      `db:"deleted"`
 
-	Preview  string `db:"preview"`
-	ReadOnly bool   `db:"readonly"`
+	PreviewPlaintext string `db:"preview"`
+	PreviewHTML      string `db:"preview_html"`
+	ReadOnly         bool   `db:"readonly"`
 }
 
 type PostVersion struct {

src/parsing/parsing.go

@@ -12,8 +12,17 @@ import (
 	"github.com/yuin/goldmark/util"
 )
 
-// Used for rendering real-time previews of post content.
-var ForumPreviewMarkdown = makeGoldmark(
+// Used for rendering HTML previews of posts across the site.
+var PostPreviewMarkdown = makeGoldmark(
+	false,
+	goldmark.WithExtensions(makeGoldmarkExtensions(MarkdownOptions{
+		Previews: true,
+		Embeds:   false,
+	})...),
+)
+
+// Used for rendering real-time previews of post content while editing.
+var PostEditPreviewMarkdown = makeGoldmark(
 	false,
 	goldmark.WithExtensions(makeGoldmarkExtensions(MarkdownOptions{
 		Previews: true,
@@ -22,7 +31,7 @@ var ForumPreviewMarkdown = makeGoldmark(
 )
 
 // Used for generating the final HTML for a post.
-var ForumRealMarkdown = makeGoldmark(
+var PostMarkdown = makeGoldmark(
 	false,
 	goldmark.WithExtensions(makeGoldmarkExtensions(MarkdownOptions{
 		Previews: false,

src/parsing/parsing_test.go

@@ -10,14 +10,14 @@ import (
 func TestMarkdown(t *testing.T) {
 	t.Run("fenced code blocks", func(t *testing.T) {
 		t.Run("multiple lines", func(t *testing.T) {
-			html := ParseMarkdown("```\nmultiple lines\n\tof code\n```", ForumRealMarkdown)
+			html := ParseMarkdown("```\nmultiple lines\n\tof code\n```", PostMarkdown)
 			t.Log(html)
 			assert.Equal(t, 1, strings.Count(html, "<pre"))
 			assert.Contains(t, html, `class="hmn-code"`)
 			assert.Contains(t, html, "multiple lines\n\tof code")
 		})
 		t.Run("multiple lines with language", func(t *testing.T) {
-			html := ParseMarkdown("```go\nfunc main() {\n\tfmt.Println(\"Hello, world!\")\n}\n```", ForumRealMarkdown)
+			html := ParseMarkdown("```go\nfunc main() {\n\tfmt.Println(\"Hello, world!\")\n}\n```", PostMarkdown)
 			t.Log(html)
 			assert.Equal(t, 1, strings.Count(html, "<pre"))
 			assert.Contains(t, html, `class="hmn-code"`)
@@ -27,10 +27,52 @@ func TestMarkdown(t *testing.T) {
 	})
 }
 
+func TestMarkdownVariants(t *testing.T) {
+	md := `
+Here's a cool image that I really like a lot.
+
+![picture of a dog](coolimage.png)
+
+And here's my favorite YouTube video:
+
+https://youtu.be/dQw4w9WgXcQ
+
+I hope you like it as much as I do.
+`
+	t.Run("Real post Markdown", func(t *testing.T) {
+		html := ParseMarkdown(md, PostMarkdown)
+		t.Log(html)
+		assert.Contains(t, html, `<img src="coolimage.png"`)
+		assert.Contains(t, html, "<iframe")
+	})
+	t.Run("Post edit preview Markdown", func(t *testing.T) {
+		html := ParseMarkdown(md, PostEditPreviewMarkdown)
+		t.Log(html)
+		assert.Contains(t, html, `<img src="coolimage.png"`)
+		assert.Contains(t, html, `<img src="https://img.youtube.com/vi/dQw4w9WgXcQ/hqdefault.jpg"`)
+		assert.NotContains(t, html, "<iframe")
+	})
+	t.Run("Post preview Markdown", func(t *testing.T) {
+		html := ParseMarkdown(md, PostPreviewMarkdown)
+		t.Log(html)
+		assert.Contains(t, html, `<img src="coolimage.png"`)
+		assert.Contains(t, html, `<a href="https://youtu.be/dQw4w9WgXcQ"`)
+		assert.NotContains(t, html, "<iframe")
+	})
+	t.Run("Plaintext Markdown", func(t *testing.T) {
+		html := ParseMarkdown(md, PlaintextMarkdown)
+		t.Log(html)
+		assert.NotContains(t, html, `<img`)
+		assert.NotContains(t, html, `<a`)
+		assert.NotContains(t, html, "<iframe")
+		assert.NotContains(t, html, "\n", "Plain text markdown is intended for OpenGraph descriptions and therefore shouldn't contain newlines")
+	})
+}
+
 func TestBBCode(t *testing.T) {
 	t.Run("[code]", func(t *testing.T) {
 		t.Run("one line", func(t *testing.T) {
-			html := ParseMarkdown("[code]Just some code, you know?[/code]", ForumRealMarkdown)
+			html := ParseMarkdown("[code]Just some code, you know?[/code]", PostMarkdown)
 			t.Log(html)
 			assert.Equal(t, 1, strings.Count(html, "<pre"))
 			assert.Contains(t, html, `class="hmn-code"`)
@@ -41,7 +83,7 @@ func TestBBCode(t *testing.T) {
 Multiline code
 	with an indent
 [/code]`
-			html := ParseMarkdown(bbcode, ForumRealMarkdown)
+			html := ParseMarkdown(bbcode, PostMarkdown)
 			t.Log(html)
 			assert.Equal(t, 1, strings.Count(html, "<pre"))
 			assert.Contains(t, html, `class="hmn-code"`)
@@ -54,7 +96,7 @@ func main() {
 	fmt.Println("Hello, world!")
 }
 [/code]`
-			html := ParseMarkdown(bbcode, ForumRealMarkdown)
+			html := ParseMarkdown(bbcode, PostMarkdown)
 			t.Log(html)
 			assert.Equal(t, 1, strings.Count(html, "<pre"))
 			assert.Contains(t, html, "Println")
@@ -66,7 +108,7 @@ func main() {
 func TestSharlock(t *testing.T) {
 	t.Skipf("This doesn't pass right now because parts of Sharlock's original source read as indented code blocks, or depend on different line break behavior.")
 	t.Run("sanity check", func(t *testing.T) {
-		result := ParseMarkdown(sharlock, ForumRealMarkdown)
+		result := ParseMarkdown(sharlock, PostMarkdown)
 
 		for line := range strings.SplitSeq(result, "\n") {
 			assert.NotContains(t, line, "[b]")
@@ -85,6 +127,6 @@ func TestSharlock(t *testing.T) {
 
 func BenchmarkSharlock(b *testing.B) {
 	for i := 0; i < b.N; i++ {
-		ParseMarkdown(sharlock, ForumRealMarkdown)
+		ParseMarkdown(sharlock, PostMarkdown)
 	}
 }

src/templates/mapping.go

@@ -22,8 +22,9 @@ func PostToTemplate(p *models.Post, author *models.User) Post {
 
 		// Urls not set here. They vary per thread type. Set 'em yourself!
 
-		Preview:  p.Preview,
-		ReadOnly: p.ReadOnly,
+		Preview:     p.PreviewPlaintext,
+		PreviewHTML: template.HTML(p.PreviewHTML),
+		ReadOnly:    p.ReadOnly,
 
 		Author: UserToTemplate(author),
 		// No content. A lot of the time we don't have this handy and don't need it. See AddContentVersion.

src/templates/types.go

@@ -127,6 +127,7 @@ type Post struct {
 	ReplyUrl  string
 
 	Preview      string
+	PreviewHTML  template.HTML
 	ReadOnly     bool
 	ThreadLocked bool
 

src/website/admin.go

@@ -206,7 +206,7 @@ func AdminApprovalQueue(c *RequestContext) ResponseData {
 		}
 		timelineItem := PostToTimelineItem(hmndata.UrlContextForProject(&p.Project), lineageBuilder, &p.Post, &p.Thread, p.ThreadOwner, &p.Author)
 		timelineItem.OwnerAvatarUrl = ""
-		timelineItem.Description = template.HTML(p.CurrentVersion.TextParsed)
+		timelineItem.Description = template.HTML(p.Post.PreviewHTML)
 		userData.Timeline = append(userData.Timeline, timelineItem)
 	}