feat: add release notes modal with build-time generation

.changeset/nine-moments-rule.md

@@ -0,0 +1,5 @@
+---
+"kilo-code": minor
+---
+
+Add a button to view the latest release notes to the extension

apps/storybook/stories/ReleaseNotesModal.stories.tsx

@@ -0,0 +1,60 @@
+// kilocode_change - new file: Storybook story for Release Notes Modal component
+import type { Meta, StoryObj } from "@storybook/react-vite"
+import { ReleaseNotesModal } from "@/components/release-notes/ReleaseNotesModal"
+import { sampleReleaseNotes } from "./sampleReleaseNotes"
+
+const meta = {
+	title: "Components/ReleaseNotesModal",
+	component: ReleaseNotesModal,
+	argTypes: {
+		isOpen: {
+			control: { type: "boolean" },
+		},
+		loading: {
+			control: { type: "boolean" },
+		},
+		currentVersion: {
+			control: { type: "text" },
+		},
+	},
+	parameters: {
+		disableChromaticDualThemeSnapshot: true,
+	},
+	args: {
+		isOpen: true,
+		currentVersion: "4.106.0",
+		releases: sampleReleaseNotes,
+		loading: false,
+		onClose: () => console.log("Modal closed"),
+		onMarkAsViewed: (version: string) => console.log("Version marked as viewed:", version),
+	},
+} satisfies Meta<typeof ReleaseNotesModal>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {
+	args: {
+		releases: sampleReleaseNotes,
+	},
+}
+
+export const SingleRelease: Story = {
+	args: {
+		releases: [sampleReleaseNotes[0]],
+	},
+}
+
+export const Loading: Story = {
+	args: {
+		releases: [],
+		loading: true,
+	},
+}
+
+export const EmptyReleases: Story = {
+	args: {
+		releases: [],
+		loading: false,
+	},
+}

apps/storybook/stories/ShowReleaseNotesButton.stories.tsx

@@ -0,0 +1,51 @@
+// kilocode_change - new file: Storybook story for Show Release Notes Button Inner component
+import type { Meta, StoryObj } from "@storybook/react-vite"
+import { fn } from "storybook/test"
+import { ShowReleaseNotesButtonInner } from "@/components/release-notes/ShowReleaseNotesButtonInner"
+import { Bell } from "lucide-react"
+
+const meta = {
+	title: "Components/ShowReleaseNotesButton",
+	component: ShowReleaseNotesButtonInner,
+	parameters: {
+		layout: "centered",
+	},
+	decorators: [
+		(Story) => (
+			<div className="p-4">
+				<Story />
+			</div>
+		),
+	],
+	argTypes: {
+		buttonText: {
+			control: { type: "text" },
+		},
+		showBadge: {
+			control: { type: "boolean" },
+		},
+		className: {
+			control: { type: "text" },
+		},
+	},
+	args: {
+		onClick: fn(),
+	},
+} satisfies Meta<typeof ShowReleaseNotesButtonInner>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+export const Default: Story = {
+	args: {
+		buttonText: "View Release Notes",
+		showBadge: false,
+	},
+}
+
+export const WithBadge: Story = {
+	args: {
+		buttonText: "View Release Notes",
+		showBadge: true,
+	},
+}

apps/storybook/stories/sampleReleaseNotes.tsx

@@ -0,0 +1,39 @@
+// kilocode_change - new file: Sample release notes data for Storybook testing
+import { ReleaseNote } from "@roo-code/types"
+
+export const sampleReleaseNotes: ReleaseNote[] = [
+	{
+		version: "4.106.0",
+		changes: [
+			{
+				description: "Preliminary support for native tool calling (a.k.a native function calling) was added",
+				prNumber: 2833,
+				commitHash: "0b8ef46",
+				author: "mcowger",
+			},
+			{
+				description: "CMD-I now invokes the agent so you can give it more complex prompts",
+				prNumber: 3050,
+				commitHash: "357d438",
+				author: "markijbema",
+			},
+		],
+	},
+	{
+		version: "4.105.0",
+		changes: [
+			{
+				description: "Improve the edit chat area to allow context and file drag and drop when editing messages",
+				prNumber: 3005,
+				commitHash: "b87ae9c",
+				author: "kevinvandijk",
+			},
+			{
+				description: "A warning is now shown when the webview memory usage crosses 90% of the limit",
+				prNumber: 3046,
+				commitHash: "1bd934f",
+				author: "chrarnoldus",
+			},
+		],
+	},
+]

