Initial commit for changelog template

.gitignore

@@ -0,0 +1,10 @@
+node_modules
+.next
+.cache
+dist
+build
+.DS_Store
+*.log
+.env.local
+.env.*.local
+*.tsbuildinfo

Dockerfile

@@ -0,0 +1,21 @@
+FROM node:20-slim
+
+WORKDIR /app
+
+# Copy package files
+COPY package*.json ./
+
+# Install dependencies
+RUN npm ci --only=production
+
+# Copy application files
+COPY . .
+
+# Build the application
+RUN npm run build
+
+# Expose port
+EXPOSE 3000
+
+# Start the application
+CMD ["npm", "start"]

README.md

@@ -0,0 +1,41 @@
+---
+title: changelog Template
+emoji: 🚀
+colorFrom: gray
+colorTo: black
+sdk: docker
+app_port: 3000
+pinned: true
+---
+
+# changelog Template
+
+A Hanzo template for building modern applications.
+
+## Features
+- Built with @hanzo/ui
+- Fully responsive
+- TypeScript support
+- Tailwind CSS styling
+- shadcn/ui components
+
+## Installation
+
+```bash
+npx create-hanzo-app --template changelog
+```
+
+## Development
+
+```bash
+npm install
+npm run dev
+```
+
+## Build
+
+```bash
+npm run build
+```
+
+Check out the [Hanzo Template Gallery](https://huggingface.co/spaces/hanzoai/gallery) for more templates.

app/globals.css

@@ -0,0 +1,155 @@
+@import "tailwindcss";
+@import "tw-animate-css";
+@import 'fumadocs-ui/css/neutral.css';
+@import 'fumadocs-ui/css/preset.css';
+
+@custom-variant dark (&:is(.dark *));
+
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --animate-accordion-down: accordion-down 0.2s ease-out;
+  --animate-accordion-up: accordion-up 0.2s ease-out;
+
+  
+  @keyframes accordion-down {
+    from {
+      height: 0;
+    }
+    to {
+      height: var(--radix-accordion-content-height);
+    }
+  }
+
+  @keyframes accordion-up {
+    from {
+      height: var(--radix-accordion-content-height);
+    }
+    to {
+      height: 0;
+    }
+  }
+}
+
+:root {
+  --font-sans: var(--font-geist-sans);
+  --font-mono: var(--font-geist-mono);
+  --radius: 0.625rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.145 0 0);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.145 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.205 0 0);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.205 0 0);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.205 0 0);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+}
+
+.dark {
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.205 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.922 0 0);
+  --primary-foreground: oklch(0.205 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.269 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.556 0 0);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  html {
+    scroll-behavior: smooth;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+
+  .shiki > div > button {
+    border-top-left-radius: 0 !important;
+    border-bottom-right-radius: 0 !important;
+  }
+}
+
+

app/layout.tsx

@@ -0,0 +1,47 @@
+import type { Metadata, Viewport } from "next"
+import { GeistSans } from "geist/font/sans"
+import { GeistMono } from "geist/font/mono"
+import { ThemeProvider } from "@/components/theme-provider"
+import { siteConfig } from "@/lib/site"
+import "./globals.css"
+
+export const viewport: Viewport = {
+  themeColor: [
+    { media: "(prefers-color-scheme: dark)", color: "#000000" },
+    { media: "(prefers-color-scheme: light)", color: "#ffffff" },
+  ],
+}
+
+export const metadata: Metadata = {
+  metadataBase: new URL(siteConfig.url),
+  title: {
+    default: siteConfig.name,
+    template: `%s - ${siteConfig.name}`,
+  },
+  description: siteConfig.description,
+}
+
+export default function RootLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode
+}>) {
+  return (
+    <html
+      lang="en"
+      className={`${GeistSans.variable} ${GeistMono.variable} antialiased`}
+      suppressHydrationWarning
+    >
+      <body>
+        <ThemeProvider
+          attribute="class"
+          defaultTheme="system"
+          enableSystem
+          disableTransitionOnChange
+        >
+          {children}
+        </ThemeProvider>
+      </body>
+    </html>
+  )
+}

app/metadata.ts

