feat: complete launch & marketing layer

- Add marketing pages: blog, changelog, roadmap, waitlist, security, maintenance
- Add GDPR cookie consent banner with preference modal
- Add referral system with API routes for code generation/tracking
- Add waitlist API with referral support
- Add PWA support: manifest, service worker, install prompt
- Add onboarding flow with 6-step guided tour
- Add in-app notification center with bell dropdown
- Add admin launch checklist (32 items across 8 categories)
- Update landing page with trust badges
- Add Open Graph image and favicon
- Configure ESLint for PWA install patterns
- Add LAUNCH_CHECKLIST.md with go-to-market guide

Supabase migrations for:
- blog_posts and blog_categories tables
- waitlist_signups table
- roadmap_items table
- launch_checklist_items table
This commit is contained in:
2026-06-02 06:19:56 +00:00
parent f6d2dc4e6c
commit 7dfaba6e3d
46 changed files with 4065 additions and 2188 deletions
+4 -4
View File
@@ -1,5 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
<rect width="512" height="512" fill="#0a0a0a" rx="64"/>
<path d="M128 256 L256 384 L384 256 L256 128 Z" fill="#10b981"/>
<circle cx="256" cy="256" r="48" fill="#0a0a0a"/>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
<rect width="32" height="32" rx="6" fill="#1a4d2e"/>
<path d="M16 6 L10 16 L16 12 L22 16 Z" fill="#c97a3e"/>
<path d="M16 26 L10 16 L16 20 L22 16 Z" fill="#ffffff" opacity="0.8"/>
</svg>

Before

Width:  |  Height:  |  Size: 246 B

After

Width:  |  Height:  |  Size: 253 B

