diff --git a/site/src/api/api.ts b/site/src/api/api.ts index 9b0af8f942e0e..df8477b65e926 100644 --- a/site/src/api/api.ts +++ b/site/src/api/api.ts @@ -1006,7 +1006,7 @@ export const getWorkspaceBuildParameters = async ( return response.data } type Claims = { - license_expires?: number + license_expires: number account_type?: string account_id?: string trial: boolean diff --git a/site/src/components/LicenseCard/LicenseCard.test.tsx b/site/src/components/LicenseCard/LicenseCard.test.tsx new file mode 100644 index 0000000000000..cdef5a54f39c1 --- /dev/null +++ b/site/src/components/LicenseCard/LicenseCard.test.tsx @@ -0,0 +1,70 @@ +import { screen } from "@testing-library/react" +import { render } from "../../testHelpers/renderHelpers" +import { LicenseCard } from "./LicenseCard" +import { MockLicenseResponse } from "testHelpers/entities" + +describe("LicenseCard", () => { + it("renders (smoke test)", async () => { + // When + render( + null} + isRemoving={false} + />, + ) + + // Then + await screen.findByText("#1") + await screen.findByText("1 / 10") + await screen.findByText("Enterprise") + }) + + it("renders userLimit as unlimited if there is not user limit", async () => { + // When + render( + null} + isRemoving={false} + />, + ) + + // Then + await screen.findByText("#1") + await screen.findByText("1 / Unlimited") + await screen.findByText("Enterprise") + }) + + it("renders license's user_limit when it is available instead of using the default", async () => { + const licenseUserLimit = 3 + const license = { + ...MockLicenseResponse[0], + claims: { + ...MockLicenseResponse[0].claims, + features: { + ...MockLicenseResponse[0].claims.features, + user_limit: licenseUserLimit, + }, + }, + } + + // When + render( + null} + isRemoving={false} + />, + ) + + // Then + await screen.findByText("1 / 3") + }) +}) diff --git a/site/src/components/LicenseCard/LicenseCard.tsx b/site/src/components/LicenseCard/LicenseCard.tsx index 856c598cecaaa..4e6596b91a324 100644 --- a/site/src/components/LicenseCard/LicenseCard.tsx +++ b/site/src/components/LicenseCard/LicenseCard.tsx @@ -1,16 +1,16 @@ import Button from "@mui/material/Button" import Paper from "@mui/material/Paper" import { makeStyles } from "@mui/styles" -import { License } from "api/typesGenerated" import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog" import { Stack } from "components/Stack/Stack" import dayjs from "dayjs" import { useState } from "react" import { Pill } from "components/Pill/Pill" import { compareAsc } from "date-fns" +import { GetLicensesResponse } from "api/api" type LicenseCardProps = { - license: License + license: GetLicensesResponse userLimitActual?: number userLimitLimit?: number onRemove: (licenseId: number) => void @@ -30,6 +30,9 @@ export const LicenseCard = ({ number | undefined >(undefined) + const currentUserLimit = + license.claims.features["user_limit"] || userLimitLimit + return ( Users - {userLimitActual} {` / ${userLimitLimit || "Unlimited"}`} + {userLimitActual} {` / ${currentUserLimit || "Unlimited"}`} = ({ {licenses ?.sort( (a, b) => - new Date(b.claims.license_expires as number).valueOf() - - new Date(a.claims.license_expires as number).valueOf(), + new Date(b.claims.license_expires).valueOf() - + new Date(a.claims.license_expires).valueOf(), ) .map((license) => (