@@ -0,0 +1,40 @@
+import { Metadata } from "next"
+import { siteConfig } from "@/lib/site"
+
+export const metadata: Metadata = {
+  title: siteConfig.name,
+  description: siteConfig.description,
+  keywords: siteConfig.keywords,
+  authors: [
+    {
+      name: "Hanzo AI",
+      url: "https://hanzo.ai",
+    },
+  ],
+  creator: "Hanzo AI",
+  openGraph: {
+    type: "website",
+    locale: "en_US",
+    url: siteConfig.url,
+    title: siteConfig.name,
+    description: siteConfig.description,
+    siteName: siteConfig.name,
+  },
+  twitter: {
+    card: "summary_large_image",
+    title: siteConfig.name,
+    description: siteConfig.description,
+    creator: "@hanzoai",
+  },
+  robots: {
+    index: true,
+    follow: true,
+    googleBot: {
+      index: true,
+      follow: true,
+      "max-video-preview": -1,
+      "max-image-preview": "large",
+      "max-snippet": -1,
+    },
+  },
+}

app/opengraph-image.tsx

@@ -0,0 +1,48 @@
+import { headers } from "next/headers"
+import { ImageResponse } from "next/og"
+
+export const runtime = "edge"
+export const alt = "Changelog Template"
+export const size = {
+  width: 1200,
+  height: 630,
+}
+export const contentType = "image/png"
+
+export default async function Image() {
+  try {
+    const headersList = await headers()
+    const host = headersList.get("host") || ""
+    const protocol = process.env.NODE_ENV === "development" ? "http" : "https"
+    const baseUrl = `${protocol}://${host}`
+
+    return new ImageResponse(
+      (
+        <div
+          style={{
+            height: "100%",
+            width: "100%",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            background: "black",
+          }}
+        >
+          <img
+            src={`${baseUrl}/og.png`}
+            alt={alt}
+            style={{
+              width: "100%",
+              height: "100%",
+              objectFit: "cover",
+            }}
+          />
+        </div>
+      ),
+      { ...size }
+    )
+  } catch (error) {
+    console.error("Error generating OpenGraph image:", error)
+    return new Response(`Failed to generate image`, { status: 500 })
+  }
+}

app/page.tsx

@@ -0,0 +1,115 @@
+import { docs, meta } from "@/.source"
+import { loader } from "fumadocs-core/source"
+import { createMDXSource } from "fumadocs-mdx"
+import { ThemeToggle } from "@/components/theme-toggle"
+import { useMemo } from "react"
+import { formatDate } from "@/lib/utils"
+
+const source = loader({
+  baseUrl: "/docs",
+  source: createMDXSource(docs, meta),
+})
+
+interface ChangelogData {
+  title: string
+  date: string
+  version?: string
+  tags?: string[]
+  body: React.ComponentType
+}
+
+interface ChangelogPage {
+  url: string
+  data: ChangelogData
+}
+
+export default function HomePage() {
+  const sortedChangelogs = useMemo(() => {
+    const allPages = source.getPages() as ChangelogPage[]
+    return allPages.sort((a, b) => {
+      const dateA = new Date(a.data.date).getTime()
+      const dateB = new Date(b.data.date).getTime()
+      return dateB - dateA
+    })
+  }, [])
+
+  return (
+    <div className="min-h-screen bg-background relative">
+      {/* Header */}
+      <div className="border-b border-border/50">
+        <div className="max-w-5xl mx-auto relative">
+          <div className="p-3 flex items-center justify-between">
+            <h1 className="text-3xl font-semibold tracking-tight">Changelog</h1>
+            <ThemeToggle />
+          </div>
+        </div>
+      </div>
+
+      {/* Timeline */}
+      <div className="max-w-5xl mx-auto px-6 lg:px-10 pt-10">
+        <div className="relative">
+          {sortedChangelogs.map((changelog) => {
+            const MDX = changelog.data.body
+            const date = new Date(changelog.data.date)
+            const formattedDate = formatDate(date)
+
+            return (
+              <div key={changelog.url} className="relative">
+                <div className="flex flex-col md:flex-row gap-y-6">
+                  <div className="md:w-48 flex-shrink-0">
+                    <div className="md:sticky md:top-8 pb-10">
+                      <time className="text-sm font-medium text-muted-foreground block mb-3">
+                        {formattedDate}
+                      </time>
+
+                      {changelog.data.version && (
+                        <div className="inline-flex relative z-10 items-center justify-center w-10 h-10 text-foreground border border-border rounded-lg text-sm font-bold">
+                          {changelog.data.version}
+                        </div>
+                      )}
+                    </div>
+                  </div>
+
+                  {/* Right side - Content */}
+                  <div className="flex-1 md:pl-8 relative pb-10">
+                    {/* Vertical timeline line */}
+                    <div className="hidden md:block absolute top-2 left-0 w-px h-full bg-border">
+                      {/* Timeline dot */}
+                      <div className="hidden md:block absolute -translate-x-1/2 size-3 bg-primary rounded-full z-10" />
+                    </div>
+
+                    <div className="space-y-6">
+                      <div className="relative z-10 flex flex-col gap-2">
+                        <h2 className="text-2xl font-semibold tracking-tight text-balance">
+                          {changelog.data.title}
+                        </h2>
+
+                        {/* Tags */}
+                        {changelog.data.tags &&
+                          changelog.data.tags.length > 0 && (
+                            <div className="flex flex-wrap gap-2">
+                              {changelog.data.tags.map((tag: string) => (
+                                <span
+                                  key={tag}
+                                  className="h-6 w-fit px-2 text-xs font-medium bg-muted text-muted-foreground rounded-full border flex items-center justify-center"
+                                >
+                                  {tag}
+                                </span>
+                              ))}
+                            </div>
+                          )}
+                      </div>
+                      <div className="prose dark:prose-invert max-w-none prose-headings:scroll-mt-8 prose-headings:font-semibold prose-a:no-underline prose-headings:tracking-tight prose-headings:text-balance prose-p:tracking-tight prose-p:text-balance">
+                        <MDX />
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            )
+          })}
+        </div>
+      </div>
+    </div>
+  )
+}

