@fullstackdatasolutions/articles 0.1.0

package/src/server-articles.ts

@@ -0,0 +1,265 @@
+import { cache } from 'react'
+import matter from 'gray-matter'
+import fs from 'node:fs'
+import path from 'node:path'
+import readingTime from 'reading-time'
+import { markdownToHtml } from './markdown'
+import type { Article, CategoryInfo } from './articleTypes'
+
+const articlesDirectory = path.join(process.cwd(), 'public/articles')
+
+function getReadingTime(content: string): string {
+  return readingTime(content).text
+}
+
+function findArticleImage(slug: string): string | null {
+  try {
+    const articleDir = path.join(articlesDirectory, slug)
+    const entries: (fs.Dirent | string)[] = fs.readdirSync(articleDir, { withFileTypes: true })
+    const names = entries
+      .map((entry) => {
+        if (typeof entry === 'string') return entry
+        if (entry && typeof entry.name === 'string') return entry.name
+        return null
+      })
+      .filter((name): name is string => Boolean(name))
+    const imageExtensions = ['.png', '.jpg', '.jpeg', '.gif', '.webp']
+    const imageFileName = names.find((name) =>
+      imageExtensions.some((ext) => name.toLowerCase().endsWith(ext))
+    )
+    return imageFileName ? sanitizeImagePath(imageFileName, slug) : null
+  } catch {
+    return null
+  }
+}
+
+function sanitizeImagePath(rawPath: string, articleSlug: string): string | null {
+  if (!rawPath || typeof rawPath !== 'string') return null
+  const cleanPath = rawPath.replaceAll(/[\x00-\x1f\x7f-\x9f]/g, '')
+  if (cleanPath.startsWith('http://') || cleanPath.startsWith('https://')) return cleanPath
+  if (cleanPath.includes('..') || cleanPath.includes('\\') || cleanPath.startsWith('/')) {
+    console.warn(`Potentially unsafe image path detected: ${cleanPath}`)
+    return null
+  }
+  if (!/^[a-zA-Z0-9._/-]+$/.test(cleanPath)) {
+    console.warn(`Invalid characters in image path: ${cleanPath}`)
+    return null
+  }
+  if (cleanPath.includes('/')) {
+    const normalizedPath = path.normalize(cleanPath)
+    if (normalizedPath.startsWith('..') || normalizedPath.includes('../')) {
+      console.warn(`Path traversal attempt detected: ${cleanPath}`)
+      return null
+    }
+    return `/articles/${articleSlug}/${cleanPath}`
+  }
+  return `/articles/${articleSlug}/${cleanPath}`
+}
+
+export function getAvailableArticleSlugs(): string[] {
+  try {
+    if (!fs.existsSync(articlesDirectory)) return []
+    const items = fs.readdirSync(articlesDirectory, { withFileTypes: true })
+    return items
+      .filter((item) => item.isDirectory())
+      .filter((dir) => {
+        const articleDir = path.join(articlesDirectory, dir.name)
+        try {
+          const entries: (fs.Dirent | string)[] = fs.readdirSync(articleDir, {
+            withFileTypes: true,
+          })
+          return entries.some((entry) => {
+            const name = typeof entry === 'string' ? entry : entry?.name
+            if (name !== 'article.md') return false
+            if (typeof entry === 'string') return true
+            if (typeof entry?.isFile === 'function') return entry.isFile()
+            return true
+          })
+        } catch {
+          return false
+        }
+      })
+      .map((dir) => dir.name)
+  } catch (error) {
+    console.error('Error reading articles directory:', error)
+    return []
+  }
+}
+
+async function getArticleSummary(slug: string): Promise<Article | null> {
+  try {
+    const articlePath = path.join(articlesDirectory, slug, 'article.md')
+    if (!fs.existsSync(articlePath)) return null
+    const fileContent = fs.readFileSync(articlePath, 'utf8')
+    const { data, content: markdownContent } = matter(fileContent)
+    const readTime = getReadingTime(markdownContent)
+    let featuredImage = data.featuredImage || ''
+    if (featuredImage && !featuredImage.startsWith('http')) {
+      const sanitizedPath = sanitizeImagePath(featuredImage, slug)
+      featuredImage = sanitizedPath || '/placeholder-logo.png'
+    } else if (!featuredImage) {
+      featuredImage = findArticleImage(slug) || '/placeholder-logo.png'
+    }
+    let articleDate: string | undefined
+    if (data.date) {
+      try {
+        const parsedDate = new Date(data.date)
+        if (!Number.isNaN(parsedDate.getTime())) {
+          articleDate = parsedDate.toISOString().split('T')[0]
+        }
+      } catch {
+        console.warn(`Invalid date for article ${slug}: ${data.date}`)
+      }
+    }
+    const allTags: string[] = Array.isArray(data.tags)
+      ? data.tags.filter((t: unknown) => typeof t === 'string' && String(t).trim())
+      : []
+    const categories: string[] =
+      allTags.length > 0 ? allTags.map((t: string) => t.replaceAll('-', ' ').trim()) : ['Campaigns']
+    return {
+      slug,
+      title: data.title || slug.replaceAll('-', ' '),
+      excerpt: data.excerpt || '',
+      date: articleDate,
+      author: data.author || 'Andrew Blase',
+      category: categories[0],
+      categories,
+      readTime,
+      featuredImage,
+      tags: data.tags || [],
+    }
+  } catch (error) {
+    console.error(`Error loading article ${slug}:`, error)
+    return null
+  }
+}
+
+export const getArticleMetadata = cache(async (slug: string): Promise<Article | null> => {
+  try {
+    const articlePath = path.join(articlesDirectory, slug, 'article.md')
+    if (!fs.existsSync(articlePath)) return null
+    const fileContent = fs.readFileSync(articlePath, 'utf8')
+    const { data, content: markdownContent } = matter(fileContent)
+    const htmlContent = await markdownToHtml(markdownContent, slug)
+    const readTime = getReadingTime(markdownContent)
+    let featuredImage = data.featuredImage || ''
+    if (featuredImage && !featuredImage.startsWith('http')) {
+      const sanitizedPath = sanitizeImagePath(featuredImage, slug)
+      featuredImage = sanitizedPath || '/placeholder-logo.png'
+    } else if (!featuredImage) {
+      featuredImage = findArticleImage(slug) || '/placeholder-logo.png'
+    }
+    let articleDate: string | undefined
+    if (data.date) {
+      try {
+        const parsedDate = new Date(data.date)
+        if (!Number.isNaN(parsedDate.getTime())) {
+          articleDate = parsedDate.toISOString().split('T')[0]
+        }
+      } catch {
+        console.warn(`Invalid date for article ${slug}: ${data.date}`)
+      }
+    }
+    const allTags: string[] = Array.isArray(data.tags)
+      ? data.tags.filter((t: unknown) => typeof t === 'string' && String(t).trim())
+      : []
+    const categories: string[] =
+      allTags.length > 0 ? allTags.map((t: string) => t.replaceAll('-', ' ').trim()) : ['Campaigns']
+    return {
+      slug,
+      title: data.title || slug.replaceAll('-', ' '),
+      excerpt: data.excerpt || '',
+      date: articleDate,
+      author: data.author || 'Andrew Blase',
+      category: categories[0],
+      categories,
+      readTime,
+      featuredImage,
+      tags: data.tags || [],
+      content: markdownContent,
+      htmlContent,
+    }
+  } catch (error) {
+    console.error(`Error loading article ${slug}:`, error)
+    return null
+  }
+})
+
+export const getAllArticles = cache(async (): Promise<Article[]> => {
+  const slugs = getAvailableArticleSlugs()
+  const articles = await Promise.all(slugs.map((slug) => getArticleSummary(slug)))
+  const currentDate = new Date().toISOString().split('T')[0]
+  return articles
+    .filter((article): article is Article => article !== null)
+    .filter((article) => !article.date || article.date <= currentDate)
+    .sort((a, b) => {
+      if (!a.date && !b.date) return 0
+      if (!a.date) return 1
+      if (!b.date) return -1
+      return new Date(b.date).getTime() - new Date(a.date).getTime()
+    })
+})
+
+export async function getAdjacentArticles(
+  currentSlug: string
+): Promise<{ previous: Article | null; next: Article | null }> {
+  const allArticles = await getAllArticles()
+  const currentIndex = allArticles.findIndex((article) => article.slug === currentSlug)
+  if (currentIndex === -1) return { previous: null, next: null }
+  const previous = currentIndex < allArticles.length - 1 ? allArticles[currentIndex + 1] : null
+  const next = currentIndex > 0 ? allArticles[currentIndex - 1] : null
+  return { previous, next }
+}
+
+export async function searchArticles(query: string): Promise<Article[]> {
+  if (!query?.trim()) return getAllArticles()
+  const articles = await getAllArticles()
+  const searchTerm = query.toLowerCase().trim()
+  return articles.filter((article) => {
+    const matchesTitle = article.title.toLowerCase().includes(searchTerm)
+    const matchesExcerpt = article.excerpt.toLowerCase().includes(searchTerm)
+    const matchesAuthor = article.author.toLowerCase().includes(searchTerm)
+    const matchesCategory = article.categories.some((cat) => cat.toLowerCase().includes(searchTerm))
+    const matchesTags = article.tags?.some((tag) => tag.toLowerCase().includes(searchTerm))
+    return (
+      matchesTitle || matchesExcerpt || matchesAuthor || matchesCategory || Boolean(matchesTags)
+    )
+  })
+}
+
+export function categoryToSlug(category: string): string {
+  return category
+    .toLowerCase()
+    .replaceAll(/\s+/g, '-')
+    .replaceAll(/[^a-z0-9-]/g, '')
+}
+
+export async function getAllCategories(): Promise<CategoryInfo[]> {
+  const articles = await getAllArticles()
+  const categoryMap = new Map<string, { count: number; featuredImage: string }>()
+  for (const article of articles) {
+    for (const cat of article.categories) {
+      if (!categoryMap.has(cat)) {
+        categoryMap.set(cat, { count: 0, featuredImage: article.featuredImage })
+      }
+      categoryMap.get(cat)!.count++
+    }
+  }
+  return Array.from(categoryMap.entries())
+    .map(([name, { count, featuredImage }]) => ({
+      name,
+      slug: categoryToSlug(name),
+      count,
+      featuredImage,
+    }))
+    .sort((a, b) => b.count - a.count)
+}
+
+export async function getArticlesByCategory(categorySlug: string): Promise<Article[]> {
+  const articles = await getAllArticles()
+  return articles.filter((article) =>
+    article.categories.some((cat) => categoryToSlug(cat) === categorySlug)
+  )
+}
+
+export { sanitizeImagePath }

