@qwickapps/server 1.6.0 → 1.6.1

package/src/plugins/rate-limit/RateLimitStatusWidget.test.tsx

@@ -0,0 +1,109 @@
+/**
+ * RateLimitStatusWidget Tests
+ *
+ * Copyright (c) 2025 QwickApps.com. All rights reserved.
+ */
+
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+import { RateLimitStatusWidget } from './RateLimitStatusWidget';
+
+describe('RateLimitStatusWidget', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('renders loading state initially', () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockImplementation(
+      () => new Promise(() => {})
+    );
+
+    render(<RateLimitStatusWidget apiPrefix="/api/rate-limit" />);
+
+    expect(screen.getByText(/Rate Limiting Loading/)).toBeInTheDocument();
+  });
+
+  it('fetches and displays stats successfully', async () => {
+    const mockStats = {
+      totalRequests: 100000,
+      blockedRequests: 500,
+      activeRules: 15,
+      requestsToday: 5000,
+      health: 'healthy' as const,
+    };
+
+    (global.fetch as ReturnType<typeof vi.fn>).mockResolvedValueOnce({
+      ok: true,
+      json: async () => mockStats,
+    });
+
+    render(<RateLimitStatusWidget apiPrefix="/api/rate-limit" />);
+
+    await waitFor(() => {
+      expect(screen.getByText('Rate Limiting')).toBeInTheDocument();
+      expect(screen.getByText(/Total Requests: 100000/)).toBeInTheDocument();
+      expect(screen.getByText(/Blocked: 500/)).toBeInTheDocument();
+      expect(screen.getByText(/Active Rules: 15/)).toBeInTheDocument();
+      expect(screen.getByText(/Requests Today: 5000/)).toBeInTheDocument();
+    });
+
+    expect(global.fetch).toHaveBeenCalledWith('/api/rate-limit/stats');
+  });
+
+  it('handles fetch error', async () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockRejectedValueOnce(
+      new Error('Rate limit service error')
+    );
+
+    render(<RateLimitStatusWidget apiPrefix="/api/rate-limit" />);
+
+    await waitFor(() => {
+      expect(screen.getByText(/Rate limit service error/)).toBeInTheDocument();
+    });
+  });
+
+  it('uses custom apiPrefix', async () => {
+    const mockStats = {
+      totalRequests: 50000,
+      blockedRequests: 200,
+      activeRules: 8,
+      requestsToday: 2500,
+      health: 'healthy' as const,
+    };
+
+    (global.fetch as ReturnType<typeof vi.fn>).mockResolvedValueOnce({
+      ok: true,
+      json: async () => mockStats,
+    });
+
+    render(<RateLimitStatusWidget apiPrefix="/custom/rate-limit" />);
+
+    await waitFor(() => {
+      expect(global.fetch).toHaveBeenCalledWith('/custom/rate-limit/stats');
+    });
+  });
+
+  it('displays all rate limit metrics correctly', async () => {
+    const mockStats = {
+      totalRequests: 200000,
+      blockedRequests: 1000,
+      activeRules: 25,
+      requestsToday: 10000,
+      health: 'warning' as const,
+    };
+
+    (global.fetch as ReturnType<typeof vi.fn>).mockResolvedValueOnce({
+      ok: true,
+      json: async () => mockStats,
+    });
+
+    render(<RateLimitStatusWidget apiPrefix="/api/rate-limit" />);
+
+    await waitFor(() => {
+      expect(screen.getByText(/Total Requests: 200000/)).toBeInTheDocument();
+      expect(screen.getByText(/Blocked: 1000/)).toBeInTheDocument();
+      expect(screen.getByText(/Active Rules: 25/)).toBeInTheDocument();
+      expect(screen.getByText(/Requests Today: 10000/)).toBeInTheDocument();
+    });
+  });
+});

package/src/plugins/rate-limit/RateLimitStatusWidget.tsx

