@leadertechie/personal-site-kit 0.0.0

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "@leadertechie/personal-site-kit",
+  "version": "0.0.0",
+  "type": "module",
+  "description": "A high-performance personal website engine for Cloudflare Workers and R2",
+  "author": "Techie Leader",
+  "license": "MIT",
+  "files": [
+    "dist",
+    "src",
+    "README.md"
+  ],
+  "exports": {
+    ".": "./dist/index.js",
+    "./shared": "./dist/shared/index.js",
+    "./ui": "./dist/ui/index.js",
+    "./api": "./dist/api/index.js",
+    "./prerender": "./dist/prerender/index.js",
+    "./styles/*": "./src/styles/*"
+  },
+  "scripts": {
+    "build": "vite build",
+    "test": "vitest run"
+  },
+  "dependencies": {
+    "@leadertechie/md2html": "^0.1.0-alpha.10",
+    "@leadertechie/r2tohtml": "^0.1.0-alpha.10",
+    "lit": "^3.2.1"
+  },
+  "devDependencies": {
+    "@types/node": "^20.11.0",
+    "jsdom": "^29.0.1",
+    "typescript": "^5.7.3",
+    "vite": "^7.3.0",
+    "vite-plugin-dts": "^4.5.4",
+    "vitest": "^4.0.16"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}

package/src/api/__tests__/info.test.ts

@@ -0,0 +1,44 @@
+import { describe, expect, it } from 'vitest';
+
+import { handleInfo } from '../handlers/info';
+
+describe('Info Handler', () => {
+  it('should return API information', async () => {
+    const response = await handleInfo();
+
+    expect(response.status).toBe(200);
+    expect(response.headers.get('Content-Type')).toBe('application/json');
+
+    const body = await response.text();
+    const data = JSON.parse(body);
+
+    expect(data.name).toBe('TechieLeader');
+    expect(data.version).toBe('1.0.0');
+    expect(data.description).toBe('TechieLeader API');
+    expect(data.endpoints).toBeInstanceOf(Array);
+    expect(data.endpoints.length).toBeGreaterThan(0);
+  });
+
+  it('should return valid endpoints array', async () => {
+    const response = await handleInfo();
+    const body = await response.text();
+    const data = JSON.parse(body);
+
+    expect(data.endpoints).toContainEqual({
+      path: '/info',
+      method: 'GET',
+      description: 'Get API information'
+    });
+  });
+
+  it('should have correct response structure', async () => {
+    const response = await handleInfo();
+    const body = await response.text();
+    const data = JSON.parse(body);
+
+    expect(data).toHaveProperty('name');
+    expect(data).toHaveProperty('version');
+    expect(data).toHaveProperty('description');
+    expect(data).toHaveProperty('endpoints');
+  });
+});

package/src/api/__tests__/utils.test.ts

@@ -0,0 +1,78 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+import { createErrorResponse, createJSONResponse } from '../utils';
+
+describe('Utils', () => {
+  describe('createJSONResponse', () => {
+    it('should create JSON response with data', async () => {
+      const data = { message: 'Hello' };
+      const response = createJSONResponse(data);
+
+      expect(response.status).toBe(200);
+      expect(response.headers.get('Content-Type')).toBe('application/json');
+      
+      const body = await response.text();
+      expect(JSON.parse(body)).toEqual(data);
+    });
+
+    it('should create JSON response with custom status', async () => {
+      const data = { message: 'Not Found' };
+      const response = createJSONResponse(data, 404);
+
+      expect(response.status).toBe(404);
+      expect(response.headers.get('Content-Type')).toBe('application/json');
+    });
+
+    it('should handle empty data', async () => {
+      const response = createJSONResponse(null);
+
+      expect(response.status).toBe(200);
+      const body = await response.text();
+      expect(body).toBe('null');
+    });
+
+    it('should handle complex data structures', async () => {
+      const data = {
+        nested: {
+          array: [1, 2, 3],
+          string: 'test'
+        },
+        number: 42
+      };
+      const response = createJSONResponse(data);
+      
+      const body = await response.text();
+      expect(JSON.parse(body)).toEqual(data);
+    });
+  });
+
+  describe('createErrorResponse', () => {
+    it('should create error response with message', async () => {
+      const response = createErrorResponse('Something went wrong');
+
+      expect(response.status).toBe(500);
+      expect(response.headers.get('Content-Type')).toBe('application/json');
+      
+      const body = await response.text();
+      const parsed = JSON.parse(body);
+      expect(parsed.error).toBe('Something went wrong');
+    });
+
+    it('should create error response with custom status', async () => {
+      const response = createErrorResponse('Not found', 404);
+
+      expect(response.status).toBe(404);
+      expect(response.headers.get('Content-Type')).toBe('application/json');
+      
+      const body = await response.text();
+      const parsed = JSON.parse(body);
+      expect(parsed.error).toBe('Not found');
+    });
+
+    it('should default to status 500 if not provided', () => {
+      const response = createErrorResponse('Error');
+
+      expect(response.status).toBe(500);
+    });
+  });
+});