changelog/content/2025-05-23.mdx

@@ -0,0 +1,48 @@
+---
+title: "UX Improvements"
+description: "Major improvements to UI/UX"
+date: "2025-05-23"
+tags: ["UI", "UX"]
+version: "0.9"
+---
+
+![UX Improvements](https://images.unsplash.com/photo-1680016661694-1cd3faf31c3a?q=80&w=2874&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)
+
+- **Redesigned interface** with cleaner, more intuitive navigation
+- **Enhanced accessibility** with improved keyboard navigation and screen reader support
+- **Streamlined workflows** for faster task completion
+- **Responsive design** optimized for all device sizes
+
+<Accordion type="multiple" collapsible className="w-full not-prose">
+  <AccordionItem value="item-1">
+    <AccordionTrigger>Features</AccordionTrigger>
+    <AccordionContent className="flex flex-col gap-4 text-balance">
+      <ul className="list-disc space-y-2 pl-4">
+        <li>
+          <strong>Redesigned navigation menu</strong> with improved organization
+          and visual hierarchy
+        </li>
+        <li>
+          Enhanced accessibility features with full keyboard navigation support
+        </li>
+        <li>High contrast mode for users with visual impairments</li>
+        <li>Optimized touch targets for better mobile interaction</li>
+        <li>Enhanced swipe gestures and mobile-specific navigation</li>
+      </ul>
+    </AccordionContent>
+  </AccordionItem>
+  <AccordionItem value="item-2">
+    <AccordionTrigger>Bug Fixes</AccordionTrigger>
+    <AccordionContent className="flex flex-col gap-4 text-balance">
+      <ul className="list-disc space-y-2 pl-4">
+        <li>
+          Fixed inconsistent button placement across different screen sizes
+        </li>
+        <li>Resolved color contrast issues affecting readability</li>
+        <li>Corrected tab order problems in form navigation</li>
+        <li>Fixed device orientation change handling on mobile devices</li>
+        <li>Improved ARIA label compatibility with screen readers</li>
+      </ul>
+    </AccordionContent>
+  </AccordionItem>
+</Accordion>

changelog/content/2025-06-15.mdx

@@ -0,0 +1,44 @@
+---
+title: "Enhanced AI Agent Interface and Reasoning Capabilities"
+description: "Major improvements to AI agent performance, conversation interface, and reasoning abilities."
+date: "2025-06-15"
+tags: ["AI", "Performance", "Interface", "Reasoning"]
+version: "1.2"
+---
+
+![Enhanced AI Agent Interface](https://images.unsplash.com/photo-1677442136019-21780ecad995?w=900&auto=format&fit=crop&q=60&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxzZWFyY2h8M3x8YWklMjBhZ2VudHxlbnwwfHwwfHx8MA%3D%3D)
+
+- **Enhanced Reasoning**: Improved logical thinking and problem-solving
+- **Context Awareness**: Better understanding of conversation history
+- **Multi-modal Support**: Process text, images, and code simultaneously
+- **Adaptive Responses**: Tailored communication style based on user preferences
+- **Real-time Learning**: Dynamic adaptation during conversations
+
+<Accordion type="multiple" collapsible className="w-full not-prose">
+  <AccordionItem value="item-1">
+    <AccordionTrigger>Features</AccordionTrigger>
+    <AccordionContent className="flex flex-col gap-4 text-balance">
+      <ul className="list-disc space-y-2 pl-4">
+        <li>
+          <strong>60% faster response generation</strong>
+        </li>
+        <li>Optimized model inference with reduced latency</li>
+        <li>Improved memory management for long conversations</li>
+        <li>Enhanced token efficiency and cost optimization</li>
+        <li>Better handling of complex multi-step tasks</li>
+      </ul>
+    </AccordionContent>
+  </AccordionItem>
+  <AccordionItem value="item-2">
+    <AccordionTrigger>Bug Fixes</AccordionTrigger>
+    <AccordionContent className="flex flex-col gap-4 text-balance">
+      <ul className="list-disc space-y-2 pl-4">
+        <li>Fixed conversation context loss in long sessions</li>
+        <li>Resolved inconsistent response formatting</li>
+        <li>Corrected memory retention issues</li>
+        <li>Fixed edge cases in code generation</li>
+        <li>Improved error handling and recovery</li>
+      </ul>
+    </AccordionContent>
+  </AccordionItem>
+</Accordion>

changelog/content/2025-06-30.mdx

@@ -0,0 +1,53 @@
+---
+title: "Release 2.1 - Kimi K2 Support"
+description: "Major improvements to AI agent reasoning, conversation handling, and multi-modal processing"
+date: "2025-06-30"
+tags: ["AI", "Performance", "Reasoning", "Multi-modal"]
+version: "2.1"
+---
+
+<Video src="/demo.mp4" />
+
+- **Advanced reasoning engine** with improved logical thinking
+- **Multi-modal processing** for text, images, and code analysis
+- **Context-aware responses** with better conversation memory
+- **Adaptive communication** that matches user preferences
+
+```tsx
+// Example of updated API usage
+const agent = new AIAgent({
+  model: "kimi-k2",
+  reasoning: "enhanced",
+  multiModal: true,
+})
+```
+
+<Accordion type="multiple" collapsible className="w-full not-prose">
+  <AccordionItem value="item-1">
+    <AccordionTrigger>Features</AccordionTrigger>
+    <AccordionContent className="flex flex-col gap-4 text-balance">
+      <ul className="list-disc space-y-2 pl-4">
+        <li>
+          <strong>45% faster response generation</strong> across all model types
+        </li>
+        <li>New API endpoints for custom AI agent implementations</li>
+        <li>Enhanced webhook support for real-time notifications</li>
+        <li>Improved SDK with TypeScript definitions</li>
+        <li>Updated knowledge base with latest information</li>
+        <li>Enhanced creative writing and brainstorming capabilities</li>
+      </ul>
+    </AccordionContent>
+  </AccordionItem>
+  <AccordionItem value="item-2">
+    <AccordionTrigger>Bug Fixes</AccordionTrigger>
+    <AccordionContent className="flex flex-col gap-4 text-balance">
+      <ul className="list-disc space-y-2 pl-4">
+        <li>Fixed conversation context loss during long sessions</li>
+        <li>Resolved inconsistent response formatting issues</li>
+        <li>Improved error handling for complex queries</li>
+        <li>Fixed memory retention problems in extended conversations</li>
+        <li>Better error reporting and debugging tools</li>
+      </ul>
+    </AccordionContent>
+  </AccordionItem>
+</Accordion>

postcss.config.mjs

@@ -0,0 +1,5 @@
+const config = {
+  plugins: ["@tailwindcss/postcss"],
+};
+
+export default config;