@@ -0,0 +1,52 @@
+/**
+ * RateLimitStatusWidget - Dashboard widget for rate limiting overview
+ */
+
+import React, { useEffect, useState } from 'react';
+import { PluginStatusWidget } from '@qwickapps/server/ui';
+
+export interface RateLimitStatusWidgetProps {
+  /** API endpoint prefix (default: '/api/rate-limit') */
+  apiPrefix?: string;
+}
+
+export function RateLimitStatusWidget({ apiPrefix = '/api/rate-limit' }: RateLimitStatusWidgetProps) {
+  const [stats, setStats] = useState<{
+    totalRequests: number;
+    blockedRequests: number;
+    activeRules: number;
+    requestsToday: number;
+    health: 'healthy' | 'warning' | 'error';
+  } | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    fetch(`${apiPrefix}/stats`)
+      .then((res) => res.json())
+      .then((data) => {
+        setStats(data);
+        setLoading(false);
+      })
+      .catch((err) => {
+        setError(err.message);
+        setLoading(false);
+      });
+  }, [apiPrefix]);
+
+  return (
+    <PluginStatusWidget
+      title="Rate Limiting"
+      stats={[
+        { label: 'Total Requests', value: stats?.totalRequests ?? 0 },
+        { label: 'Blocked', value: stats?.blockedRequests ?? 0 },
+        { label: 'Active Rules', value: stats?.activeRules ?? 0 },
+        { label: 'Requests Today', value: stats?.requestsToday ?? 0 },
+      ]}
+      health={stats?.health ?? 'error'}
+      loading={loading}
+      error={error}
+      detailsPath="/cpanel/plugins/rate-limit"
+    />
+  );
+}

package/src/plugins/rate-limit/index.ts

@@ -126,3 +126,9 @@ export type {
   RateLimitPluginConfig,
   CheckLimitOptions,
 } from './types.js';
+
+// UI Components
+export { RateLimitStatusWidget } from './RateLimitStatusWidget.js';
+export { RateLimitManagementPage } from './RateLimitManagementPage.js';
+export type { RateLimitStatusWidgetProps } from './RateLimitStatusWidget.js';
+export type { RateLimitManagementPageProps } from './RateLimitManagementPage.js';

package/src/plugins/rate-limit/rate-limit-plugin.ts