package/src/server.ts

@@ -0,0 +1,25 @@
+// Server-only exports — uses fs/path; never import this in a client bundle
+export {
+  getAllArticles,
+  getArticleMetadata,
+  getAvailableArticleSlugs,
+  getAdjacentArticles,
+  searchArticles,
+  getAllCategories,
+  getArticlesByCategory,
+  categoryToSlug,
+  sanitizeImagePath,
+} from './server-articles'
+
+export {
+  generateArticleStaticParams,
+  generateCategoryStaticParams,
+  generateArticleMetadata,
+  generateCategoryMetadata,
+  getArticleSitemapEntries,
+} from './seoUtils'
+
+export { markdownToHtml } from './markdown'
+
+export type { Article, CategoryInfo } from './articleTypes'
+export type { ArticlesConfig } from './articlesConfig'

package/src/useArticles.ts

@@ -0,0 +1,93 @@
+'use client'
+
+import { useState, useCallback, useEffect, useRef } from 'react'
+import { Article, CategoryInfo } from './articleTypes'
+
+export interface UseArticlesReturn {
+  articles: Article[]
+  categories: CategoryInfo[]
+  searchQuery: string
+  loading: boolean
+  error: string | null
+  handleSearch: (query: string) => void
+}
+
+export function useArticles(): UseArticlesReturn {
+  const [searchQuery, setSearchQuery] = useState('')
+  const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null)
+  const [articles, setArticles] = useState<Article[]>([])
+  const [categories, setCategories] = useState<CategoryInfo[]>([])
+  const [loading, setLoading] = useState(true)
+  const [error, setError] = useState<string | null>(null)
+
+  const fetchArticles = useCallback(async (query: string) => {
+    try {
+      setLoading(true)
+      const url = query ? `/api/articles?q=${encodeURIComponent(query)}` : '/api/articles'
+      const response = await fetch(url)
+
+      if (!response.ok) throw new Error('Failed to fetch articles')
+
+      const data = await response.json()
+      setArticles(data.articles)
+
+      if (!query?.trim()) {
+        const catMap = new Map<string, { count: number; featuredImage: string }>()
+        for (const article of data.articles as Article[]) {
+          for (const cat of article.categories) {
+            if (!catMap.has(cat)) {
+              catMap.set(cat, { count: 0, featuredImage: article.featuredImage })
+            }
+            catMap.get(cat)!.count++
+          }
+        }
+        setCategories(
+          Array.from(catMap.entries())
+            .map(([name, { count, featuredImage }]) => ({
+              name,
+              slug: name
+                .toLowerCase()
+                .replaceAll(/\s+/g, '-')
+                .replaceAll(/[^a-z0-9-]/g, ''),
+              count,
+              featuredImage,
+            }))
+            .sort((a, b) => b.count - a.count)
+        )
+      }
+
+      setError(null)
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Failed to load articles')
+      setArticles([])
+    } finally {
+      setLoading(false)
+    }
+  }, [])
+
+  useEffect(() => {
+    fetchArticles('')
+  }, [fetchArticles])
+
+  const handleSearch = useCallback(
+    (query: string) => {
+      setSearchQuery(query)
+      if (debounceRef.current) clearTimeout(debounceRef.current)
+      if (query === '') {
+        fetchArticles('')
+      } else if (query.length >= 3) {
+        debounceRef.current = setTimeout(() => fetchArticles(query), 1000)
+      }
+    },
+    [fetchArticles]
+  )
+
+  useEffect(
+    () => () => {
+      if (debounceRef.current) clearTimeout(debounceRef.current)
+    },
+    []
+  )
+
+  return { articles, categories, searchQuery, loading, error, handleSearch }
+}