package/src/api/handlers/aboutme.ts

@@ -0,0 +1,99 @@
+// Simple JSON response handler for Cloudflare Workers
+
+import { R2ContentLoader, type ContentNode } from '@leadertechie/r2tohtml';
+
+interface Profile {
+  name: string;
+  title: string;
+  experience: string;
+  profileImageUrl: string;
+}
+
+interface AboutMeApiResponse {
+  profile: Profile;
+  contentNodes: ContentNode[];
+  processedMarkdown: string;
+}
+
+let loader: R2ContentLoader | null = null;
+
+function getLoader(env: any): R2ContentLoader | null {
+  if (!env?.CONTENT_BUCKET) {
+    return null;
+  }
+  
+  if (!loader) {
+    loader = new R2ContentLoader(
+      {
+        bucket: env.CONTENT_BUCKET,
+        cacheTTL: 5 * 60 * 1000,
+      },
+      {
+        md2html: {
+          imagePathPrefix: 'images/',
+          styleOptions: {
+            classPrefix: 'md-',
+            addHeadingIds: true
+          }
+        }
+      }
+    );
+  }
+  return loader;
+}
+
+export function clearContentCache() {
+  loader?.clearCache();
+}
+
+export async function handleAboutMe(env?: any): Promise<Response> {
+  try {
+    console.log('handleAboutMe: env?.CONTENT_BUCKET =', !!env?.CONTENT_BUCKET);
+    
+    if (!env?.CONTENT_BUCKET) {
+      return new Response(JSON.stringify({ error: 'Content bucket not configured', env: !!env }), {
+        status: 500,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+
+    const r2 = getLoader(env);
+    if (!r2) {
+      return new Response(JSON.stringify({ error: 'Content bucket not configured' }), {
+        status: 500,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+    console.log('handleAboutMe: r2 created, fetching data');
+
+    const [profileObj, astResult] = await Promise.all([
+      r2.getObject('profile.json'),
+      r2.getWithAST('about-me.md')
+    ]);
+
+    console.log('handleAboutMe: profileObj =', !!profileObj, 'astResult =', !!astResult);
+
+    if (!profileObj || !astResult) {
+      throw new Error('Content not found in R2');
+    }
+
+    const profile = await profileObj.json() as Profile;
+    console.log('handleAboutMe: profile loaded:', profile.name);
+
+    const responseData: AboutMeApiResponse = {
+      profile,
+      contentNodes: astResult.contentNodes,
+      processedMarkdown: ''
+    };
+
+    return new Response(JSON.stringify(responseData), {
+      headers: { 'Content-Type': 'application/json' },
+    });
+  } catch (error) {
+    console.error('Error serving aboutme content:', error);
+    return new Response(JSON.stringify({ error: 'Content not available', message: String(error) }), {
+      status: 500,
+      headers: { 'Content-Type': 'application/json' },
+    });
+  }
+}

package/src/api/handlers/content-api.ts

@@ -0,0 +1,268 @@
+// Content handler for blogs, stories, and search
+
+interface ContentMetadata {
+  slug: string;
+  title: string;
+  description: string;
+  summary?: string;
+  date: string;
+  imageUrl?: string;
+  tags?: string[];
+  author?: string;
+}
+
+interface BlogPost extends ContentMetadata {
+  content: string;
+}
+
+interface StoryPost extends ContentMetadata {
+  content: string;
+}
+
+// In-memory cache for content (reduces R2 reads)
+const contentCache = new Map<string, { data: any; timestamp: number }>();
+const CACHE_TTL = 5 * 60 * 1000; // 5 minutes
+
+async function getCachedOrFetch<T>(key: string, fetchFn: () => Promise<T>): Promise<T> {
+  const cached = contentCache.get(key);
+  if (cached && Date.now() - cached.timestamp < CACHE_TTL) {
+    return cached.data as T;
+  }
+  const data = await fetchFn();
+  contentCache.set(key, { data, timestamp: Date.now() });
+  return data;
+}
+
+function clearCache(prefix?: string): void {
+  if (prefix) {
+    for (const key of contentCache.keys()) {
+      if (key.startsWith(prefix)) {
+        contentCache.delete(key);
+      }
+    }
+  } else {
+    contentCache.clear();
+  }
+}
+
+function parseFrontmatter(content: string): { metadata: ContentMetadata; content: string } {
+  const lines = content.split('\n');
+  const metadata: Record<string, string | string[]> = {};
+  let contentStart = 0;
+  
+  if (lines[0]?.trim() === '---') {
+    for (let i = 1; i < lines.length; i++) {
+      if (lines[i]?.trim() === '---') {
+        contentStart = i + 1;
+        break;
+      }
+      const colonIdx = lines[i].indexOf(':');
+      if (colonIdx > 0) {
+        const key = lines[i].slice(0, colonIdx).trim();
+        let value = lines[i].slice(colonIdx + 1).trim();
+        if (value.startsWith('[') && value.endsWith(']')) {
+          value = value.slice(1, -1);
+          metadata[key] = value.split(',').map(v => v.trim());
+        } else {
+          metadata[key] = value;
+        }
+      }
+    }
+  }
+
+  return {
+    metadata: metadata as unknown as ContentMetadata,
+    content: lines.slice(contentStart).join('\n').trim()
+  };
+}
+
+export async function handleBlogs(env?: any, slug?: string, latest?: number): Promise<Response> {
+  try {
+    if (!env?.CONTENT_BUCKET) {
+      return new Response(JSON.stringify({ error: 'Content bucket not configured' }), {
+        status: 500,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+
+    const cacheKey = slug ? `blog-${slug}` : `blogs-list-${latest || 'all'}`;
+    
+    const result = await getCachedOrFetch(cacheKey, async () => {
+      if (slug) {
+        // Fetch content from .md file
+        const mdObj = await env.CONTENT_BUCKET.get(`blogs/${slug}.md`);
+        const jsonObj = await env.CONTENT_BUCKET.get(`blogs/${slug}.json`);
+        
+        if (!mdObj && !jsonObj) throw new Error('Blog not found');
+        
+        let metadata: any = {};
+        if (jsonObj) {
+          metadata = await jsonObj.json();
+        }
+        
+        let content = '';
+        if (mdObj) {
+          const text = await mdObj.text();
+          const parsed = parseFrontmatter(text);
+          content = parsed.content;
+          // Merge metadata from frontmatter if not in JSON
+          metadata = { ...parsed.metadata, ...metadata };
+        }
+        
+        return { ...metadata, slug, content } as BlogPost;
+      }
+
+      const list = await env.CONTENT_BUCKET.list({ prefix: 'blogs/' });
+      const blogs: ContentMetadata[] = [];
+      
+      for (const item of list.objects) {
+        if (item.key.endsWith('.json')) {
+          const obj = await env.CONTENT_BUCKET.get(item.key);
+          if (obj) {
+            const metadata = await obj.json() as ContentMetadata;
+            const slug = item.key.replace('blogs/', '').replace('.json', '');
+            blogs.push({ ...metadata, slug });
+          }
+        }
+      }
+
+      const sorted = blogs.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime());
+      return latest ? sorted.slice(0, latest) : sorted;
+    });
+
+    return new Response(JSON.stringify(result), {
+      headers: { 'Content-Type': 'application/json' },
+    });
+  } catch (error) {
+    console.error('Error serving blogs:', error);
+    return new Response(JSON.stringify({ error: 'Blog not found' }), {
+      status: 404,
+      headers: { 'Content-Type': 'application/json' },
+    });
+  }
+}
+
+export async function handleStories(env?: any, slug?: string, latest?: number): Promise<Response> {
+  try {
+    if (!env?.CONTENT_BUCKET) {
+      return new Response(JSON.stringify({ error: 'Content bucket not configured' }), {
+        status: 500,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+
+    const cacheKey = slug ? `story-${slug}` : `stories-list-${latest || 'all'}`;
+    
+    const result = await getCachedOrFetch(cacheKey, async () => {
+      if (slug) {
+        const mdObj = await env.CONTENT_BUCKET.get(`stories/${slug}.md`);
+        const jsonObj = await env.CONTENT_BUCKET.get(`stories/${slug}.json`);
+        
+        if (!mdObj && !jsonObj) throw new Error('Story not found');
+        
+        let metadata: any = {};
+        if (jsonObj) {
+          metadata = await jsonObj.json();
+        }
+        
+        let content = '';
+        if (mdObj) {
+          const text = await mdObj.text();
+          const parsed = parseFrontmatter(text);
+          content = parsed.content;
+          metadata = { ...parsed.metadata, ...metadata };
+        }
+        
+        return { ...metadata, slug, content } as StoryPost;
+      }
+
+      const list = await env.CONTENT_BUCKET.list({ prefix: 'stories/' });
+      const stories: ContentMetadata[] = [];
+      
+      for (const item of list.objects) {
+        if (item.key.endsWith('.json')) {
+          const obj = await env.CONTENT_BUCKET.get(item.key);
+          if (obj) {
+            const metadata = await obj.json() as ContentMetadata;
+            const slug = item.key.replace('stories/', '').replace('.json', '');
+            stories.push({ ...metadata, slug });
+          }
+        }
+      }
+
+      const sorted = stories.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime());
+      return latest ? sorted.slice(0, latest) : sorted;
+    });
+
+    return new Response(JSON.stringify(result), {
+      headers: { 'Content-Type': 'application/json' },
+    });
+  } catch (error) {
+    console.error('Error serving stories:', error);
+    return new Response(JSON.stringify({ error: 'Story not found' }), {
+      status: 404,
+      headers: { 'Content-Type': 'application/json' },
+    });
+  }
+}
+
+export async function handleSearch(env?: any, query?: string): Promise<Response> {
+  try {
+    if (!env?.CONTENT_BUCKET) {
+      return new Response(JSON.stringify({ error: 'Content bucket not configured' }), {
+        status: 500,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+
+    if (!query) {
+      return new Response(JSON.stringify({ error: 'Search query required' }), {
+        status: 400,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+
+    const searchResults = await getCachedOrFetch(`search-${query}`, async () => {
+      const q = query.toLowerCase();
+      const results: (BlogPost | StoryPost)[] = [];
+      
+      const [blogsList, storiesList] = await Promise.all([
+        env.CONTENT_BUCKET.list({ prefix: 'blogs/' }),
+        env.CONTENT_BUCKET.list({ prefix: 'stories/' })
+      ]);
+
+      for (const item of [...blogsList.objects, ...storiesList.objects]) {
+        if (item.key.endsWith('.md')) {
+          const obj = await env.CONTENT_BUCKET.get(item.key);
+          if (obj) {
+            const text = await obj.text();
+            const { metadata } = parseFrontmatter(text);
+            const matchTitle = metadata.title?.toLowerCase().includes(q);
+            const matchDesc = metadata.description?.toLowerCase().includes(q);
+            const matchTags = metadata.tags?.some((t: string) => t.toLowerCase().includes(q));
+            
+            if (matchTitle || matchDesc || matchTags) {
+              results.push(metadata as BlogPost | StoryPost);
+            }
+          }
+        }
+      }
+
+      return results;
+    });
+
+    return new Response(JSON.stringify(searchResults), {
+      headers: { 'Content-Type': 'application/json' },
+    });
+  } catch (error) {
+    console.error('Error serving search:', error);
+    return new Response(JSON.stringify({ error: 'Search failed' }), {
+      status: 500,
+      headers: { 'Content-Type': 'application/json' },
+    });
+  }
+}
+
+export function clearContentCache(): void {
+  clearCache();
+}

package/src/api/handlers/content.ts

@@ -0,0 +1,72 @@
+import { createJSONResponse, createErrorResponse } from '../utils';
+
+export async function handleContent(request: Request, env: any, subpath: string): Promise<Response> {
+  const bucket = env.CONTENT_BUCKET;
+  if (!bucket) {
+    return createErrorResponse('Content bucket not configured', 500);
+  }
+
+  const method = request.method;
+
+  // List content: GET /content (subpath is empty or just slash)
+  if (method === 'GET' && (!subpath || subpath === '/')) {
+    try {
+      const list = await bucket.list();
+      return createJSONResponse(list.objects.map((o: any) => ({
+        key: o.key,
+        size: o.size,
+        uploaded: o.uploaded,
+        httpEtag: o.httpEtag
+      })));
+    } catch (e: any) {
+      return createErrorResponse('Failed to list content: ' + e.message, 500);
+    }
+  }
+
+  // Get content: GET /content/:key
+  if (method === 'GET' && subpath) {
+    try {
+      const object = await bucket.get(subpath);
+      if (!object) {
+        return createErrorResponse('Content not found', 404);
+      }
+      const headers = new Headers();
+      object.writeHttpMetadata(headers);
+      headers.set('etag', object.httpEtag);
+      return new Response(object.body, { headers });
+    } catch (e: any) {
+      return createErrorResponse('Failed to get content: ' + e.message, 500);
+    }
+  }
+
+  // Auth check for write operations
+  const authHeader = request.headers.get('Authorization');
+  const apiKey = env.ADMIN_API_KEY; 
+  // Allow if apiKey is not set (dev mode) OR matches
+  // WARN: In prod, ADMIN_API_KEY should be set!
+  if (apiKey && authHeader !== `Bearer ${apiKey}`) {
+    return createErrorResponse('Unauthorized', 401);
+  }
+
+  // Upload content: PUT /content/:key
+  if (method === 'PUT' && subpath) {
+    try {
+      await bucket.put(subpath, request.body);
+      return createJSONResponse({ success: true, key: subpath });
+    } catch (e: any) {
+      return createErrorResponse('Failed to upload content: ' + e.message, 500);
+    }
+  }
+
+  // Delete content: DELETE /content/:key
+  if (method === 'DELETE' && subpath) {
+    try {
+      await bucket.delete(subpath);
+      return createJSONResponse({ success: true, key: subpath });
+    } catch (e: any) {
+      return createErrorResponse('Failed to delete content: ' + e.message, 500);
+    }
+  }
+
+  return createErrorResponse('Method not allowed', 405);
+}

package/src/api/handlers/home.ts

@@ -0,0 +1,79 @@
+// Home page content handler
+
+import { R2ContentLoader, type ContentNode } from '@leadertechie/r2tohtml';
+
+interface HomeApiResponse {
+  contentNodes: ContentNode[];
+  processedMarkdown: string;
+  content: string;
+}
+
+let loader: R2ContentLoader | null = null;
+
+function getLoader(env: any): R2ContentLoader {
+  if (!loader && env?.CONTENT_BUCKET) {
+    loader = new R2ContentLoader(
+      {
+        bucket: env.CONTENT_BUCKET,
+        cacheTTL: 5 * 60 * 1000,
+      },
+      {
+        md2html: {
+          imagePathPrefix: 'images/',
+          styleOptions: {
+            classPrefix: 'md-',
+            addHeadingIds: true
+          }
+        }
+      }
+    );
+  }
+  return loader!;
+}
+
+export function clearContentCache() {
+  loader?.clearCache();
+}
+
+export async function handleHome(env?: any): Promise<Response> {
+  try {
+    if (!env?.CONTENT_BUCKET) {
+      return new Response(JSON.stringify({ error: 'Content bucket not configured' }), {
+        status: 500,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+
+    const r2 = getLoader(env);
+    const [astResult, renderedResult] = await Promise.all([
+      r2.getWithAST('home.md'),
+      r2.getRendered('home.md')
+    ]);
+
+    if (!astResult || !renderedResult) {
+      return new Response(JSON.stringify({
+        contentNodes: [],
+        processedMarkdown: '',
+        content: ''
+      } as HomeApiResponse), {
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+
+    const responseData: HomeApiResponse = {
+      contentNodes: astResult.contentNodes,
+      processedMarkdown: '',
+      content: renderedResult.content
+    };
+
+    return new Response(JSON.stringify(responseData), {
+      headers: { 'Content-Type': 'application/json' },
+    });
+  } catch (error) {
+    console.error('Error serving home content:', error);
+    return new Response(JSON.stringify({ error: 'Content not available' }), {
+      status: 500,
+      headers: { 'Content-Type': 'application/json' },
+    });
+  }
+}

package/src/api/handlers/info.ts

@@ -0,0 +1,12 @@
+import { createJSONResponse } from '../utils';
+
+export async function handleInfo(): Promise<Response> {
+  return createJSONResponse({
+    name: 'TechieLeader',
+    version: '1.0.0',
+    description: 'TechieLeader API',
+    endpoints: [
+      { path: '/info', method: 'GET', description: 'Get API information' }
+    ]
+  });
+}