feat(FN-2607): merge fusion/fn-2607 (auto-resolved)
- test(FN-2607): complete Step 3 — update usage indicator assertions - feat(FN-2607): complete Step 2 — hide labels for hidden usage rows - feat(FN-2607): complete Step 1 — remove connected provider badge
This commit is contained in:
@@ -1307,11 +1307,6 @@
|
|||||||
border-radius: var(--radius-pill);
|
border-radius: var(--radius-pill);
|
||||||
}
|
}
|
||||||
|
|
||||||
.usage-status-badge--connected {
|
|
||||||
background: rgba(63, 185, 80, 0.15);
|
|
||||||
color: var(--color-success);
|
|
||||||
}
|
|
||||||
|
|
||||||
.usage-status-badge--error {
|
.usage-status-badge--error {
|
||||||
background: rgba(248, 81, 73, 0.15);
|
background: rgba(248, 81, 73, 0.15);
|
||||||
color: var(--color-error);
|
color: var(--color-error);
|
||||||
@@ -1395,7 +1390,8 @@
|
|||||||
|
|
||||||
.usage-window--hidden .usage-progress-wrapper,
|
.usage-window--hidden .usage-progress-wrapper,
|
||||||
.usage-window--hidden .usage-window-footer,
|
.usage-window--hidden .usage-window-footer,
|
||||||
.usage-window--hidden .usage-pace-row {
|
.usage-window--hidden .usage-pace-row,
|
||||||
|
.usage-window--hidden .usage-window-label {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -327,11 +327,7 @@ function ProviderCard({
|
|||||||
const getStatusBadge = () => {
|
const getStatusBadge = () => {
|
||||||
switch (provider.status) {
|
switch (provider.status) {
|
||||||
case "ok":
|
case "ok":
|
||||||
return (
|
return null;
|
||||||
<span className="usage-status-badge usage-status-badge--connected">
|
|
||||||
Connected
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
case "error":
|
case "error":
|
||||||
return (
|
return (
|
||||||
<span className="usage-status-badge usage-status-badge--error">
|
<span className="usage-status-badge usage-status-badge--error">
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
import { describe, it, expect, vi, beforeEach } from "vitest";
|
import { describe, it, expect, vi, beforeEach } from "vitest";
|
||||||
import { render, screen, fireEvent } from "@testing-library/react";
|
import { render, screen, fireEvent } from "@testing-library/react";
|
||||||
import { UsageIndicator } from "../UsageIndicator";
|
import { UsageIndicator } from "../UsageIndicator";
|
||||||
|
import "../PlanningModeModal.css";
|
||||||
import * as useUsageDataModule from "../../hooks/useUsageData";
|
import * as useUsageDataModule from "../../hooks/useUsageData";
|
||||||
import type { ProviderUsage } from "../../api";
|
import type { ProviderUsage } from "../../api";
|
||||||
import { scopedKey } from "../../utils/projectStorage";
|
import { scopedKey } from "../../utils/projectStorage";
|
||||||
@@ -117,7 +118,6 @@ describe("UsageIndicator", () => {
|
|||||||
expect(screen.getByText("Google")).toBeInTheDocument();
|
expect(screen.getByText("Google")).toBeInTheDocument();
|
||||||
|
|
||||||
// Check status badges
|
// Check status badges
|
||||||
expect(screen.getAllByText("Connected").length).toBeGreaterThanOrEqual(1);
|
|
||||||
expect(screen.getByText("Not configured")).toBeInTheDocument();
|
expect(screen.getByText("Not configured")).toBeInTheDocument();
|
||||||
|
|
||||||
// Check usage windows
|
// Check usage windows
|
||||||
@@ -318,6 +318,27 @@ describe("UsageIndicator", () => {
|
|||||||
expect(mockUseUsageData).toHaveBeenCalledWith({ autoRefresh: false });
|
expect(mockUseUsageData).toHaveBeenCalledWith({ autoRefresh: false });
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it("does not render a Connected badge for providers with ok status", () => {
|
||||||
|
mockUseUsageData.mockReturnValue({
|
||||||
|
providers: [
|
||||||
|
{
|
||||||
|
name: "Anthropic",
|
||||||
|
icon: "🅰️",
|
||||||
|
status: "ok",
|
||||||
|
windows: [],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
loading: false,
|
||||||
|
error: null,
|
||||||
|
lastUpdated: new Date(),
|
||||||
|
refresh: mockRefresh,
|
||||||
|
});
|
||||||
|
|
||||||
|
render(<UsageIndicator isOpen={true} onClose={mockOnClose} projectId={TEST_PROJECT_ID} />);
|
||||||
|
|
||||||
|
expect(screen.queryByText("Connected")).not.toBeInTheDocument();
|
||||||
|
});
|
||||||
|
|
||||||
it("renders provider error messages", () => {
|
it("renders provider error messages", () => {
|
||||||
mockUseUsageData.mockReturnValue({
|
mockUseUsageData.mockReturnValue({
|
||||||
providers: [
|
providers: [
|
||||||
@@ -561,10 +582,12 @@ describe("UsageIndicator", () => {
|
|||||||
|
|
||||||
render(<UsageIndicator isOpen={true} onClose={mockOnClose} projectId={TEST_PROJECT_ID} />);
|
render(<UsageIndicator isOpen={true} onClose={mockOnClose} projectId={TEST_PROJECT_ID} />);
|
||||||
|
|
||||||
|
const sessionLabel = screen.getByText("Session (5h)");
|
||||||
fireEvent.click(screen.getByRole("button", { name: "Hide Session (5h)" }));
|
fireEvent.click(screen.getByRole("button", { name: "Hide Session (5h)" }));
|
||||||
|
|
||||||
const hiddenRow = screen.getByText("Session (5h)").closest(".usage-window");
|
const hiddenRow = sessionLabel.closest(".usage-window");
|
||||||
expect(hiddenRow).toHaveClass("usage-window--hidden");
|
expect(hiddenRow).toHaveClass("usage-window--hidden");
|
||||||
|
expect(sessionLabel).not.toBeVisible();
|
||||||
expect(screen.queryByText("45% used")).not.toBeInTheDocument();
|
expect(screen.queryByText("45% used")).not.toBeInTheDocument();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user