- Added new model "Claude Opus 4.6" to the provider models.

2026-05-08 12:01:28 +00:00 · 2026-02-06 11:23:08 +07:00
parent 39c555ca7e
commit e8aa3e21fe
10 changed files with 159 additions and 143 deletions
--- a/open-sse/config/constants.js
+++ b/open-sse/config/constants.js
@@ -222,7 +222,7 @@ export const BACKOFF_CONFIG = {
 export const COOLDOWN_MS = {
  unauthorized: 2 * 60 * 1000,       // 401 → 30 min
  paymentRequired: 2 * 60 * 1000,    // 402/403 → 30 min
-  notFound: 2 * 60 * 60 * 1000,      // 404 → 12 hours
+  notFound: 2 * 60 * 1000,      // 404 → 2 minutes
  transient: 30 * 1000,               // 408/500/502/503/504 → 1 min
  requestNotAllowed: 5 * 1000,        // "Request not allowed" → 5 sec
  // Legacy aliases for backward compatibility
--- a/open-sse/config/providerModels.js
+++ b/open-sse/config/providerModels.js
@@ -5,6 +5,7 @@
 export const PROVIDER_MODELS = {
  // OAuth Providers (using alias)
  cc: [  // Claude Code
+    { id: "claude-opus-4-6", name: "Claude Opus 4.6" },
    { id: "claude-opus-4-5-20251101", name: "Claude 4.5 Opus" },
    { id: "claude-sonnet-4-5-20250929", name: "Claude 4.5 Sonnet" },
    { id: "claude-haiku-4-5-20251001", name: "Claude 4.5 Haiku" },
@@ -52,8 +53,8 @@ export const PROVIDER_MODELS = {
    { id: "glm-4.7", name: "GLM 4.7" },
  ],
  ag: [  // Antigravity - special case: models call different backends
+    // { id: "claude-opus-4-6", name: "Claude Opus 4.6" },
    { id: "claude-opus-4-5-thinking", name: "Claude Opus 4.5 Thinking" },
-    { id: "claude-opus-4-5", name: "Claude Opus 4.5" },
    { id: "claude-sonnet-4-5-thinking", name: "Claude Sonnet 4.5 Thinking" },
    { id: "claude-sonnet-4-5", name: "Claude Sonnet 4.5" },
    { id: "gemini-3-pro-high", name: "Gemini 3 Pro High" },
--- a/open-sse/services/usage.js
+++ b/open-sse/services/usage.js
@@ -59,6 +59,36 @@ export async function getUsageForProvider(connection) {
  }
 }

+/**
+ * Parse reset date/time to ISO string
+ * Handles multiple formats: Unix timestamp (ms), ISO date string, etc.
+ */
+function parseResetTime(resetValue) {
+  if (!resetValue) return null;
+  
+  try {
+    // If it's already a Date object
+    if (resetValue instanceof Date) {
+      return resetValue.toISOString();
+    }
+    
+    // If it's a number (Unix timestamp in milliseconds)
+    if (typeof resetValue === 'number') {
+      return new Date(resetValue).toISOString();
+    }
+    
+    // If it's a string (ISO date or any parseable date string)
+    if (typeof resetValue === 'string') {
+      return new Date(resetValue).toISOString();
+    }
+    
+    return null;
+  } catch (error) {
+    console.warn(`Failed to parse reset time: ${resetValue}`, error);
+    return null;
+  }
+}
+
 /**
 * GitHub Copilot Usage
 * Uses GitHub accessToken (not copilotToken) to call copilot_internal/user API
@@ -92,19 +122,22 @@ async function getGitHubUsage(accessToken, providerSpecificData) {
    if (data.quota_snapshots) {
      // Paid plan format
      const snapshots = data.quota_snapshots;
+      const resetAt = parseResetTime(data.quota_reset_date);
+      
      return {
        plan: data.copilot_plan,
        resetDate: data.quota_reset_date,
        quotas: {
-          chat: formatGitHubQuotaSnapshot(snapshots.chat),
-          completions: formatGitHubQuotaSnapshot(snapshots.completions),
-          premium_interactions: formatGitHubQuotaSnapshot(snapshots.premium_interactions),
+          chat: { ...formatGitHubQuotaSnapshot(snapshots.chat), resetAt },
+          completions: { ...formatGitHubQuotaSnapshot(snapshots.completions), resetAt },
+          premium_interactions: { ...formatGitHubQuotaSnapshot(snapshots.premium_interactions), resetAt },
        },
      };
    } else if (data.monthly_quotas || data.limited_user_quotas) {
      // Free/limited plan format
      const monthlyQuotas = data.monthly_quotas || {};
      const usedQuotas = data.limited_user_quotas || {};
+      const resetAt = parseResetTime(data.limited_user_reset_date);
      
      return {
        plan: data.copilot_plan || data.access_type_sku,
@@ -114,11 +147,13 @@ async function getGitHubUsage(accessToken, providerSpecificData) {
            used: usedQuotas.chat || 0,
            total: monthlyQuotas.chat || 0,
            unlimited: false,
+            resetAt,
          },
          completions: {
            used: usedQuotas.completions || 0,
            total: monthlyQuotas.completions || 0,
            unlimited: false,
+            resetAt,
          },
        },
      };
@@ -236,7 +271,7 @@ async function getAntigravityUsage(accessToken, providerSpecificData) {
        quotas[modelKey] = {
          used,
          total,
-          resetAt: info.quotaInfo.resetTime || null,
+          resetAt: parseResetTime(info.quotaInfo.resetTime),
          remainingPercentage,
          unlimited: false,
          displayName: info.displayName || modelKey,
@@ -372,13 +407,9 @@ async function getCodexUsage(accessToken) {
    const primaryWindow = rateLimit.primary_window || {};
    const secondaryWindow = rateLimit.secondary_window || {};

-    // Calculate reset dates
-    const sessionResetAt = primaryWindow.reset_at 
-      ? new Date(primaryWindow.reset_at * 1000).toISOString() 
-      : null;
-    const weeklyResetAt = secondaryWindow.reset_at 
-      ? new Date(secondaryWindow.reset_at * 1000).toISOString() 
-      : null;
+    // Parse reset dates (reset_at is Unix timestamp in seconds, multiply by 1000 for ms)
+    const sessionResetAt = parseResetTime(primaryWindow.reset_at ? primaryWindow.reset_at * 1000 : null);
+    const weeklyResetAt = parseResetTime(secondaryWindow.reset_at ? secondaryWindow.reset_at * 1000 : null);

    return {
      plan: data.plan_type || "unknown",
@@ -388,14 +419,14 @@ async function getCodexUsage(accessToken) {
          used: primaryWindow.used_percent || 0,
          total: 100,
          remaining: 100 - (primaryWindow.used_percent || 0),
-          resetTime: sessionResetAt,
+          resetAt: sessionResetAt,
          unlimited: false,
        },
        weekly: {
          used: secondaryWindow.used_percent || 0,
          total: 100,
          remaining: 100 - (secondaryWindow.used_percent || 0),
-          resetTime: weeklyResetAt,
+          resetAt: weeklyResetAt,
          unlimited: false,
        },
      },
@@ -439,10 +470,21 @@ async function getKiroUsage(accessToken, providerSpecificData) {
    }

    const data = await response.json();
+    
+    console.log("[Kiro Usage] API Response:", JSON.stringify(data, null, 2));

    // Parse usage data from usageBreakdownList
    const usageList = data.usageBreakdownList || [];
    const quotaInfo = {};
+    
+    // Parse reset time - supports multiple formats (nextDateReset, resetDate, etc.)
+    const resetAt = parseResetTime(data.nextDateReset || data.resetDate);
+    
+    console.log("[Kiro Usage] Reset time:", {
+      nextDateReset: data.nextDateReset,
+      resetDate: data.resetDate,
+      parsedResetAt: resetAt
+    });

    usageList.forEach((breakdown) => {
      const resourceType = breakdown.resourceType?.toLowerCase() || "unknown";
@@ -453,7 +495,7 @@ async function getKiroUsage(accessToken, providerSpecificData) {
        used,
        total,
        remaining: total - used,
-        resetTime: data.nextDateReset ? new Date(data.nextDateReset).toISOString() : null,
+        resetAt,
        unlimited: false,
      };

@@ -466,7 +508,7 @@ async function getKiroUsage(accessToken, providerSpecificData) {
          used: freeUsed,
          total: freeTotal,
          remaining: freeTotal - freeUsed,
-          resetTime: data.nextDateReset ? new Date(data.nextDateReset).toISOString() : null,
+          resetAt,
          unlimited: false,
        };
      }
--- a/src/app/(dashboard)/dashboard/usage/components/ProviderLimits/QuotaProgressBar.js
+++ b/src/app/(dashboard)/dashboard/usage/components/ProviderLimits/QuotaProgressBar.js
@@ -5,15 +5,6 @@ import { formatResetTime } from "./utils";

 // Calculate color based on remaining percentage
 const getColorClasses = (remainingPercentage) => {
-  if (remainingPercentage === 0) {
-    return {
-      text: "text-gray-400",
-      bg: "bg-gray-400",
-      bgLight: "bg-gray-400/10",
-      emoji: "⚫"
-    };
-  }
-  
  if (remainingPercentage > 70) {
    return {
      text: "text-green-500",
@@ -32,6 +23,7 @@ const getColorClasses = (remainingPercentage) => {
    };
  }
  
+  // 0-29% including 0% (out of quota) - show red
  return {
    text: "text-red-500",
    bg: "bg-red-500",
--- a/src/app/(dashboard)/dashboard/usage/components/ProviderLimits/QuotaTable.js
+++ b/src/app/(dashboard)/dashboard/usage/components/ProviderLimits/QuotaTable.js
@@ -40,15 +40,6 @@ function formatResetTimeDisplay(resetTime) {
 * Get color classes based on remaining percentage
 */
 function getColorClasses(remainingPercentage) {
-  if (remainingPercentage === 0) {
-    return {
-      text: "text-text-muted",
-      bg: "bg-bg-muted",
-      bgLight: "bg-bg-muted/20",
-      emoji: "⚫"
-    };
-  }
-  
  if (remainingPercentage > 70) {
    return {
      text: "text-green-600 dark:text-green-400",
@@ -67,6 +58,7 @@ function getColorClasses(remainingPercentage) {
    };
  }
  
+  // 0-29% including 0% (out of quota) - show red
  return {
    text: "text-red-600 dark:text-red-400",
    bg: "bg-red-500",
@@ -85,7 +77,12 @@ export default function QuotaTable({ quotas = [] }) {

  return (
    <div className="overflow-x-auto">
-      <table className="w-full">
+      <table className="w-full table-fixed">
+        <colgroup>
+          <col className="w-[30%]" /> {/* Model Name */}
+          <col className="w-[45%]" /> {/* Limit Progress */}
+          <col className="w-[25%]" /> {/* Reset Time */}
+        </colgroup>
        <tbody>
          {quotas.map((quota, index) => {
            const remaining = quota.remainingPercentage !== undefined
@@ -136,18 +133,22 @@ export default function QuotaTable({ quotas = [] }) {

                {/* Reset Time */}
                <td className="py-2 px-3">
-                  <div className="space-y-0.5">
-                    {countdown !== "-" && (
-                      <div className="text-sm text-text-primary font-medium">
-                        in {countdown}
-                      </div>
-                    )}
-                    {resetDisplay && (
-                      <div className="text-xs text-text-muted">
-                        {resetDisplay}
-                      </div>
-                    )}
-                  </div>
+                  {countdown !== "-" || resetDisplay ? (
+                    <div className="space-y-0.5">
+                      {countdown !== "-" && (
+                        <div className="text-sm text-text-primary font-medium">
+                          in {countdown}
+                        </div>
+                      )}
+                      {resetDisplay && (
+                        <div className="text-xs text-text-muted">
+                          {resetDisplay}
+                        </div>
+                      )}
+                    </div>
+                  ) : (
+                    <div className="text-sm text-text-muted italic">N/A</div>
+                  )}
                </td>
              </tr>
            );
--- a/src/app/(dashboard)/dashboard/usage/components/ProviderLimits/index.js
+++ b/src/app/(dashboard)/dashboard/usage/components/ProviderLimits/index.js
@@ -358,85 +358,68 @@ export default function ProviderLimits() {
          const isLoading = loading[conn.id];
          const error = errors[conn.id];

-          // Use table layout for Antigravity and Kiro, card layout for others
-          if (conn.provider === "antigravity" || conn.provider === "kiro") {
-            return (
-              <Card key={conn.id} padding="none">
-                <div className="p-6 border-b border-black/10 dark:border-white/10">
-                  <div className="flex items-center justify-between">
-                    <div className="flex items-center gap-3">
-                      <div className="w-10 h-10 rounded-lg flex items-center justify-center overflow-hidden">
-                        <Image
-                          src={`/providers/${conn.provider}.png`}
-                          alt={conn.provider}
-                          width={40}
-                          height={40}
-                          className="object-contain"
-                          sizes="40px"
-                        />
-                      </div>
-                      <div>
-                        <h3 className="text-base font-semibold text-text-primary capitalize">
-                          {conn.provider}
-                        </h3>
-                        {conn.name && (
-                          <p className="text-sm text-text-muted">{conn.name}</p>
-                        )}
-                      </div>
-                    </div>
-                    
-                    <button
-                      onClick={() => refreshProvider(conn.id, conn.provider)}
-                      disabled={isLoading}
-                      className="p-2 rounded-lg hover:bg-black/5 dark:hover:bg-white/5 transition-colors disabled:opacity-50"
-                      title="Refresh quota"
-                    >
-                      <span className={`material-symbols-outlined text-[20px] text-text-muted ${isLoading ? "animate-spin" : ""}`}>
-                        refresh
-                      </span>
-                    </button>
-                  </div>
-                </div>
-
-                <div className="p-6">
-                  {isLoading ? (
-                    <div className="text-center py-8 text-text-muted">
-                      <span className="material-symbols-outlined text-[32px] animate-spin">
-                        progress_activity
-                      </span>
-                    </div>
-                  ) : error ? (
-                    <div className="text-center py-8">
-                      <span className="material-symbols-outlined text-[32px] text-red-500">
-                        error
-                      </span>
-                      <p className="mt-2 text-sm text-text-muted">{error}</p>
-                    </div>
-                  ) : quota?.message ? (
-                    <div className="text-center py-8">
-                      <p className="text-sm text-text-muted">{quota.message}</p>
-                    </div>
-                  ) : (
-                    <QuotaTable quotas={quota?.quotas} />
-                  )}
-                </div>
-              </Card>
-            );
-          }
-
-          // Use card layout for other providers
+          // Use table layout for all providers
          return (
-            <ProviderLimitCard
-              key={conn.id}
-              provider={conn.provider}
-              name={conn.name}
-              plan={quota?.plan}
-              quotas={quota?.quotas}
-              message={quota?.message}
-              loading={isLoading}
-              error={error}
-              onRefresh={() => refreshProvider(conn.id, conn.provider)}
-            />
+            <Card key={conn.id} padding="none">
+              <div className="p-6 border-b border-black/10 dark:border-white/10">
+                <div className="flex items-center justify-between">
+                  <div className="flex items-center gap-3">
+                    <div className="w-10 h-10 rounded-lg flex items-center justify-center overflow-hidden">
+                      <Image
+                        src={`/providers/${conn.provider}.png`}
+                        alt={conn.provider}
+                        width={40}
+                        height={40}
+                        className="object-contain"
+                        sizes="40px"
+                      />
+                    </div>
+                    <div>
+                      <h3 className="text-base font-semibold text-text-primary capitalize">
+                        {conn.provider}
+                      </h3>
+                      {conn.name && (
+                        <p className="text-sm text-text-muted">{conn.name}</p>
+                      )}
+                    </div>
+                  </div>
+                  
+                  <button
+                    onClick={() => refreshProvider(conn.id, conn.provider)}
+                    disabled={isLoading}
+                    className="p-2 rounded-lg hover:bg-black/5 dark:hover:bg-white/5 transition-colors disabled:opacity-50"
+                    title="Refresh quota"
+                  >
+                    <span className={`material-symbols-outlined text-[20px] text-text-muted ${isLoading ? "animate-spin" : ""}`}>
+                      refresh
+                    </span>
+                  </button>
+                </div>
+              </div>
+
+              <div className="p-6">
+                {isLoading ? (
+                  <div className="text-center py-8 text-text-muted">
+                    <span className="material-symbols-outlined text-[32px] animate-spin">
+                      progress_activity
+                    </span>
+                  </div>
+                ) : error ? (
+                  <div className="text-center py-8">
+                    <span className="material-symbols-outlined text-[32px] text-red-500">
+                      error
+                    </span>
+                    <p className="mt-2 text-sm text-text-muted">{error}</p>
+                  </div>
+                ) : quota?.message ? (
+                  <div className="text-center py-8">
+                    <p className="text-sm text-text-muted">{quota.message}</p>
+                  </div>
+                ) : (
+                  <QuotaTable quotas={quota?.quotas} />
+                )}
+              </div>
+            </Card>
          );
        })}
      </div>
--- a/src/app/(dashboard)/dashboard/usage/components/ProviderLimits/utils.js
+++ b/src/app/(dashboard)/dashboard/usage/components/ProviderLimits/utils.js
@@ -42,31 +42,23 @@ export function formatResetTime(date) {
 /**
 * Get Tailwind color class based on percentage
 * @param {number} percentage - Remaining percentage (0-100)
- * @returns {string} Color name: "green" | "yellow" | "red" | "gray"
+ * @returns {string} Color name: "green" | "yellow" | "red"
 */
 export function getStatusColor(percentage) {
-  if (percentage === 0 || percentage === null || percentage === undefined) {
-    return "gray";
-  }
-
  if (percentage > 70) return "green";
  if (percentage >= 30) return "yellow";
-  return "red";
+  return "red"; // 0-29% including 0% (out of quota) - show red
 }

 /**
 * Get status emoji based on percentage
 * @param {number} percentage - Remaining percentage (0-100)
- * @returns {string} Emoji: "🟢" | "🟡" | "🔴" | "⚫"
+ * @returns {string} Emoji: "🟢" | "🟡" | "🔴"
 */
 export function getStatusEmoji(percentage) {
-  if (percentage === 0 || percentage === null || percentage === undefined) {
-    return "⚫";
-  }
-
  if (percentage > 70) return "🟢";
  if (percentage >= 30) return "🟡";
-  return "🔴";
+  return "🔴"; // 0-29% including 0% (out of quota) - show red
 }

 /**
--- a/src/shared/components/Sidebar.js
+++ b/src/shared/components/Sidebar.js
@@ -76,9 +76,12 @@ export default function Sidebar({ onClose }) {
            <div className="flex items-center justify-center size-9 rounded bg-linear-to-br from-[#f97815] to-[#c2590a]">
              <span className="material-symbols-outlined text-white text-[20px]">hub</span>
            </div>
-            <h1 className="text-lg font-semibold tracking-tight text-text-main">
-              {APP_CONFIG.name}
-            </h1>
+            <div className="flex flex-col">
+              <h1 className="text-lg font-semibold tracking-tight text-text-main">
+                {APP_CONFIG.name}
+              </h1>
+              <span className="text-xs text-text-muted">v{APP_CONFIG.version}</span>
+            </div>
          </Link>
        </div>

--- a/src/shared/constants/config.js
+++ b/src/shared/constants/config.js
@@ -1,8 +1,10 @@
+import pkg from "../../../../package.json" with { type: "json" };
+
 // App configuration
 export const APP_CONFIG = {
  name: "Endpoint Proxy",
  description: "AI Infrastructure Management",
-  version: "1.0.0",
+  version: pkg.version,
 };

 // Theme configuration
--- a/src/shared/constants/providers.js
+++ b/src/shared/constants/providers.js
@@ -78,4 +78,4 @@ export const ID_TO_ALIAS = Object.values(AI_PROVIDERS).reduce((acc, p) => {
 }, {});

 // Providers that support usage/quota API
-export const USAGE_SUPPORTED_PROVIDERS = ["antigravity", "kiro", "github", "claude"];
+export const USAGE_SUPPORTED_PROVIDERS = ["antigravity", "kiro", "github"];