Skip to content

feat: show tags for psk provisioners #14628

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 17 commits into from
Sep 17, 2024
Merged
Show file tree
Hide file tree
Changes from 6 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const Example: Story = {
await step("click to open", async () => {
await userEvent.click(canvas.getByRole("button"));
await waitFor(() =>
expect(screen.getByText(/v99\.999\.9999/i)).toBeInTheDocument(),
expect(screen.getByText(/v2\.99\.99/i)).toBeInTheDocument(),
);
});
},
Expand Down
63 changes: 15 additions & 48 deletions site/src/modules/provisioners/ProvisionerGroup.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import Person from "@mui/icons-material/Person";
import Button from "@mui/material/Button";
import Link from "@mui/material/Link";
import Tooltip from "@mui/material/Tooltip";
import type { BuildInfoResponse } from "api/typesGenerated";
import type { BuildInfoResponse, ProvisionerDaemon } from "api/typesGenerated";
import { DropdownArrow } from "components/DropdownArrow/DropdownArrow";
import {
HelpTooltip,
Expand All @@ -20,7 +20,6 @@ import {
PopoverTrigger,
} from "components/Popover/Popover";
import { Stack } from "components/Stack/Stack";
import type { ProvisionerDaemonWithWarnings } from "pages/ManagementSettingsPage/OrganizationProvisionersPageView";
import { type FC, useState } from "react";
import { createDayString } from "utils/createDayString";
import { docs } from "utils/docs";
Expand All @@ -32,7 +31,7 @@ interface ProvisionerGroupProps {
readonly buildInfo?: BuildInfoResponse;
readonly keyName?: string;
readonly type: ProvisionerGroupType;
readonly provisioners: ProvisionerDaemonWithWarnings[];
readonly provisioners: ProvisionerDaemon[];
}

export const ProvisionerGroup: FC<ProvisionerGroupProps> = ({
Expand All @@ -55,39 +54,22 @@ export const ProvisionerGroup: FC<ProvisionerGroupProps> = ({
);
const upToDate =
allProvisionersAreSameVersion && buildInfo?.version === provisioner.version;
const protocolUpToDate =
allProvisionersAreSameVersion &&
buildInfo?.provisioner_api_version === provisioner.api_version;
const provisionerCount =
provisioners.length === 1
? "1 provisioner"
: `${provisioners.length} provisioners`;

// Count how many total warnings there are in this group, and how many
// provisioners they come from.
let warningCount = 0;
let warningProvisionerCount = 0;
for (const provisioner of provisioners) {
const provisionerWarningCount = provisioner.warnings?.length ?? 0;
warningCount += provisionerWarningCount;
warningProvisionerCount += provisionerWarningCount > 0 ? 1 : 0;
}

const extraTags = Object.entries(provisioner.tags).filter(
([key]) => key !== "scope" && key !== "owner",
);
const isWarning = warningCount > 0;

return (
<div
css={[
{
borderRadius: 8,
border: `1px solid ${theme.palette.divider}`,
fontSize: 14,
},
isWarning && { borderColor: theme.roles.warning.fill.outline },
]}
css={{
borderRadius: 8,
border: `1px solid ${theme.palette.divider}`,
fontSize: 14,
}}
>
<header
css={{
Expand Down Expand Up @@ -180,19 +162,13 @@ export const ProvisionerGroup: FC<ProvisionerGroupProps> = ({
{provisioners.map((provisioner) => (
<div
key={provisioner.id}
css={[
{
borderRadius: 8,
border: `1px solid ${theme.palette.divider}`,
fontSize: 14,
padding: "12px 18px",
width: 310,
},
provisioner.warnings &&
provisioner.warnings.length > 0 && {
borderColor: theme.roles.warning.fill.outline,
},
]}
css={{
borderRadius: 8,
border: `1px solid ${theme.palette.divider}`,
fontSize: 14,
padding: "12px 18px",
width: 310,
}}
>
<div css={{ lineHeight: 1.6 }}>
<h4 css={styles.groupTitle}>{provisioner.name}</h4>
Expand Down Expand Up @@ -267,16 +243,7 @@ export const ProvisionerGroup: FC<ProvisionerGroupProps> = ({
color: theme.palette.text.secondary,
}}
>
{warningCount > 0 ? (
<span>
{warningCount === 1 ? "1 warning" : `${warningCount} warnings`} from{" "}
{warningProvisionerCount === 1
? "1 provisioner"
: `${warningProvisionerCount} provisioners`}
</span>
) : (
<span>No warnings from {provisionerCount}</span>
)}
<span>No warnings from {provisionerCount}</span>
<Button
variant="text"
css={{
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -18,22 +18,35 @@ import {
type ProvisionersByGroup,
} from "./OrganizationProvisionersPageView";

const ProvisionerKeyIDBuiltIn = "00000000-0000-0000-0000-000000000001";
const ProvisionerKeyIDUserAuth = "00000000-0000-0000-0000-000000000002";
const ProvisionerKeyIDPSK = "00000000-0000-0000-0000-000000000003";

function groupProvisioners(
provisioners: readonly ProvisionerDaemon[],
): ProvisionersByGroup {
const groups: ProvisionersByGroup = { builtin: [], psk: [], keys: new Map() };
const type = "builtin";
const groups: ProvisionersByGroup = {
builtin: [],
psk: [],
userAuth: [],
keys: new Map(),
};
// NOTE: I'll fix this at the end of the PR chain
const keyName = "TODO";

for (const it of provisioners) {
if (type === "builtin") {
if (it.key_id === ProvisionerKeyIDBuiltIn) {
groups.builtin.push(it);
continue;
}
if (type === "psk") {
if (it.key_id === ProvisionerKeyIDPSK) {
groups.psk.push(it);
continue;
}
if (it.key_id === ProvisionerKeyIDUserAuth) {
groups.userAuth.push(it);
continue;
}

const keyGroup = groups.keys.get(keyName) ?? [];
if (!groups.keys.has(keyName)) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ export const Provisioners: Story = {
provisioners: {
builtin: [MockProvisioner, MockProvisioner2],
psk: [MockProvisioner, MockUserProvisioner, MockProvisionerWithTags],
userAuth: [],
keys: new Map([
[
"ベン",
Expand Down
Original file line number Diff line number Diff line change
@@ -1,24 +1,17 @@
import OpenInNewIcon from "@mui/icons-material/OpenInNew";
import Button from "@mui/material/Button";
import type {
BuildInfoResponse,
HealthMessage,
ProvisionerDaemon,
} from "api/typesGenerated";
import type { BuildInfoResponse, ProvisionerDaemon } from "api/typesGenerated";
import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader";
import { Stack } from "components/Stack/Stack";
import { ProvisionerGroup } from "modules/provisioners/ProvisionerGroup";
import type { FC } from "react";
import { docs } from "utils/docs";

export interface ProvisionerDaemonWithWarnings extends ProvisionerDaemon {
readonly warnings?: readonly HealthMessage[];
}

export interface ProvisionersByGroup {
builtin: ProvisionerDaemonWithWarnings[];
psk: ProvisionerDaemonWithWarnings[];
keys: Map<string, ProvisionerDaemonWithWarnings[]>;
builtin: ProvisionerDaemon[];
psk: ProvisionerDaemon[];
userAuth: ProvisionerDaemon[];
keys: Map<string, ProvisionerDaemon[]>;
}

interface OrganizationProvisionersPageViewProps {
Expand Down
26 changes: 26 additions & 0 deletions site/src/testHelpers/entities.ts
Original file line number Diff line number Diff line change
Expand Up @@ -578,6 +578,7 @@ export const MockProvisionerKey: TypesGen.ProvisionerKey = {
export const MockProvisioner: TypesGen.ProvisionerDaemon = {
created_at: "2022-05-17T17:39:01.382927298Z",
id: "test-provisioner",
key_id: "00000000-0000-0000-0000-000000000001",
organization_id: MockOrganization.id,
name: "Test Provisioner",
provisioners: ["echo"],
Expand All @@ -587,10 +588,35 @@ export const MockProvisioner: TypesGen.ProvisionerDaemon = {
last_seen_at: new Date().toISOString(),
};

export const MockUserAuthProvisioner: TypesGen.ProvisionerDaemon = {
...MockProvisioner,
id: "test-user-auth-provisioner",
key_id: "00000000-0000-0000-0000-000000000002",
name: `${MockUser.name}'s provisioner`,
tags: { scope: "user" },
};

export const MockPskProvisioner: TypesGen.ProvisionerDaemon = {
...MockProvisioner,
id: "test-psk-provisioner",
key_id: "00000000-0000-0000-0000-000000000003",
name: "Test psk provisioner",
};

export const MockKeyProvisioner: TypesGen.ProvisionerDaemon = {
...MockProvisioner,
id: "test-key-provisioner",
key_id: MockProvisionerKey.id,
organization_id: MockProvisionerKey.organization,
name: "Test key provisioner",
tags: MockProvisionerKey.tags,
};

export const MockProvisioner2: TypesGen.ProvisionerDaemon = {
...MockProvisioner,
id: "test-provisioner-2",
name: "Test Provisioner 2",
key_id: MockProvisionerKey.id,
};

export const MockUserProvisioner: TypesGen.ProvisionerDaemon = {
Expand Down
Loading