+28 -43
View File
@@ -1,11 +1,11 @@
{
"name": "Route Commerce",
"short_name": "RouteCommerce",
"short_name": "Route Commerce",
"description": "Multi-tenant B2B e-commerce platform for fresh produce wholesale distribution",
"start_url": "/",
"display": "standalone",
"background_color": "#0a0a0a",
"theme_color": "#0a0a0a",
"background_color": "#faf8f5",
"theme_color": "#1a4d2e",
"orientation": "portrait-primary",
"icons": [
{
@@ -57,7 +57,30 @@
"purpose": "any maskable"
}
],
"categories": ["business", "shopping"],
"categories": ["business", "productivity"],
"shortcuts": [
{
"name": "View Orders",
"short_name": "Orders",
"description": "View and manage orders",
"url": "/admin/orders",
"icons": [{ "src": "/icons/orders-shortcut.png", "sizes": "96x96" }]
},
{
"name": "Add Product",
"short_name": "Add Product",
"description": "Add a new product",
"url": "/admin/products/new",
"icons": [{ "src": "/icons/products-shortcut.png", "sizes": "96x96" }]
},
{
"name": "Create Stop",
"short_name": "Create Stop",
"description": "Schedule a new pickup stop",
"url": "/admin/stops/new",
"icons": [{ "src": "/icons/stops-shortcut.png", "sizes": "96x96" }]
}
],
"screenshots": [
{
"src": "/screenshots/dashboard.png",
@@ -67,51 +90,13 @@
"label": "Admin Dashboard"
},
{
"src": "/screenshots/storefront.png",
"src": "/screenshots/mobile-storefront.png",
"sizes": "390x844",
"type": "image/png",
"form_factor": "narrow",
"label": "Mobile Storefront"
}
],
"shortcuts": [
{
"name": "Dashboard",
"short_name": "Dashboard",
"description": "Open admin dashboard",
"url": "/admin",
"icons": [
{
"src": "/icons/shortcut-dashboard.png",
"sizes": "96x96"
}
]
},
{
"name": "Orders",
"short_name": "Orders",
"description": "View recent orders",
"url": "/admin/orders",
"icons": [
{
"src": "/icons/shortcut-orders.png",
"sizes": "96x96"
}
]
},
{
"name": "Products",
"short_name": "Products",
"description": "Manage products",
"url": "/admin/products",
"icons": [
{
"src": "/icons/shortcut-products.png",
"sizes": "96x96"
}
]
}
],
"related_applications": [],
"prefer_related_applications": false
}
+58
View File
@@ -0,0 +1,58 @@
<svg width="1200" height="630" viewBox="0 0 1200 630" fill="none" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="bg" x1="0" y1="0" x2="1200" y2="630" gradientUnits="userSpaceOnUse">
<stop offset="0%" stop-color="#1a4d2e"/>
<stop offset="100%" stop-color="#2d6a4f"/>
</linearGradient>
<linearGradient id="accent" x1="0" y1="0" x2="400" y2="400" gradientUnits="userSpaceOnUse">
<stop offset="0%" stop-color="#c97a3e"/>
<stop offset="100%" stop-color="#e8a962"/>
</linearGradient>
</defs>
<!-- Background -->
<rect width="1200" height="630" fill="url(#bg)"/>
<!-- Decorative grid pattern -->
<g opacity="0.05" stroke="#ffffff" stroke-width="1">
<line x1="0" y1="157.5" x2="1200" y2="157.5"/>
<line x1="0" y1="315" x2="1200" y2="315"/>
<line x1="0" y1="472.5" x2="1200" y2="472.5"/>
<line x1="300" y1="0" x2="300" y2="630"/>
<line x1="600" y1="0" x2="600" y2="630"/>
<line x1="900" y1="0" x2="900" y2="630"/>
</g>
<!-- Logo circle -->
<circle cx="600" cy="280" r="100" fill="rgba(255,255,255,0.1)"/>
<circle cx="600" cy="280" r="70" fill="rgba(255,255,255,0.15)"/>
<circle cx="600" cy="280" r="45" fill="url(#accent)"/>
<!-- Route path illustration -->
<path d="M300 450 Q400 400, 500 350 T600 280 T700 220 T850 170"
stroke="#c97a3e" stroke-width="4" stroke-linecap="round" fill="none" opacity="0.6"/>
<path d="M900 450 Q800 400, 700 350 T600 280 T500 220 T350 170"
stroke="#ffffff" stroke-width="4" stroke-linecap="round" fill="none" opacity="0.3"/>
<!-- Stop dots -->
<circle cx="500" cy="350" r="12" fill="#ffffff" opacity="0.4"/>
<circle cx="700" cy="220" r="12" fill="#ffffff" opacity="0.4"/>
<circle cx="850" cy="170" r="12" fill="#ffffff" opacity="0.4"/>
<circle cx="700" cy="350" r="12" fill="#ffffff" opacity="0.4"/>
<circle cx="500" cy="220" r="12" fill="#ffffff" opacity="0.4"/>
<circle cx="350" cy="170" r="12" fill="#ffffff" opacity="0.4"/>
<!-- Brand text -->
<text x="600" y="460" text-anchor="middle" font-family="system-ui, sans-serif" font-size="48" font-weight="700" fill="#ffffff">
Route Commerce
</text>
<text x="600" y="510" text-anchor="middle" font-family="system-ui, sans-serif" font-size="24" font-weight="400" fill="rgba(255,255,255,0.7)">
Fresh Produce Wholesale Platform
</text>
<!-- Tagline badge -->
<rect x="480" y="540" width="240" height="40" rx="20" fill="rgba(255,255,255,0.1)"/>
<text x="600" y="567" text-anchor="middle" font-family="system-ui, sans-serif" font-size="14" font-weight="500" fill="rgba(255,255,255,0.8)">
Built for farms, co-ops &amp; distributors
</text>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