@@ -60,7 +60,7 @@ interface RuntimeConfig {
  */
 export function createRateLimitPlugin(config: RateLimitPluginConfig): Plugin {
   const debug = config.debug || false;
-  const apiPrefix = config.api?.prefix || '/rate-limit';
+  const apiPrefix = config.api?.prefix || '/'; // Framework adds /rate-limit prefix automatically
   const apiEnabled = config.api?.enabled !== false;
   const uiEnabled = config.ui?.enabled !== false;
   const initialCleanupEnabled = config.cleanup?.enabled !== false;
@@ -158,10 +158,10 @@ export function createRateLimitPlugin(config: RateLimitPluginConfig): Plugin {
 
       // Add API routes if enabled
       if (apiEnabled) {
-        // GET /rate-limit/config - Get current config
+        // GET /config - Get current config (framework adds /rate-limit prefix)
         registry.addRoute({
           method: 'get',
-          path: '/rate-limit/config',
+          path: '/config',
           pluginId: 'rate-limit',
           handler: async (_req: Request, res: Response) => {
             try {
@@ -180,10 +180,10 @@ export function createRateLimitPlugin(config: RateLimitPluginConfig): Plugin {
           },
         });
 
-        // PUT /rate-limit/config - Update config at runtime
+        // PUT /config - Update config at runtime (framework adds /rate-limit prefix)
         registry.addRoute({
           method: 'put',
-          path: '/rate-limit/config',
+          path: '/config',
           pluginId: 'rate-limit',
           handler: async (req: Request, res: Response) => {
             try {

package/src/plugins/subscriptions/API_ROUTES.md

@@ -0,0 +1,27 @@
+# Subscriptions Plugin API Routes
+
+## Routes
+
+### GET /api/subscriptions/stats
+Returns subscription statistics for the status widget.
+
+**Response:** `{ totalSubscriptions, activeSubscriptions, expiringSoon, cancelledToday, health }`
+
+### GET /api/subscriptions
+Returns paginated list of subscriptions with optional filtering.
+
+**Query:** `limit, offset, filter`
+
+**Response:** `{ subscriptions: Array<{ id, userId, userEmail, planName, status, startDate, endDate, autoRenew, amount }>, total }`
+
+### POST /api/subscriptions
+Create a new subscription.
+
+### PATCH /api/subscriptions/:id
+Update subscription (cancel, renew).
+
+### DELETE /api/subscriptions/:id
+Delete a subscription.
+
+---
+Copyright (c) 2025 QwickApps.com. All rights reserved.

package/src/plugins/subscriptions/SubscriptionsManagementPage.test.tsx

@@ -0,0 +1,58 @@
+/**
+ * SubscriptionsManagementPage Tests
+ *
+ * Copyright (c) 2025 QwickApps.com. All rights reserved.
+ */
+
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+import { SubscriptionsManagementPage } from './SubscriptionsManagementPage';
+
+describe('SubscriptionsManagementPage', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('renders page title', () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockImplementation(
+      () => Promise.resolve({
+        ok: true,
+        json: async () => ([]),
+      })
+    );
+
+    render(<SubscriptionsManagementPage apiPrefix="/api/subscriptions" />);
+
+    expect(screen.getByText('Subscriptions Management')).toBeInTheDocument();
+  });
+
+  it('fetches subscriptions on mount', async () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockImplementation(
+      () => Promise.resolve({
+        ok: true,
+        json: async () => ([]),
+      })
+    );
+
+    render(<SubscriptionsManagementPage apiPrefix="/api/subscriptions" />);
+
+    await waitFor(() => {
+      expect(global.fetch).toHaveBeenCalled();
+    });
+  });
+
+  it('renders with custom apiPrefix', async () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockImplementation(
+      () => Promise.resolve({
+        ok: true,
+        json: async () => ([]),
+      })
+    );
+
+    render(<SubscriptionsManagementPage apiPrefix="/custom/subscriptions" />);
+
+    await waitFor(() => {
+      expect(global.fetch).toHaveBeenCalled();
+    });
+  });
+});

package/src/plugins/subscriptions/SubscriptionsManagementPage.tsx

@@ -0,0 +1,125 @@
+/**
+ * SubscriptionsManagementPage - Full management interface for subscriptions
+ */
+
+import React, { useState, useEffect } from 'react';
+import { PluginManagementPage } from '@qwickapps/server/ui';
+import { DataTable, Column } from '@qwickapps/react-framework';
+
+export interface SubscriptionsManagementPageProps {
+  /** API endpoint prefix (default: '/api/subscriptions') */
+  apiPrefix?: string;
+}
+
+interface Subscription {
+  id: string;
+  userId: string;
+  userEmail: string;
+  planName: string;
+  status: 'active' | 'cancelled' | 'expired' | 'trial';
+  startDate: string;
+  endDate?: string;
+  autoRenew: boolean;
+  amount?: number;
+}
+
+export function SubscriptionsManagementPage({ apiPrefix = '/api/subscriptions' }: SubscriptionsManagementPageProps) {
+  const [activeTab, setActiveTab] = useState<'all' | 'active' | 'expiring' | 'config'>('all');
+  const [subscriptions, setSubscriptions] = useState<Subscription[]>([]);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    const filter = activeTab === 'all' ? undefined : activeTab;
+    const url = filter ? `${apiPrefix}?filter=${filter}` : `${apiPrefix}`;
+
+    fetch(url)
+      .then((res) => res.json())
+      .then((data) => {
+        setSubscriptions(data.subscriptions || []);
+        setLoading(false);
+      })
+      .catch(() => setLoading(false));
+  }, [activeTab, apiPrefix]);
+
+  const columns: Column<Subscription>[] = [
+    { key: 'userEmail', label: 'User', sortable: true },
+    { key: 'planName', label: 'Plan', sortable: true },
+    {
+      key: 'status',
+      label: 'Status',
+      sortable: true,
+      render: (val) => (
+        <span
+          className={`px-2 py-1 rounded text-xs font-medium ${
+            val === 'active'
+              ? 'bg-green-100 dark:bg-green-900 text-green-800 dark:text-green-100'
+              : val === 'trial'
+              ? 'bg-blue-100 dark:bg-blue-900 text-blue-800 dark:text-blue-100'
+              : val === 'cancelled'
+              ? 'bg-yellow-100 dark:bg-yellow-900 text-yellow-800 dark:text-yellow-100'
+              : 'bg-gray-100 dark:bg-gray-700 text-gray-800 dark:text-gray-300'
+          }`}
+        >
+          {String(val)}
+        </span>
+      ),
+    },
+    {
+      key: 'autoRenew',
+      label: 'Auto-Renew',
+      render: (val) => (
+        <span className="text-sm">
+          {val ? '✓' : '✗'}
+        </span>
+      ),
+    },
+    {
+      key: 'amount',
+      label: 'Amount',
+      sortable: true,
+      render: (val) => (val ? `$${Number(val).toFixed(2)}` : '-'),
+    },
+    { key: 'startDate', label: 'Start Date', sortable: true },
+    { key: 'endDate', label: 'End Date', sortable: true },
+  ];
+
+  const tabs = [
+    { id: 'all', label: 'All Subscriptions' },
+    { id: 'active', label: 'Active' },
+    { id: 'expiring', label: 'Expiring Soon' },
+    { id: 'config', label: 'Configuration' },
+  ];
+
+  return (
+    <PluginManagementPage
+      title="Subscriptions Management"
+      tabs={tabs}
+      activeTab={activeTab}
+      onTabChange={(tab) => setActiveTab(tab as typeof activeTab)}
+    >
+      {activeTab === 'config' ? (
+        <div className="space-y-4">
+          <div className="p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg">
+            <p className="text-sm text-blue-900 dark:text-blue-100">
+              Subscription plans and billing configuration.
+            </p>
+          </div>
+        </div>
+      ) : (
+        <DataTable
+          columns={columns}
+          data={subscriptions}
+          loading={loading}
+          emptyMessage="No subscriptions found"
+          bulkActions={[
+            {
+              label: 'Cancel Selected',
+              onClick: (rows) => console.log('Cancel subscriptions:', rows),
+              variant: 'danger',
+            },
+          ]}
+        />
+      )}
+    </PluginManagementPage>
+  );
+}

package/src/plugins/subscriptions/SubscriptionsStatusWidget.test.tsx

@@ -0,0 +1,109 @@
+/**
+ * SubscriptionsStatusWidget Tests
+ *
+ * Copyright (c) 2025 QwickApps.com. All rights reserved.
+ */
+
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+import { SubscriptionsStatusWidget } from './SubscriptionsStatusWidget';
+
+describe('SubscriptionsStatusWidget', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('renders loading state initially', () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockImplementation(
+      () => new Promise(() => {})
+    );
+
+    render(<SubscriptionsStatusWidget apiPrefix="/api/subscriptions" />);
+
+    expect(screen.getByText(/Subscriptions Loading/)).toBeInTheDocument();
+  });
+
+  it('fetches and displays stats successfully', async () => {
+    const mockStats = {
+      totalSubscriptions: 500,
+      activeSubscriptions: 450,
+      expiringSoon: 25,
+      cancelledToday: 5,
+      health: 'healthy' as const,
+    };
+
+    (global.fetch as ReturnType<typeof vi.fn>).mockResolvedValueOnce({
+      ok: true,
+      json: async () => mockStats,
+    });
+
+    render(<SubscriptionsStatusWidget apiPrefix="/api/subscriptions" />);
+
+    await waitFor(() => {
+      expect(screen.getByText('Subscriptions')).toBeInTheDocument();
+      expect(screen.getByText(/Total Subs: 500/)).toBeInTheDocument();
+      expect(screen.getByText(/Active: 450/)).toBeInTheDocument();
+      expect(screen.getByText(/Expiring Soon: 25/)).toBeInTheDocument();
+      expect(screen.getByText(/Cancelled Today: 5/)).toBeInTheDocument();
+    });
+
+    expect(global.fetch).toHaveBeenCalledWith('/api/subscriptions/stats');
+  });
+
+  it('handles fetch error', async () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockRejectedValueOnce(
+      new Error('Subscriptions service error')
+    );
+
+    render(<SubscriptionsStatusWidget apiPrefix="/api/subscriptions" />);
+
+    await waitFor(() => {
+      expect(screen.getByText(/Subscriptions service error/)).toBeInTheDocument();
+    });
+  });
+
+  it('uses custom apiPrefix', async () => {
+    const mockStats = {
+      totalSubscriptions: 200,
+      activeSubscriptions: 180,
+      expiringSoon: 10,
+      cancelledToday: 2,
+      health: 'healthy' as const,
+    };
+
+    (global.fetch as ReturnType<typeof vi.fn>).mockResolvedValueOnce({
+      ok: true,
+      json: async () => mockStats,
+    });
+
+    render(<SubscriptionsStatusWidget apiPrefix="/custom/subscriptions" />);
+
+    await waitFor(() => {
+      expect(global.fetch).toHaveBeenCalledWith('/custom/subscriptions/stats');
+    });
+  });
+
+  it('displays all subscription metrics correctly', async () => {
+    const mockStats = {
+      totalSubscriptions: 1000,
+      activeSubscriptions: 900,
+      expiringSoon: 50,
+      cancelledToday: 10,
+      health: 'healthy' as const,
+    };
+
+    (global.fetch as ReturnType<typeof vi.fn>).mockResolvedValueOnce({
+      ok: true,
+      json: async () => mockStats,
+    });
+
+    render(<SubscriptionsStatusWidget apiPrefix="/api/subscriptions" />);
+
+    await waitFor(() => {
+      expect(screen.getByText(/Total Subs: 1000/)).toBeInTheDocument();
+      expect(screen.getByText(/Active: 900/)).toBeInTheDocument();
+      expect(screen.getByText(/Expiring Soon: 50/)).toBeInTheDocument();
+      expect(screen.getByText(/Cancelled Today: 10/)).toBeInTheDocument();
+    });
+  });
+});

package/src/plugins/subscriptions/SubscriptionsStatusWidget.tsx

@@ -0,0 +1,52 @@
+/**
+ * SubscriptionsStatusWidget - Dashboard widget for subscriptions overview
+ */
+
+import React, { useEffect, useState } from 'react';
+import { PluginStatusWidget } from '@qwickapps/server/ui';
+
+export interface SubscriptionsStatusWidgetProps {
+  /** API endpoint prefix (default: '/api/subscriptions') */
+  apiPrefix?: string;
+}
+
+export function SubscriptionsStatusWidget({ apiPrefix = '/api/subscriptions' }: SubscriptionsStatusWidgetProps) {
+  const [stats, setStats] = useState<{
+    totalSubscriptions: number;
+    activeSubscriptions: number;
+    expiringSoon: number;
+    cancelledToday: number;
+    health: 'healthy' | 'warning' | 'error';
+  } | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  useEffect(() => {
+    fetch(`${apiPrefix}/stats`)
+      .then((res) => res.json())
+      .then((data) => {
+        setStats(data);
+        setLoading(false);
+      })
+      .catch((err) => {
+        setError(err.message);
+        setLoading(false);
+      });
+  }, [apiPrefix]);
+
+  return (
+    <PluginStatusWidget
+      title="Subscriptions"
+      stats={[
+        { label: 'Total Subs', value: stats?.totalSubscriptions ?? 0 },
+        { label: 'Active', value: stats?.activeSubscriptions ?? 0 },
+        { label: 'Expiring Soon', value: stats?.expiringSoon ?? 0 },
+        { label: 'Cancelled Today', value: stats?.cancelledToday ?? 0 },
+      ]}
+      health={stats?.health ?? 'error'}
+      loading={loading}
+      error={error}
+      detailsPath="/cpanel/plugins/subscriptions"
+    />
+  );
+}

package/src/plugins/subscriptions/index.ts

@@ -49,3 +49,9 @@ export type {
 
 // Stores
 export { postgresSubscriptionsStore } from './stores/index.js';
+
+// UI Components
+export { SubscriptionsStatusWidget } from './SubscriptionsStatusWidget.js';
+export type { SubscriptionsStatusWidgetProps } from './SubscriptionsStatusWidget.js';
+export { SubscriptionsManagementPage } from './SubscriptionsManagementPage.js';
+export type { SubscriptionsManagementPageProps } from './SubscriptionsManagementPage.js';

package/src/plugins/subscriptions/subscriptions-plugin.ts

@@ -34,7 +34,7 @@ let currentConfig: SubscriptionsPluginConfig | null = null;
 export function createSubscriptionsPlugin(config: SubscriptionsPluginConfig): Plugin {
   const debug = config.debug || false;
   const defaultTierSlug = config.defaultTierSlug || 'free';
-  const apiPrefix = config.api?.prefix || '/subscriptions';
+  const apiPrefix = config.api?.prefix || '/'; // Framework adds /subscriptions prefix automatically
 
   function log(message: string, data?: Record<string, unknown>) {
     if (debug) {

package/src/plugins/usage/API_ROUTES.md

@@ -0,0 +1,24 @@
+# Usage Plugin API Routes
+
+## Routes
+
+### GET /api/usage/stats
+Returns usage statistics for the status widget.
+
+**Response:** `{ totalEvents, activeUsers, eventsToday, topFeature, health }`
+
+### GET /api/usage/events
+Returns paginated list of usage events.
+
+**Query:** `limit, offset, userId, eventType`
+
+**Response:** `{ events: Array<{ id, userId, userEmail, eventType, featureName, timestamp, metadata }>, total }`
+
+### POST /api/usage/events
+Log a new usage event.
+
+### GET /api/usage/analytics
+Returns usage analytics and trends.
+
+---
+Copyright (c) 2025 QwickApps.com. All rights reserved.

package/src/plugins/usage/UsageManagementPage.test.tsx

@@ -0,0 +1,58 @@
+/**
+ * UsageManagementPage Tests
+ *
+ * Copyright (c) 2025 QwickApps.com. All rights reserved.
+ */
+
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { render, screen, waitFor } from '@testing-library/react';
+import { UsageManagementPage } from './UsageManagementPage';
+
+describe('UsageManagementPage', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('renders page title', () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockImplementation(
+      () => Promise.resolve({
+        ok: true,
+        json: async () => ({}),
+      })
+    );
+
+    render(<UsageManagementPage apiPrefix="/api/usage" />);
+
+    expect(screen.getByText('Usage Tracking')).toBeInTheDocument();
+  });
+
+  it('fetches usage data on mount', async () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockImplementation(
+      () => Promise.resolve({
+        ok: true,
+        json: async () => ({}),
+      })
+    );
+
+    render(<UsageManagementPage apiPrefix="/api/usage" />);
+
+    await waitFor(() => {
+      expect(global.fetch).toHaveBeenCalled();
+    });
+  });
+
+  it('renders with custom apiPrefix', async () => {
+    (global.fetch as ReturnType<typeof vi.fn>).mockImplementation(
+      () => Promise.resolve({
+        ok: true,
+        json: async () => ({}),
+      })
+    );
+
+    render(<UsageManagementPage apiPrefix="/custom/usage" />);
+
+    await waitFor(() => {
+      expect(global.fetch).toHaveBeenCalled();
+    });
+  });
+});