feat(frontend): [Issue #370] add Whale Warning indicator for owners w…

frontend/src/App.tsx

@@ -463,7 +463,6 @@ export default function App() {
                   owners={owners}
                   ownerAddresses={ownerAddresses}
                   threshold={threshold}
-                  totalOwners={owners.length}
                   walletAddress={wallet.address}
                   onProposalSubmitted={refresh}
                 />

frontend/src/pages/OwnersPage.test.tsx

@@ -2,6 +2,7 @@ import React from "react";
 import { render, screen } from "@testing-library/react";
 import { beforeEach, describe, expect, test, vi } from "vitest";
 import { useOwnerWeights } from "../hooks/useOwnerWeights";
+import { getWeightCapPct, getRequiredQuorumWeight, getSpendingLimit } from "../lib/contract";
 import type { Owner } from "../types/accord";
 import { OwnersPage } from "./OwnersPage";
 
@@ -15,6 +16,9 @@ vi.mock("../lib/contract", () => ({
 }));
 
 const mockUseOwnerWeights = vi.mocked(useOwnerWeights);
+const mockGetWeightCapPct = vi.mocked(getWeightCapPct);
+const mockGetRequiredQuorumWeight = vi.mocked(getRequiredQuorumWeight);
+const mockGetSpendingLimit = vi.mocked(getSpendingLimit);
 
 const ownerAddresses = ["GOWNER111", "GOWNER222"];
 const owners: Owner[] = [
@@ -28,17 +32,19 @@ function renderOwnersPage() {
       owners={owners}
       ownerAddresses={ownerAddresses}
       threshold={5}
-      totalOwners={owners.length}
     />,
   );
 }
 
 describe("OwnersPage", () => {
   beforeEach(() => {
     vi.clearAllMocks();
+    mockGetWeightCapPct.mockResolvedValue(50);
+    mockGetRequiredQuorumWeight.mockResolvedValue(10);
+    mockGetSpendingLimit.mockResolvedValue(-1n);
   });
 
-  test("shows weighted quorum and each owner voting share", () => {
+  test("shows weighted quorum and each owner voting share", async () => {
     mockUseOwnerWeights.mockReturnValue({
       weights: { GOWNER111: 5, GOWNER222: 15 },
       totalWeight: 20,

frontend/src/pages/OwnersPage.tsx

@@ -47,7 +47,6 @@ type OwnersPageProps = {
   owners: Owner[];
   ownerAddresses: string[];
   threshold: number;
-  totalOwners: number;
   walletAddress: string | null;
   onProposalSubmitted: () => void;
 };
@@ -56,7 +55,6 @@ export function OwnersPage({
   owners,
   ownerAddresses,
   threshold,
-  totalOwners,
   walletAddress,
   onProposalSubmitted,
 }: OwnersPageProps) {
@@ -186,6 +184,13 @@ export function OwnersPage({
     };
   }, [ownerAddresses]);
 
+  const hasOwnerWeights = totalWeight > 0;
+  const ownerWeightsLoading = weightsLoading;
+  const weightsUnavailable = !weightsLoading && totalWeight === 0;
+  const weightsStale = false;
+  const ownerCountLabel = `${ownerAddresses.length} ${ownerAddresses.length === 1 ? "owner" : "owners"}`;
+  const quorumPercent = totalWeight > 0 ? ((threshold / totalWeight) * 100).toFixed(1) : "0";
+
   const visibleOwners = owners
     .map((owner, idx) => {
       const fullAddress = ownerAddresses[idx] ?? owner.address;