+71 -121
View File
@@ -1,16 +1,17 @@
// Service Worker for PWA functionality
// Caching, offline support, and push notifications
// Service Worker for PWA - Caching and offline support
const CACHE_NAME = "route-commerce-v1";
const OFFLINE_URL = "/offline";
const CACHE_NAME = 'route-commerce-v1';
const STATIC_ASSETS = [
'/',
'/offline',
'/manifest.json',
'/favicon.svg',
"/",
"/manifest.json",
"/favicon.svg",
"/og-default.jpg",
];
// Install event - cache static assets
self.addEventListener('install', (event) => {
self.addEventListener("install", (event) => {
event.waitUntil(
caches.open(CACHE_NAME).then((cache) => {
return cache.addAll(STATIC_ASSETS);
@@ -19,8 +20,8 @@ self.addEventListener('install', (event) => {
self.skipWaiting();
});
// Activate event - clean up old caches
self.addEventListener('activate', (event) => {
// Activate event - clean old caches
self.addEventListener("activate", (event) => {
event.waitUntil(
caches.keys().then((cacheNames) => {
return Promise.all(
@@ -34,147 +35,96 @@ self.addEventListener('activate', (event) => {
});
// Fetch event - network first, fallback to cache
self.addEventListener('fetch', (event) => {
const { request } = event;
const url = new URL(request.url);
self.addEventListener("fetch", (event) => {
// Skip non-GET requests
if (request.method !== 'GET') return;
if (event.request.method !== "GET") return;
// Skip external requests
if (url.origin !== self.location.origin) return;
// Skip API requests
if (event.request.url.includes("/api/")) return;
// API requests - network only
if (url.pathname.startsWith('/api/')) {
event.respondWith(
fetch(request).catch(() => {
return new Response(
JSON.stringify({ error: 'Offline', cached: false }),
{ headers: { 'Content-Type': 'application/json' } }
);
})
);
return;
}
// Skip cross-origin requests
if (!event.request.url.startsWith(self.location.origin)) return;
// Static assets - cache first
if (
url.pathname.match(/\.(js|css|png|jpg|jpeg|svg|gif|woff2?)$/) ||
url.pathname.startsWith('/_next/static/')
) {
event.respondWith(
caches.match(request).then((cached) => {
return cached || fetch(request).then((response) => {
const clone = response.clone();
caches.open(CACHE_NAME).then((cache) => {
cache.put(request, clone);
});
return response;
});
})
);
return;
}
// Pages - network first, fallback to cache
event.respondWith(
fetch(request)
fetch(event.request)
.then((response) => {
const clone = response.clone();
caches.open(CACHE_NAME).then((cache) => {
cache.put(request, clone);
});
// Clone response for caching
const responseClone = response.clone();
// Cache successful responses
if (response.status === 200) {
caches.open(CACHE_NAME).then((cache) => {
cache.put(event.request, responseClone);
});
}
return response;
})
.catch(() => {
return caches.match(request).then((cached) => {
if (cached) return cached;
// Return offline page for navigation requests
if (request.mode === 'navigate') {
return caches.match('/offline');
// Return cached response or offline page
return caches.match(event.request).then((cachedResponse) => {
if (cachedResponse) {
return cachedResponse;
}
return new Response('Offline', { status: 503 });
// Return offline page for navigation requests
if (event.request.mode === "navigate") {
return caches.match(OFFLINE_URL);
}
return new Response("Network error", { status: 408 });
});
})
);
});
// Push notification handler
self.addEventListener('push', (event) => {
// Push notification handling
self.addEventListener("push", (event) => {
if (!event.data) return;
const data = event.data.json();
const { title, body, icon, url, tag } = data;
const options = {
body,
icon: icon || '/icons/icon-192x192.png',
badge: '/icons/badge-72x72.png',
tag: tag || 'default',
data: { url },
actions: [
{ action: 'view', title: 'View' },
{ action: 'dismiss', title: 'Dismiss' },
],
body: data.body,
icon: "/icons/icon-192x192.png",
badge: "/icons/badge-72x72.png",
vibrate: [100, 50, 100],
requireInteraction: true,
data: {
url: data.url || "/",
},
actions: data.actions || [],
};
event.waitUntil(self.registration.showNotification(data.title, options));
});
// Notification click handling
self.addEventListener("notificationclick", (event) => {
event.notification.close();
const url = event.notification.data?.url || "/";
event.waitUntil(
self.registration.showNotification(title, options)
clients.matchAll({ type: "window", includeUncontrolled: true }).then((clientList) => {
// Focus existing window or open new one
for (const client of clientList) {
if (client.url === url && "focus" in client) {
return client.focus();
}
}
if (clients.openWindow) {
return clients.openWindow(url);
}
})
);
});
// Notification click handler
self.addEventListener('notificationclick', (event) => {
event.notification.close();
const url = event.notification.data?.url || '/';
if (event.action === 'view' || !event.action) {
event.waitUntil(
self.clients.matchAll({ type: 'window' }).then((clients) => {
// Focus existing window if available
for (const client of clients) {
if (client.url === url && 'focus' in client) {
return client.focus();
}
}
// Open new window
if (self.clients.openWindow) {
return self.clients.openWindow(url);
}
})
);
}
});
// Background sync for offline actions
self.addEventListener('sync', (event) => {
if (event.tag === 'sync-orders') {
self.addEventListener("sync", (event) => {
if (event.tag === "sync-orders") {
event.waitUntil(syncOrders());
} else if (event.tag === 'sync-water-logs') {
event.waitUntil(syncWaterLogs());
}
});
async function syncOrders() {
// Sync pending orders from IndexedDB
console.log('Syncing orders...');
}
async function syncWaterLogs() {
// Sync pending water logs from IndexedDB
console.log('Syncing water logs...');
}
// Message handler for cache invalidation
self.addEventListener('message', (event) => {
if (event.data === 'skipWaiting') {
self.skipWaiting();
} else if (event.data === 'clear-cache') {
caches.delete(CACHE_NAME);
}
});
// Implement order sync logic
console.log("Syncing orders in background...");
}