packages/types/src/global-settings.ts

@@ -175,6 +175,7 @@ export const globalSettingsSchema = z.object({
 	customSupportPrompts: customSupportPromptsSchema.optional(),
 	enhancementApiConfigId: z.string().optional(),
 	dismissedNotificationIds: z.string().array().optional(), // kilocode_change
+	lastViewedReleaseVersion: z.string().optional(), // kilocode_change
 	commitMessageApiConfigId: z.string().optional(), // kilocode_change
 	terminalCommandApiConfigId: z.string().optional(), // kilocode_change
 	ghostServiceSettings: ghostServiceSettingsSchema, // kilocode_change

packages/types/src/index.ts

@@ -25,6 +25,7 @@ export * from "./type-fu.js"
 export * from "./vscode.js"
 export * from "./kilocode/kilocode.js"
 export * from "./kilocode/native-function-calling.js"
+export * from "./release-notes.js" // kilocode_change
 export * from "./usage-tracker.js" // kilocode_change
 
 export * from "./providers/index.js"

packages/types/src/release-notes.ts

@@ -0,0 +1,17 @@
+// kilocode_change - new file
+export interface ReleaseItem {
+	description: string
+	prNumber?: number
+	commitHash?: string
+	author?: string
+}
+
+export interface ReleaseNote {
+	version: string
+	changes: ReleaseItem[]
+}
+
+export interface ReleaseData {
+	currentVersion: string
+	releases: ReleaseNote[]
+}

src/shared/ExtensionMessage.ts

@@ -360,6 +360,7 @@ export type ExtensionState = Pick<
 	| "commitMessageApiConfigId" // kilocode_change
 	| "terminalCommandApiConfigId" // kilocode_change
 	| "dismissedNotificationIds" // kilocode_change
+	| "lastViewedReleaseVersion" // kilocode_change
 	| "ghostServiceSettings" // kilocode_change
 	| "autoPurgeEnabled" // kilocode_change
 	| "autoPurgeDefaultRetentionDays" // kilocode_change

webview-ui/.gitignore

@@ -11,6 +11,9 @@
 # production
 /build
 
+# kilocode_change - Generated release notes JSON (but keep .d.ts files)
+/src/generated/**/*.json
+
 # misc
 .DS_Store
 .env.local

webview-ui/package.json

@@ -32,9 +32,9 @@
 		"@roo-code/types": "workspace:^",
 		"@tailwindcss/vite": "^4.0.0",
 		"@tanstack/react-query": "^5.68.0",
+		"@types/qrcode": "^1.5.5",
 		"@types/seedrandom": "^3.0.8",
 		"@use-gesture/react": "^10.3.1",
-		"@types/qrcode": "^1.5.5",
 		"@vscode/codicons": "^0.0.36",
 		"@vscode/webview-ui-toolkit": "^1.4.0",
 		"axios": "^1.12.0",
@@ -80,7 +80,6 @@
 		"tailwind-merge": "^3.0.0",
 		"tailwindcss": "^4.0.0",
 		"tailwindcss-animate": "^1.0.7",
-		"unist-util-visit": "^5.0.0",
 		"use-sound": "^5.0.0",
 		"vscode-material-icons": "^0.1.1",
 		"vscrui": "^0.2.2",
@@ -111,9 +110,12 @@
 		"jest-environment-jsdom": "^29.7.0",
 		"jest-simple-dot-reporter": "^1.0.5",
 		"jsdom": "^26.0.0",
+		"remark": "^15.0.1",
+		"remark-parse": "^11.0.0",
 		"storybook": "^8.4.7",
 		"ts-jest": "^29.2.5",
 		"typescript": "5.8.3",
+		"unist-util-visit": "^5.0.0",
 		"vite": "6.3.6",
 		"vitest": "^3.2.3"
 	}