checkpoint

Author: tannerlinsley

src/components/ShowcaseGallery.tsx

@@ -28,7 +28,7 @@ export function ShowcaseGallery() {
         pageSize: 24,
       },
       filters: {
-        libraryId: search.libraryId,
+        libraryIds: search.libraryIds,
         useCases: search.useCases as ShowcaseUseCase[],
         q: search.q,
       },
@@ -67,7 +67,7 @@ export function ShowcaseGallery() {
         getApprovedShowcasesQueryOptions({
           pagination: { page: search.page, pageSize: 24 },
           filters: {
-            libraryId: search.libraryId,
+            libraryIds: search.libraryIds,
             useCases: search.useCases as ShowcaseUseCase[],
             q: search.q,
           },
@@ -111,7 +111,7 @@ export function ShowcaseGallery() {
         getApprovedShowcasesQueryOptions({
           pagination: { page: search.page, pageSize: 24 },
           filters: {
-            libraryId: search.libraryId,
+            libraryIds: search.libraryIds,
             useCases: search.useCases as ShowcaseUseCase[],
             q: search.q,
           },
@@ -152,7 +152,7 @@ export function ShowcaseGallery() {
           getApprovedShowcasesQueryOptions({
             pagination: { page: search.page, pageSize: 24 },
             filters: {
-              libraryId: search.libraryId,
+              libraryIds: search.libraryIds,
               useCases: search.useCases as ShowcaseUseCase[],
               q: search.q,
             },
@@ -182,11 +182,25 @@ export function ShowcaseGallery() {
     voteMutation.mutate({ showcaseId, value })
   }
 
-  const handleLibraryFilter = (libraryId: string | undefined) => {
+  const handleLibraryToggle = (libraryId: string) => {
+    const current = search.libraryIds || []
+    const updated = current.includes(libraryId)
+      ? current.filter((id: string) => id !== libraryId)
+      : [...current, libraryId]
     navigate({
       search: (prev: typeof search) => ({
         ...prev,
-        libraryId,
+        libraryIds: updated.length > 0 ? updated : undefined,
+        page: 1,
+      }),
+    })
+  }
+
+  const clearLibraries = () => {
+    navigate({
+      search: (prev: typeof search) => ({
+        ...prev,
+        libraryIds: undefined,
         page: 1,
       }),
     })
@@ -236,15 +250,15 @@ export function ShowcaseGallery() {
     navigate({
       search: {
         page: 1,
-        libraryId: undefined,
+        libraryIds: undefined,
         useCases: undefined,
         q: undefined,
       },
     })
   }
 
   const hasFilters =
-    search.libraryId ||
+    (search.libraryIds && search.libraryIds.length > 0) ||
     (search.useCases && search.useCases.length > 0) ||
     search.q
 
@@ -279,11 +293,12 @@ export function ShowcaseGallery() {
         <div className="max-w-7xl mx-auto px-4 py-3">
           <ShowcaseTopBarFilters
             filters={{
-              libraryId: search.libraryId,
+              libraryIds: search.libraryIds,
               useCases: search.useCases as ShowcaseUseCase[],
               q: search.q,
             }}
-            onLibraryChange={handleLibraryFilter}
+            onLibraryToggle={handleLibraryToggle}
+            onClearLibraries={clearLibraries}
             onUseCaseToggle={handleUseCaseFilter}
             onClearUseCases={clearUseCases}
             onClearFilters={clearFilters}

src/components/ShowcaseTopBarFilters.tsx

@@ -8,14 +8,15 @@ import { SHOWCASE_USE_CASES, type ShowcaseUseCase } from '~/db/types'
 import { USE_CASE_LABELS } from '~/utils/showcase.client'
 
 interface ShowcaseFilters {
-  libraryId?: string
+  libraryIds?: string[]
   useCases?: ShowcaseUseCase[]
   q?: string
 }
 
 interface ShowcaseTopBarFiltersProps {
   filters: ShowcaseFilters
-  onLibraryChange: (libraryId: string | undefined) => void
+  onLibraryToggle: (libraryId: string) => void
+  onClearLibraries: () => void
   onUseCaseToggle: (useCase: ShowcaseUseCase) => void
   onClearUseCases: () => void
   onClearFilters: () => void
@@ -32,21 +33,18 @@ const LIBRARY_OPTIONS = libraries
 
 export function ShowcaseTopBarFilters({
   filters,
-  onLibraryChange,
+  onLibraryToggle,
+  onClearLibraries,
   onUseCaseToggle,
   onClearUseCases,
   onClearFilters,
   onSearchChange,
 }: ShowcaseTopBarFiltersProps) {
   const hasActiveFilters =
-    !!filters.libraryId ||
+    (filters.libraryIds && filters.libraryIds.length > 0) ||
     (filters.useCases && filters.useCases.length > 0) ||
     !!filters.q
 
-  const selectedLibrary = LIBRARY_OPTIONS.find(
-    (lib) => lib.id === filters.libraryId,
-  )
-
   return (
     <TopBarFilter
       onClearAll={onClearFilters}
@@ -59,23 +57,18 @@ export function ShowcaseTopBarFilters({
     >
       {/* Library Facet */}
       <FacetFilterButton
-        label={
-          selectedLibrary ? `Library: ${selectedLibrary.label}` : 'Library'
-        }
-        hasSelection={!!filters.libraryId}
-        onClear={() => onLibraryChange(undefined)}
+        label="Library"
+        hasSelection={filters.libraryIds && filters.libraryIds.length > 0}
+        selectionCount={filters.libraryIds?.length}
+        onClear={onClearLibraries}
       >
         <div className="space-y-0.5">
           {LIBRARY_OPTIONS.map((lib) => (
             <FilterCheckbox
               key={lib.id}
               label={lib.label}
-              checked={filters.libraryId === lib.id}
-              onChange={() =>
-                onLibraryChange(
-                  filters.libraryId === lib.id ? undefined : lib.id,
-                )
-              }
+              checked={filters.libraryIds?.includes(lib.id) ?? false}
+              onChange={() => onLibraryToggle(lib.id)}
             />
           ))}
         </div>

src/queries/showcases.ts

@@ -35,7 +35,7 @@ export const getMyShowcasesQueryOptions = (params: {
 export const getApprovedShowcasesQueryOptions = (params: {
   pagination: ShowcasePagination
   filters?: {
-    libraryId?: string
+    libraryIds?: string[]
     useCases?: ShowcaseUseCase[]
     featured?: boolean
     q?: string

src/routes/admin/npm-stats.tsx

@@ -273,14 +273,20 @@ function NpmStatsAdmin() {
     getCoreRowModel: getCoreRowModel(),
   })
 
+  const packages = useMemo(
+    () =>
+      [...(packagesData?.packages ?? [])].sort(
+        (a, b) => (b.downloads ?? 0) - (a.downloads ?? 0),
+      ),
+    [packagesData?.packages],
+  )
+
   const packagesTable = useReactTable({
-    data: packagesData?.packages ?? [],
+    data: packages,
     columns: packageColumns,
     getCoreRowModel: getCoreRowModel(),
   })
 
-  const packages = packagesData?.packages ?? []
-
   return (
     <div className="w-full p-4">
       <div className="max-w-7xl mx-auto">

src/routes/showcase/index.tsx

@@ -3,14 +3,14 @@ import * as v from 'valibot'
 import { seo } from '~/utils/seo'
 import { ShowcaseGallery } from '~/components/ShowcaseGallery'
 import { getApprovedShowcasesQueryOptions } from '~/queries/showcases'
-import { showcaseUseCaseSchema } from '~/utils/schemas'
+import { libraryIdSchema, showcaseUseCaseSchema } from '~/utils/schemas'
 
 export const Route = createFileRoute('/showcase/')({
   validateSearch: (search) => {
     const parsed = v.parse(
       v.object({
         page: v.optional(v.number(), 1),
-        libraryId: v.optional(v.string()),
+        libraryIds: v.optional(v.array(libraryIdSchema)),
         useCases: v.optional(v.array(showcaseUseCaseSchema)),
         q: v.optional(v.string()),
       }),
@@ -21,7 +21,7 @@ export const Route = createFileRoute('/showcase/')({
   },
   loaderDeps: ({ search }) => ({
     page: search.page,
-    libraryId: search.libraryId,
+    libraryIds: search.libraryIds,
     useCases: search.useCases,
     q: search.q,
   }),
@@ -33,8 +33,8 @@ export const Route = createFileRoute('/showcase/')({
           pageSize: 24,
         },
         filters: {
-          libraryId: deps.libraryId,
-          useCases: deps.useCases as any,
+          libraryIds: deps.libraryIds,
+          useCases: deps.useCases,
           q: deps.q,
         },
       }),

src/utils/auth.server-helpers.ts

@@ -9,6 +9,7 @@
 
 import { getRequest } from '@tanstack/react-start/server'
 import { getAuthService, getSessionService } from '~/auth/index.server'
+import { recordDailyActivity } from './activity.server'
 
 /**
  * Get current user from request
@@ -30,6 +31,11 @@ export async function getAuthenticatedUser() {
     throw new Error('Not authenticated')
   }
 
+  // Record daily activity for streak tracking (fire and forget)
+  recordDailyActivity(user.userId).catch(() => {
+    // Silently ignore errors to not break auth flow
+  })
+
   return user
 }
 

src/utils/showcase.functions.ts

@@ -383,7 +383,7 @@ export const getApprovedShowcases = createServerFn({ method: 'POST' })
       }),
       filters: v.optional(
         v.object({
-          libraryId: v.optional(v.string()),
+          libraryIds: v.optional(v.array(v.string())),
           useCases: v.optional(v.array(showcaseUseCaseSchema)),
           featured: v.optional(v.boolean()),
           q: v.optional(v.string()),
@@ -398,8 +398,15 @@ export const getApprovedShowcases = createServerFn({ method: 'POST' })
     // Build where conditions
     const conditions = [eq(showcases.status, 'approved' as ShowcaseStatus)]
 
-    if (filters.libraryId) {
-      conditions.push(arrayContains(showcases.libraries, [filters.libraryId]))
+    if (filters.libraryIds && filters.libraryIds.length > 0) {
+      // Match showcases that have ANY of the selected libraries
+      conditions.push(
+        or(
+          ...filters.libraryIds.map((libId) =>
+            arrayContains(showcases.libraries, [libId]),
+          ),
+        )!,
+      )
     }
 
     if (filters.useCases && filters.useCases.length > 0) {

src/utils/stats.functions.ts

@@ -341,42 +341,50 @@ async function fetchNpmPackageCreationDate(
 }
 
 /**
- * Normalize date ranges into consistent chunk boundaries
- * Uses fixed 500-day chunks aligned to calendar dates for cache consistency
+ * Normalize date ranges into consistent year-based chunk boundaries
+ * Uses calendar years for stable cache keys that don't shift daily
  *
  * This ensures the same date ranges are used across all fetches, preventing
- * duplicate cache entries with different keys (e.g., 2025-12-06 vs 2025-12-07)
+ * duplicate cache entries. Historical years are immutable (Jan 1 - Dec 31),
+ * current year ends at today's date.
  */
 function generateNormalizedChunks(
   startDate: string,
   endDate: string,
 ): Array<{ from: string; to: string }> {
-  const CHUNK_DAYS = 500 // Stay well under 18-month (549 day) limit
+  const NPM_STATS_START_DATE = '2015-01-10'
   const chunks: Array<{ from: string; to: string }> = []
 
-  let currentFrom = new Date(startDate)
-  const finalDate = new Date(endDate)
+  const startYear = new Date(startDate).getFullYear()
+  const endYear = new Date(endDate).getFullYear()
+  const currentYear = new Date().getFullYear()
+  const today = new Date().toISOString().substring(0, 10)
 
-  while (currentFrom <= finalDate) {
-    const from = currentFrom.toISOString().substring(0, 10)
+  for (let year = startYear; year <= endYear; year++) {
+    let from = `${year}-01-01`
+    let to = `${year}-12-31`
 
-    // Calculate chunk end: either CHUNK_DAYS later or finalDate, whichever is earlier
-    const potentialTo = new Date(currentFrom)
-    potentialTo.setDate(potentialTo.getDate() + CHUNK_DAYS - 1) // -1 because inclusive
+    // Adjust start date if before npm stats started
+    if (from < NPM_STATS_START_DATE) {
+      from = NPM_STATS_START_DATE
+    }
 
-    const to =
-      potentialTo > finalDate
-        ? finalDate.toISOString().substring(0, 10)
-        : potentialTo.toISOString().substring(0, 10)
+    // Current year ends at today
+    if (year === currentYear) {
+      to = today
+    }
 
-    chunks.push({ from, to })
+    // Skip if the entire chunk is before npm stats started
+    if (to < NPM_STATS_START_DATE) {
+      continue
+    }
 
-    // Move to next chunk (day after current chunk ends)
-    currentFrom = new Date(to)
-    currentFrom.setDate(currentFrom.getDate() + 1)
+    // Skip future years
+    if (year > currentYear) {
+      continue
+    }
 
-    // Prevent infinite loop if we've reached the end
-    if (to === endDate) break
+    chunks.push({ from, to })
   }
 
   return chunks