Skip to content

Commit dc243e4

Browse files
roomote-v0[bot]roomotemp-roocode
authored
feat(web): add blog section with initial posts (#11127)
* feat(web): add blog section with 4 initial posts Implements MKT-66 through MKT-74: Content Layer (MKT-67): - Markdown files in src/content/blog with Zod-validated frontmatter - Pacific Time scheduling evaluated at request-time (no deploy needed) - gray-matter for parsing, react-markdown + remark-gfm for rendering Blog Pages (MKT-68, MKT-69): - Index page at /blog with dynamic SSR - Post page at /blog/[slug] with dynamic SSR - Breadcrumb navigation and prev/next post navigation SEO (MKT-70): - Full OpenGraph and Twitter card metadata - Schema.org JSON-LD (Article, BreadcrumbList, CollectionPage) - Canonical URLs pointing to roocode.com/blog Analytics (MKT-74): - PostHog blog_post_viewed and blog_index_viewed events - Referrer tracking for attribution Navigation (MKT-72): - Updated nav-bar and footer to link to internal /blog - Blog link in Resources dropdown Sitemap (MKT-71): - Dynamic blog paths with PT scheduling check Initial Posts: - PRDs Are Becoming Artifacts of the Past (Jan 12) - Code Review Got Faster, Not Easier (Jan 19) - Vibe Coders Build and Rebuild (Jan 26) - Async Agents Change the Speed vs Quality Calculus (Feb 2) * fix(test): update HistoryPreview tests to match refactored component The HistoryPreview component was refactored to use useGroupedTasks and TaskGroupItem instead of rendering TaskItem directly. This updates the test file to properly mock the new dependencies: - Mock useGroupedTasks hook to provide grouped task data - Mock TaskGroupItem instead of TaskItem - Update assertions to test for task groups instead of individual tasks * feat(blog): add Vercel-inspired patterns and Tone of Voice alignment - Add reading time display to blog posts - Create BlogPostCTA component with 4 variants (default, extension, cloud, enterprise) - Add zebra striping to tables in blog posts - Add CTA to blog landing and paginated pages - Remove 'Posted' prefix from dates - Update blog description: 'How teams use agents to iterate, review, and ship PRs with proof' - Add BlogPostList and BlogPagination components - Add 100+ new blog posts from content pipeline * feat(blog): add source badges for podcast content (Office Hours, After Hours, Roo Cast) - Add BlogSource type to types.ts - Export BlogSource from blog index - Add SourceBadge component to BlogPostList with colored badges - Each podcast has distinct color: blue (Office Hours), purple (After Hours), emerald (Roo Cast) * feat(blog): add source field to all blog posts (Roo Cast, Office Hours, After Hours) - Add add-blog-sources.ts script to build title→source mapping - Updated 122 blog posts with correct podcast sources - Sources: Roo Cast (52), Office Hours (62), After Hours (8) * feat(blog): add source badges with consistent styling - Add source field to Zod validation schema - Source badges use same styling as tag badges (rounded, greyscale) - Badges display on /blog landing page for Office Hours, After Hours, Roo Cast * feat(blog): improve schema.org structured data for SEO - Change @type from Article to BlogPosting (more specific) - Add image property using OG image URL - Add wordCount for AEO optimization * feat(blog): timestamped YouTube quotes + attribution polish * chore(blog): update 'Series A team' to 'Series A - C team' and fix 'Tovin' to 'Tovan' - Changed 22 instances of 'Series A team' to 'Series A - C team' across 20 blog posts - Changed 12 instances of 'Tovin' to 'Tovan' across 4 blog posts This broadens the messaging to better represent teams that Roo Code serves (Series A through C). * ci: retry CI after timeout * blog: featured posts + copy edits * blog: remove draft posts from web content * fix(blog): loop HTML tag stripping to prevent incomplete sanitization The single-pass .replace(/<[^>]+>/g, "") in calculateReadingTime() was flagged by CodeQL as vulnerable to incomplete multi-character sanitization. Input like "<scr<script>ipt>" would still contain "<script" after one pass. Added a stripHtmlTags() helper that loops the replacement until stable, plus a final pass to remove any remaining angle brackets. * fix(blog): replace iterative HTML tag stripping with single-pass angle bracket removal The CodeQL scanner flagged the iterative stripHtmlTags function for incomplete multi-character sanitization. The regex /<[^>]+>/g only matches complete tags, so partial fragments like <script (without a closing >) could survive intermediate loop iterations. Since this function is only used for word counting in calculateReadingTime, replace the multi-step approach with a simple single-pass removal of all < and > characters. This eliminates the incomplete sanitization pattern entirely. --------- Co-authored-by: Roo Code <roomote@roocode.com> Co-authored-by: Michael Preuss <michael@roocode.com>
1 parent 3e24e21 commit dc243e4

34 files changed

Lines changed: 3658 additions & 67 deletions

apps/web-roo-code/next-sitemap.config.cjs

Lines changed: 94 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,68 @@
1+
const path = require('path');
2+
const fs = require('fs');
3+
const matter = require('gray-matter');
4+
5+
/**
6+
* Get published blog posts for sitemap
7+
* Note: This runs at build time, so recently-scheduled posts may lag
8+
*/
9+
function getPublishedBlogPosts() {
10+
const BLOG_DIR = path.join(process.cwd(), 'src/content/blog');
11+
12+
if (!fs.existsSync(BLOG_DIR)) {
13+
return [];
14+
}
15+
16+
const files = fs.readdirSync(BLOG_DIR).filter(f => f.endsWith('.md'));
17+
const posts = [];
18+
19+
// Get current time in PT for publish check
20+
const formatter = new Intl.DateTimeFormat('en-US', {
21+
timeZone: 'America/Los_Angeles',
22+
year: 'numeric',
23+
month: '2-digit',
24+
day: '2-digit',
25+
hour: '2-digit',
26+
minute: '2-digit',
27+
hour12: false,
28+
});
29+
30+
const parts = formatter.formatToParts(new Date());
31+
const get = (type) => parts.find(p => p.type === type)?.value ?? '';
32+
const nowDate = `${get('year')}-${get('month')}-${get('day')}`;
33+
const nowMinutes = parseInt(get('hour')) * 60 + parseInt(get('minute'));
34+
35+
for (const file of files) {
36+
const filepath = path.join(BLOG_DIR, file);
37+
const raw = fs.readFileSync(filepath, 'utf8');
38+
const { data } = matter(raw);
39+
40+
// Check if post is published
41+
if (data.status !== 'published') continue;
42+
43+
// Parse publish time
44+
const timeMatch = data.publish_time_pt?.match(/^(1[0-2]|[1-9]):([0-5][0-9])(am|pm)$/i);
45+
if (!timeMatch) continue;
46+
47+
let hours = parseInt(timeMatch[1]);
48+
const mins = parseInt(timeMatch[2]);
49+
const isPm = timeMatch[3].toLowerCase() === 'pm';
50+
if (hours === 12) hours = isPm ? 12 : 0;
51+
else if (isPm) hours += 12;
52+
const postMinutes = hours * 60 + mins;
53+
54+
// Check if post is past publish date/time
55+
const isPublished = nowDate > data.publish_date ||
56+
(nowDate === data.publish_date && nowMinutes >= postMinutes);
57+
58+
if (isPublished && data.slug) {
59+
posts.push(data.slug);
60+
}
61+
}
62+
63+
return posts;
64+
}
65+
166
/** @type {import('next-sitemap').IConfig} */
267
module.exports = {
368
siteUrl: process.env.NEXT_PUBLIC_SITE_URL || 'https://roocode.com',
@@ -39,6 +104,12 @@ module.exports = {
39104
} else if (path === '/privacy' || path === '/terms') {
40105
priority = 0.5;
41106
changefreq = 'yearly';
107+
} else if (path === '/blog') {
108+
priority = 0.8;
109+
changefreq = 'weekly';
110+
} else if (path.startsWith('/blog/')) {
111+
priority = 0.7;
112+
changefreq = 'monthly';
42113
}
43114

44115
return {
@@ -50,24 +121,39 @@ module.exports = {
50121
};
51122
},
52123
additionalPaths: async (config) => {
53-
// Add any additional paths that might not be automatically discovered
54-
// This is useful for dynamic routes or API-generated pages
124+
const result = [];
125+
55126
// Add the /evals page since it's a dynamic route
56-
return [{
127+
result.push({
57128
loc: '/evals',
58129
changefreq: 'monthly',
59130
priority: 0.8,
60131
lastmod: new Date().toISOString(),
61-
}];
132+
});
62133

63-
// Add the /evals page since it's a dynamic route
134+
// Add /blog index
64135
result.push({
65-
loc: '/evals',
66-
changefreq: 'monthly',
136+
loc: '/blog',
137+
changefreq: 'weekly',
67138
priority: 0.8,
68139
lastmod: new Date().toISOString(),
69140
});
70141

142+
// Add published blog posts
143+
try {
144+
const slugs = getPublishedBlogPosts();
145+
for (const slug of slugs) {
146+
result.push({
147+
loc: `/blog/${slug}`,
148+
changefreq: 'monthly',
149+
priority: 0.7,
150+
lastmod: new Date().toISOString(),
151+
});
152+
}
153+
} catch (e) {
154+
console.warn('Could not load blog posts for sitemap:', e.message);
155+
}
156+
71157
return result;
72158
},
73-
};
159+
};

apps/web-roo-code/package.json

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,9 @@
99
"build": "next build",
1010
"postbuild": "next-sitemap --config next-sitemap.config.cjs",
1111
"start": "next start",
12-
"clean": "rimraf .next .turbo"
12+
"clean": "rimraf .next .turbo",
13+
"test": "vitest run",
14+
"test:watch": "vitest"
1315
},
1416
"dependencies": {
1517
"@radix-ui/react-dialog": "^1.1.15",
@@ -25,6 +27,7 @@
2527
"embla-carousel-autoplay": "^8.6.0",
2628
"embla-carousel-react": "^8.6.0",
2729
"framer-motion": "^12.29.2",
30+
"gray-matter": "^4.0.3",
2831
"lucide-react": "^0.563.0",
2932
"next": "^16.1.6",
3033
"next-themes": "^0.4.6",
@@ -52,6 +55,7 @@
5255
"autoprefixer": "^10.4.23",
5356
"next-sitemap": "^4.2.3",
5457
"postcss": "^8.5.6",
55-
"tailwindcss": "^3.4.17"
58+
"tailwindcss": "^3.4.17",
59+
"vitest": "^4.0.18"
5660
}
5761
}

0 commit comments

Comments
 (0)