@alliance-droid/status-feedback-system 0.1.0

package/dist/components/shared/StatusIndicator.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+	import type { SystemStatus } from '../../types.js';
+
+	interface Props {
+		status: SystemStatus;
+		size?: 'sm' | 'md' | 'lg';
+		showLabel?: boolean;
+	}
+
+	let { status, size = 'md', showLabel = false }: Props = $props();
+
+	const config: Record<SystemStatus, { label: string; icon: string; colorClass: string }> = {
+		operational: {
+			label: 'Operational',
+			icon: 'fa-circle-check',
+			colorClass: 'text-green-500',
+		},
+		degraded: {
+			label: 'Degraded',
+			icon: 'fa-exclamation-triangle',
+			colorClass: 'text-yellow-500',
+		},
+		outage: {
+			label: 'Outage',
+			icon: 'fa-circle-xmark',
+			colorClass: 'text-red-500',
+		},
+		maintenance: {
+			label: 'Maintenance',
+			icon: 'fa-wrench',
+			colorClass: 'text-blue-500',
+		},
+	};
+
+	const sizeClasses: Record<string, string> = {
+		sm: 'text-xs',
+		md: 'text-sm',
+		lg: 'text-base',
+	};
+
+	let current = $derived(config[status]);
+	let sizeClass = $derived(sizeClasses[size]);
+</script>
+
+<span class="inline-flex items-center gap-1.5 {sizeClass}">
+	<i class="fa-solid {current.icon} {current.colorClass}"></i>
+	{#if showLabel}
+		<span class="text-foreground-secondary">{current.label}</span>
+	{/if}
+</span>

package/dist/components/shared/StatusIndicator.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { SystemStatus } from '../../types.js';
+interface Props {
+    status: SystemStatus;
+    size?: 'sm' | 'md' | 'lg';
+    showLabel?: boolean;
+}
+declare const StatusIndicator: import("svelte").Component<Props, {}, "">;
+type StatusIndicator = ReturnType<typeof StatusIndicator>;
+export default StatusIndicator;

package/dist/components/shared/SystemCard.svelte

@@ -0,0 +1,30 @@
+<script lang="ts">
+	import type { System, StatusHistoryEntry } from '../../types.js';
+	import StatusIndicator from './StatusIndicator.svelte';
+	import UptimeBar from './UptimeBar.svelte';
+
+	interface Props {
+		system: System;
+		history?: StatusHistoryEntry[];
+		showUptime?: boolean;
+	}
+
+	let { system, history = [], showUptime = true }: Props = $props();
+</script>
+
+<div class="rounded-lg border border-border bg-surface p-4">
+	<div class="flex items-center justify-between">
+		<div>
+			<h3 class="text-sm font-semibold text-foreground">{system.name}</h3>
+			{#if system.description}
+				<p class="mt-0.5 text-xs text-foreground-tertiary">{system.description}</p>
+			{/if}
+		</div>
+		<StatusIndicator status={system.status} showLabel size="sm" />
+	</div>
+	{#if showUptime && history.length > 0}
+		<div class="mt-3">
+			<UptimeBar {history} />
+		</div>
+	{/if}
+</div>

package/dist/components/shared/SystemCard.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { System, StatusHistoryEntry } from '../../types.js';
+interface Props {
+    system: System;
+    history?: StatusHistoryEntry[];
+    showUptime?: boolean;
+}
+declare const SystemCard: import("svelte").Component<Props, {}, "">;
+type SystemCard = ReturnType<typeof SystemCard>;
+export default SystemCard;

package/dist/components/shared/UptimeBar.svelte

@@ -0,0 +1,85 @@
+<script lang="ts">
+	import type { StatusHistoryEntry, SystemStatus } from '../../types.js';
+
+	interface Props {
+		history: StatusHistoryEntry[];
+		days?: number;
+	}
+
+	let { history, days = 90 }: Props = $props();
+
+	const statusColors: Record<SystemStatus, string> = {
+		operational: '#22c55e',
+		degraded: '#eab308',
+		outage: '#ef4444',
+		maintenance: '#3b82f6',
+	};
+
+	/**
+	 * Build day-by-day status bars from history entries.
+	 * Each day gets the "worst" status that occurred during it.
+	 */
+	let dayBars = $derived.by(() => {
+		const now = Date.now();
+		const msPerDay = 24 * 60 * 60 * 1000;
+		const bars: { date: string; status: SystemStatus; color: string }[] = [];
+
+		const severity: Record<SystemStatus, number> = {
+			operational: 0,
+			maintenance: 1,
+			degraded: 2,
+			outage: 3,
+		};
+
+		for (let i = days - 1; i >= 0; i--) {
+			const dayStart = now - (i + 1) * msPerDay;
+			const dayEnd = now - i * msPerDay;
+			const dateStr = new Date(dayEnd).toLocaleDateString();
+
+			// Find worst status that overlapped with this day
+			let worstStatus: SystemStatus = 'operational';
+			let worstSeverity = 0;
+
+			for (const entry of history) {
+				if (entry.changedAt <= dayEnd && entry.changedAt >= dayStart - msPerDay) {
+					const s = severity[entry.status] ?? 0;
+					if (s > worstSeverity) {
+						worstSeverity = s;
+						worstStatus = entry.status;
+					}
+				}
+			}
+
+			bars.push({
+				date: dateStr,
+				status: worstStatus,
+				color: statusColors[worstStatus],
+			});
+		}
+
+		return bars;
+	});
+
+	let uptimePercent = $derived.by(() => {
+		if (dayBars.length === 0) return 100;
+		const operational = dayBars.filter((d) => d.status === 'operational').length;
+		return Math.round((operational / dayBars.length) * 1000) / 10;
+	});
+</script>
+
+<div class="space-y-1">
+	<div class="flex items-center justify-between text-xs text-foreground-tertiary">
+		<span>{days} days ago</span>
+		<span>{uptimePercent}% uptime</span>
+		<span>Today</span>
+	</div>
+	<div class="flex gap-px">
+		{#each dayBars as bar}
+			<div
+				class="h-8 flex-1 rounded-sm transition-opacity hover:opacity-80"
+				style="background-color: {bar.color}"
+				title="{bar.date}: {bar.status}"
+			></div>
+		{/each}
+	</div>
+</div>

package/dist/components/shared/UptimeBar.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { StatusHistoryEntry } from '../../types.js';
+interface Props {
+    history: StatusHistoryEntry[];
+    days?: number;
+}
+declare const UptimeBar: import("svelte").Component<Props, {}, "">;
+type UptimeBar = ReturnType<typeof UptimeBar>;
+export default UptimeBar;

package/dist/components/shared/index.d.ts

@@ -0,0 +1,4 @@
+export { default as StatusIndicator } from './StatusIndicator.svelte';
+export { default as UptimeBar } from './UptimeBar.svelte';
+export { default as IncidentTimeline } from './IncidentTimeline.svelte';
+export { default as SystemCard } from './SystemCard.svelte';

package/dist/components/shared/index.js

@@ -0,0 +1,4 @@
+export { default as StatusIndicator } from './StatusIndicator.svelte';
+export { default as UptimeBar } from './UptimeBar.svelte';
+export { default as IncidentTimeline } from './IncidentTimeline.svelte';
+export { default as SystemCard } from './SystemCard.svelte';

package/dist/index.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @alliance-droid/status-feedback-system
+ *
+ * Drop-in system status pages and user feedback forms for SvelteKit apps.
+ *
+ * Client exports (components):
+ *   import { StatusPage, FeedbackForm } from '@alliance-droid/status-feedback-system';
+ *
+ * Server exports:
+ *   import { createStatusServer } from '@alliance-droid/status-feedback-system/server';
+ *
+ * Admin exports:
+ *   import { AdminDashboard } from '@alliance-droid/status-feedback-system/admin';
+ */
+export type { Project, System, Incident, IncidentUpdate, Feedback, StatusHistoryEntry, SystemStatus, IncidentStatus, IncidentSeverity, FeedbackStatus, StatusServerConfig, ApiResponse, } from './types.js';
+export { default as StatusPage } from './components/StatusPage.svelte';
+export { default as StatusBanner } from './components/StatusBanner.svelte';
+export { default as FeedbackForm } from './components/FeedbackForm.svelte';
+export { default as FeedbackButton } from './components/FeedbackButton.svelte';
+export { default as StatusIndicator } from './components/shared/StatusIndicator.svelte';
+export { default as UptimeBar } from './components/shared/UptimeBar.svelte';
+export { default as IncidentTimeline } from './components/shared/IncidentTimeline.svelte';
+export { default as SystemCard } from './components/shared/SystemCard.svelte';

package/dist/index.js

@@ -0,0 +1,24 @@
+/**
+ * @alliance-droid/status-feedback-system
+ *
+ * Drop-in system status pages and user feedback forms for SvelteKit apps.
+ *
+ * Client exports (components):
+ *   import { StatusPage, FeedbackForm } from '@alliance-droid/status-feedback-system';
+ *
+ * Server exports:
+ *   import { createStatusServer } from '@alliance-droid/status-feedback-system/server';
+ *
+ * Admin exports:
+ *   import { AdminDashboard } from '@alliance-droid/status-feedback-system/admin';
+ */
+// ── Client Components ──
+export { default as StatusPage } from './components/StatusPage.svelte';
+export { default as StatusBanner } from './components/StatusBanner.svelte';
+export { default as FeedbackForm } from './components/FeedbackForm.svelte';
+export { default as FeedbackButton } from './components/FeedbackButton.svelte';
+// ── Shared Components ──
+export { default as StatusIndicator } from './components/shared/StatusIndicator.svelte';
+export { default as UptimeBar } from './components/shared/UptimeBar.svelte';
+export { default as IncidentTimeline } from './components/shared/IncidentTimeline.svelte';
+export { default as SystemCard } from './components/shared/SystemCard.svelte';

package/dist/server/db.d.ts

@@ -0,0 +1,17 @@
+/**
+ * Database connection management
+ * Provides a singleton connection pool for MSSQL
+ */
+import type { ConnectionPool } from 'mssql';
+/**
+ * Get the database connection pool. Creates one if it doesn't exist.
+ */
+export declare function getPool(connectionString: string): Promise<ConnectionPool>;
+/**
+ * Initialize the database: connect and run migrations
+ */
+export declare function initDatabase(connectionString: string): Promise<ConnectionPool>;
+/**
+ * Close the database connection
+ */
+export declare function closeDatabase(): Promise<void>;

package/dist/server/db.js

@@ -0,0 +1,68 @@
+/**
+ * Database connection management
+ * Provides a singleton connection pool for MSSQL
+ */
+import sql from 'mssql';
+import { runMigrations } from './schema.js';
+let _pool = null;
+let _initialized = false;
+/**
+ * Parse a connection string into mssql config
+ */
+function parseConnectionString(connectionString) {
+    const params = {};
+    for (const part of connectionString.split(';')) {
+        const [key, ...valueParts] = part.split('=');
+        if (key && valueParts.length > 0) {
+            params[key.trim().toLowerCase()] = valueParts.join('=').trim();
+        }
+    }
+    return {
+        server: params['server'] || params['data source'] || '',
+        database: params['initial catalog'] || params['database'] || '',
+        user: params['user id'] || params['uid'] || '',
+        password: params['password'] || params['pwd'] || '',
+        options: {
+            encrypt: params['encrypt']?.toLowerCase() !== 'false',
+            trustServerCertificate: params['trustservercertificate']?.toLowerCase() === 'true',
+        },
+        pool: {
+            max: 10,
+            min: 0,
+            idleTimeoutMillis: 30000,
+        },
+        requestTimeout: parseInt(params['connection timeout'] || '30') * 1000,
+    };
+}
+/**
+ * Get the database connection pool. Creates one if it doesn't exist.
+ */
+export async function getPool(connectionString) {
+    if (_pool?.connected) {
+        return _pool;
+    }
+    const config = parseConnectionString(connectionString);
+    _pool = await sql.connect(config);
+    return _pool;
+}
+/**
+ * Initialize the database: connect and run migrations
+ */
+export async function initDatabase(connectionString) {
+    const pool = await getPool(connectionString);
+    if (!_initialized) {
+        await runMigrations(pool);
+        _initialized = true;
+    }
+    return pool;
+}
+/**
+ * Close the database connection
+ */
+export async function closeDatabase() {
+    if (_pool) {
+        await _pool.close();
+        _pool = null;
+        _initialized = false;
+    }
+}

package/dist/server/feedback.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Feedback CRUD
+ */
+import type { ConnectionPool } from 'mssql';
+import type { Feedback, FeedbackStatus } from './types.js';
+export declare function submitFeedback(pool: ConnectionPool, projectId: string, data: {
+    category?: string;
+    message: string;
+    email?: string;
+    userAgent?: string;
+    pageUrl?: string;
+    metadata?: Record<string, unknown>;
+}): Promise<Feedback>;
+export declare function getFeedbackById(pool: ConnectionPool, id: string): Promise<Feedback | null>;
+export declare function getFeedbackByProject(pool: ConnectionPool, projectId: string, options?: {
+    limit?: number;
+    offset?: number;
+    category?: string;
+    status?: FeedbackStatus;
+    sortBy?: 'created_at' | 'status';
+    sortOrder?: 'ASC' | 'DESC';
+}): Promise<{
+    items: Feedback[];
+    total: number;
+}>;
+export declare function updateFeedbackStatus(pool: ConnectionPool, id: string, status: FeedbackStatus): Promise<Feedback | null>;
+export declare function deleteFeedback(pool: ConnectionPool, id: string): Promise<boolean>;

package/dist/server/feedback.js

@@ -0,0 +1,124 @@
+/**
+ * Feedback CRUD
+ */
+import { nanoid } from 'nanoid';
+// ── CRUD ──
+export async function submitFeedback(pool, projectId, data) {
+    const id = nanoid(16);
+    const now = Date.now();
+    await pool
+        .request()
+        .input('id', id)
+        .input('projectId', projectId)
+        .input('category', data.category || null)
+        .input('message', data.message)
+        .input('email', data.email || null)
+        .input('userAgent', data.userAgent || null)
+        .input('pageUrl', data.pageUrl || null)
+        .input('metadata', data.metadata ? JSON.stringify(data.metadata) : null)
+        .input('createdAt', now)
+        .query(`
+			INSERT INTO sf_feedback (id, project_id, category, message, email, user_agent, page_url, metadata, created_at)
+			VALUES (@id, @projectId, @category, @message, @email, @userAgent, @pageUrl, @metadata, @createdAt)
+		`);
+    return {
+        id,
+        projectId,
+        category: data.category || null,
+        message: data.message,
+        email: data.email || null,
+        userAgent: data.userAgent || null,
+        pageUrl: data.pageUrl || null,
+        metadata: data.metadata || null,
+        status: 'new',
+        createdAt: now,
+    };
+}
+export async function getFeedbackById(pool, id) {
+    const result = await pool
+        .request()
+        .input('id', id)
+        .query('SELECT * FROM sf_feedback WHERE id = @id');
+    if (result.recordset.length === 0)
+        return null;
+    return mapFeedbackRow(result.recordset[0]);
+}
+export async function getFeedbackByProject(pool, projectId, options = {}) {
+    const limit = options.limit ?? 50;
+    const offset = options.offset ?? 0;
+    const sortBy = options.sortBy ?? 'created_at';
+    const sortOrder = options.sortOrder ?? 'DESC';
+    // Build WHERE clause
+    const conditions = ['project_id = @projectId'];
+    if (options.category)
+        conditions.push('category = @category');
+    if (options.status)
+        conditions.push('status = @status');
+    const where = conditions.join(' AND ');
+    // Get total count
+    const countResult = await pool
+        .request()
+        .input('projectId', projectId)
+        .input('category', options.category || null)
+        .input('status', options.status || null)
+        .query(`SELECT COUNT(*) as total FROM sf_feedback WHERE ${where}`);
+    const total = countResult.recordset[0].total;
+    // Get paginated results
+    const result = await pool
+        .request()
+        .input('projectId', projectId)
+        .input('category', options.category || null)
+        .input('status', options.status || null)
+        .input('limit', limit)
+        .input('offset', offset)
+        .query(`
+			SELECT * FROM sf_feedback
+			WHERE ${where}
+			ORDER BY ${sortBy} ${sortOrder}
+			OFFSET @offset ROWS FETCH NEXT @limit ROWS ONLY
+		`);
+    return {
+        items: result.recordset.map(mapFeedbackRow),
+        total,
+    };
+}
+export async function updateFeedbackStatus(pool, id, status) {
+    const existing = await getFeedbackById(pool, id);
+    if (!existing)
+        return null;
+    await pool
+        .request()
+        .input('id', id)
+        .input('status', status)
+        .query('UPDATE sf_feedback SET status = @status WHERE id = @id');
+    return { ...existing, status };
+}
+export async function deleteFeedback(pool, id) {
+    await pool.request().input('id', id).query('DELETE FROM sf_feedback WHERE id = @id');
+    return true;
+}
+// ── Helpers ──
+function mapFeedbackRow(row) {
+    return {
+        id: row.id,
+        projectId: row.project_id,
+        category: row.category || null,
+        message: row.message,
+        email: row.email || null,
+        userAgent: row.user_agent || null,
+        pageUrl: row.page_url || null,
+        metadata: parseJsonObject(row.metadata),
+        status: row.status,
+        createdAt: row.created_at,
+    };
+}
+function parseJsonObject(value) {
+    if (!value)
+        return null;
+    try {
+        return JSON.parse(value);
+    }
+    catch {
+        return null;
+    }
+}

package/dist/server/handlers.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Composable API route handlers for SvelteKit
+ *
+ * Usage in consuming app:
+ *   // src/routes/api/status/[...path]/+server.ts
+ *   import { statusServer } from './status';
+ *   const handlers = statusServer.createHandlers();
+ *   export const GET = handlers.GET;
+ *   export const POST = handlers.POST;
+ *   export const PATCH = handlers.PATCH;
+ *   export const DELETE = handlers.DELETE;
+ */
+import type { ConnectionPool } from 'mssql';
+type RequestEvent = {
+    request: Request;
+    params: Record<string, string>;
+    url: URL;
+};
+type Handler = (event: RequestEvent) => Promise<Response>;
+export interface RouteHandlers {
+    GET: Handler;
+    POST: Handler;
+    PATCH: Handler;
+    DELETE: Handler;
+}
+/**
+ * Create composable route handlers
+ *
+ * Routes:
+ *   GET    /systems              — list systems for project
+ *   GET    /systems/:id          — get system details
+ *   GET    /systems/:id/history  — get status history (90 days)
+ *   GET    /incidents            — list incidents for project
+ *   GET    /incidents/:id        — get incident with updates
+ *   GET    /feedback             — list feedback (admin)
+ *   POST   /feedback             — submit feedback
+ *   PATCH  /systems/:id/status   — update system status (admin)
+ *   PATCH  /feedback/:id/status  — update feedback status (admin)
+ */
+export declare function createRouteHandlers(pool: ConnectionPool): RouteHandlers;
+export {};