apps/web/app/routes/workspace/team/settings.tsx · flagon-io/g1t

1

import { useState } from "react";

2

import { Form, data, redirect } from "react-router";

import {

MAX_ASSIGNED,

REVIEW_ALGORITHM_LABELS,

7

REVIEW_ALGORITHM_SUMMARIES,

8

TEAM_VISIBILITY_SUMMARIES,

9

type ReviewAlgorithm,

10

type TeamVisibility,

11

} from "@g1t/contracts";

12

13

import type { Route } from "./+types/settings";

14

import { ConfirmDialog } from "../../../components/repo-lifecycle";

15

import { useTeam, useTeamAgents } from "../../../components/teams";

16

import { Coming } from "../../../components/people";

17

import { SelectField } from "../../../components/ui/select";

18

import { budgetFromText } from "../../../lib/people";

19

import { ErrorText, Field, Input, SubmitButton } from "../../../components/ui";

20

import { Button } from "../../../components/ui/button";

21

import { Card } from "../../../components/ui/card";

22

import { Input as NumberInput } from "../../../components/ui/input";

23

import { Textarea } from "../../../components/ui/textarea";

24

import { CheckboxOption } from "../../../components/ui/checkbox";

25

import { RadioGroup, RadioOption } from "../../../components/ui/radio-group";

26

import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../../../components/ui/select";

27

import { SwitchCard } from "../../../components/ui/switch";

28

import { parentChoices, reviewAssignmentFromForm, teamChangesFromForm, teamPath } from "../../../lib/teams";

29

import { chat, identity, workspaceAgents } from "../../../lib/services.server";

30

import { assertSameOrigin, getViewer, requireUser, roleIn, unwrap } from "../../../lib/session.server";

31

32

/** The parent select's value for "no parent". */

33

const NO_PARENT = "-";

34

/** The lead select's value for no lead. */

35

const NO_LEAD = "none";

36

37

/**

38

* Its lead, channel and budget. An agent made lead is added to the team

39

* first if it isn't on it, as identity needs; a channel is found by its

40

* name in Chat, as the viewer sees it.

41

*/

42

async function saveLeadChannelBudget(form: FormData, workspace: string, slug: string, user: Parameters<typeof identity.updateTeam>[0]) {

43

const intent = "people";

44

const lead = String(form.get("lead") ?? NO_LEAD);

45

const channel = String(form.get("channel") ?? "").trim().replace(/^#/, "").toLowerCase();

46

const budget = budgetFromText(String(form.get("budget") ?? ""));

47

if (budget === null) return { intent, error: "Give the budget in dollars, such as 150.", saved: false };

48

if (lead.startsWith("agent:")) {

49

const listed = await workspaceAgents.list(workspace, user).catch(() => null);

50

const agent = listed?.ok ? listed.value.find((a) => `agent:${a.id}` === lead) : null;

51

if (!agent) return { intent, error: "Choose one of the team's agents.", saved: false };

52

const added = await identity.setTeamAgent(user, workspace, slug, agent.id);

53

if (!added.ok) return { intent, error: added.error.message, saved: false };

54

}

55

let channelId = "";

56

let channelName = "";

57

if (channel) {

58

const found = await chat.channelByName(workspace, channel, user).catch(() => null);

59

if (!found?.ok || found.value.channel.kind !== "channel") return { intent, error: `There is no channel #${channel} you can see.`, saved: false };

60

channelId = found.value.channel.id;

61

channelName = found.value.channel.name ?? channel;

62

}

63

const saved = await identity.updateTeam(user, workspace, slug, {

64

lead: lead === NO_LEAD ? "" : lead,

65

channel_id: channelId,

66

channel_name: channelName,

67

budget_micros: budget,

68

});

69

return saved.ok ? { intent, error: null, saved: true } : { intent, error: saved.error.message, saved: false };

70

}

71

72

export async function loader({ params, context }: Route.LoaderArgs) {

73

const viewer = getViewer(context);

74

if (!roleIn(viewer, params.owner)) throw data(null, { status: 404 });

75

const team = unwrap(await identity.getTeam(viewer, params.owner, params.team));

76

if (!team.can_manage) throw data(null, { status: 404 });

77

const [all, members] = await Promise.all([

78

identity.listTeams(viewer, params.owner).then((found) => (found.ok ? found.value : [])),

79

// Who can lead it: its own people (and its agents, from the layout).

80

identity.teamMembers(viewer, params.owner, params.team, false).then((found) => (found.ok ? found.value : [])),

81

]);

82

const parents = parentChoices(all, team.slug).filter((other) => other.can_manage || other.slug === team.parent?.slug);

83

return { parents, people: members.map((member) => ({ username: member.username, name: member.name })) };

84

}

85

86

export async function action({ request, params, context }: Route.ActionArgs) {

87

assertSameOrigin(request);

88

const user = requireUser(context, request);

89

const form = await request.formData();

90

const intent = String(form.get("intent") ?? "");

91

if (intent === "delete") {

92

const deleted = await identity.deleteTeam(user, params.owner, params.team);

93

if (!deleted.ok) return { intent, error: deleted.error.message, saved: false };

94

throw redirect(`/${params.owner}/-/teams`);

95

}

96

if (intent === "review") {

97

const current = unwrap(await identity.getTeam(user, params.owner, params.team));

98

const review = reviewAssignmentFromForm(form, current.review_assignment);

99

const saved = await identity.updateTeam(user, params.owner, params.team, { review_assignment: review });

100

return saved.ok ? { intent, error: null, saved: true } : { intent, error: saved.error.message, saved: false };

101

}

102

if (intent === "people") return saveLeadChannelBudget(form, params.owner, params.team, user);

103

const changes = teamChangesFromForm(form);

104

if (changes.parent === NO_PARENT) changes.parent = "";

105

const saved = await identity.updateTeam(user, params.owner, params.team, changes);

106

if (!saved.ok) return { intent, error: saved.error.message, saved: false };

107

// A new slug is a new address.

108

if (saved.value.slug !== params.team) throw redirect(teamPath(saved.value.workspace, saved.value.slug, "settings"));

109

return { intent, error: null, saved: true };

110

}

111

112

export default function TeamSettings({ loaderData, actionData }: Route.ComponentProps) {

113

const team = useTeam();

114

const { agents } = useTeamAgents();

115

const { parents, people } = loaderData;

116

const leadValue = team.lead ? (team.lead.kind === "user" ? `@${team.lead.username}` : `agent:${team.lead.agent_id}`) : NO_LEAD;

117

const said = (intent: string) => (actionData?.intent === intent ? actionData : null);

118

const [visibility, setVisibility] = useState<TeamVisibility>(team.visibility);

119

const review = team.review_assignment;

120

const [assigning, setAssigning] = useState(review.enabled);

121

const [algorithm, setAlgorithm] = useState<ReviewAlgorithm>(review.algorithm);

122

const [skipBusy, setSkipBusy] = useState(review.skip_busy);

return (

Profile

</h2>

</Field>

<Field label="Slug" hint={`Mentioned as @${team.workspace}/<slug>. Changing it changes the team's address and how it is mentioned.`}>

</Field>

</Field>

<legend className="mb-2 text-sm font-medium text-muted">Visibility</legend>

143

<RadioGroup name="visibility" value={visibility} onValueChange={(value) => setVisibility(value as TeamVisibility)} className="space-y-3">

</RadioGroup>

</fieldset>

{visibility === "visible" && (

149

<div>

150

<span className="mb-1.5 block text-sm font-medium text-muted">Parent team</span>

</SelectTrigger>

<SelectItem value={NO_PARENT}>No parent</SelectItem>

157

{parents.map((parent) => (

{parent.name}

</SelectItem>

))}

</SelectContent>

</Select>

It has its parent's roles on repositories, and hears what is asked of its parent. Moving it needs you to

166

maintain both teams, or own the workspace.

</span>

</div>

)}

Everyone in it, and in its child teams, hears of @{team.workspace}/{team.slug} in their notifications.

173

</SwitchCard>

174

<ErrorText>{said("profile")?.error ?? null}</ErrorText>

Save

</SubmitButton>

{said("profile")?.saved && <span className="text-sm text-muted">Saved.</span>}

</div>

</Form>

</section>

Lead, channel and budget

187

</h2>

188

189

Everyone on {team.name}, agents included, is told who leads it and where it talks. Its budget caps what its agents spend

190

together in a month; each agent keeps its own budget too.

</p>

<SelectField

name="lead"

defaultValue={leadValue}

199

className="w-full sm:max-w-72"

200

options={[

201

{ value: NO_LEAD, label: "No lead" },

202

...people.map((person) => ({ value: `@${person.username}`, label: person.name ? `${person.name} (@${person.username})` : `@${person.username}` })),

203

...agents.map((agent) => ({ value: `agent:${agent.id}`, label: `${agent.display_name}, an agent` })),

204

]}

205

/>

206

<span className="mt-1.5 block text-xs text-faint">Someone on the team. Agents page the lead first when a person is needed.</span>

</label>

</span>

</Field>

</span>

</Field>

Storage level <Coming />

220

</div>

221

<ErrorText>{said("people")?.error ?? null}</ErrorText>

Save

</SubmitButton>

{said("people")?.saved && <span className="text-sm text-muted">Saved.</span>}

</div>

</Form>

</section>

Code review assignment

234

</h2>

235

236

When {team.name} is asked to review a pull request, by a person or by a CODEOWNERS file. Off, everyone in the

237

team is asked. On, g1t picks people from it; the team stays shown as asked.

</p>

Never the pull request's author, and people from the team already asked count.

</SwitchCard>

{assigning && (

</Field>

<legend className="mb-2 text-sm font-medium text-muted">Who goes first</legend>

251

<RadioGroup name="algorithm" value={algorithm} onValueChange={(value) => setAlgorithm(value as ReviewAlgorithm)} className="space-y-3">

252

{(["round_robin", "load_balance"] as const).map((value) => (

))}

</RadioGroup>

</fieldset>

<CheckboxOption

name="skip_busy"

checked={skipBusy}

onCheckedChange={(on) => setSkipBusy(on === true)}

262

label="Skip people who are busy"

263

description="Busy: this many or more open pull requests are waiting on their review."

/>

{skipBusy && (

</div>

)}

</div>

<CheckboxOption

name="include_child_teams"

273

defaultChecked={review.include_child_teams}

274

label="Pick from child teams too"

275

description="Otherwise only the team's own people are picked."

/>

<CheckboxOption

name="notify_team"

defaultChecked={review.notify_team}

280

label="Also tell the rest of the team"

281

description="Everyone in the team hears of the request, not only the people picked."

/>

</Field>

</Card>

)}

{!assigning && (

<>

{/* Kept as they are while assignment is off. */}

{review.skip_busy && <input type="hidden" name="skip_busy" value="on" />}

296

{review.include_child_teams && <input type="hidden" name="include_child_teams" value="on" />}

297

{review.notify_team && <input type="hidden" name="notify_team" value="on" />}

298

</>

299

)}

300

<ErrorText>{said("review")?.error ?? null}</ErrorText>

Save

</SubmitButton>

{said("review")?.saved && <span className="text-sm text-muted">Saved.</span>}

</div>

</Form>

</section>

Delete this team

</h2>

Its people stay in {team.workspace}, and lose the roles the team gave them. Its child teams move up to{" "}

316

{team.parent ? team.parent.name : "the top"}.

</p>

<ConfirmDialog

intent="delete"

title={`Delete ${team.name}?`}

322

description="This cannot be undone."

323

confirm={`${team.workspace}/${team.slug}`}

324

submit="Delete team"

325

busy="Deleting…"

326

error={said("delete")?.error ?? null}

trigger={(open) => (

Delete team

</Button>

)}

>

<li>Mentions of @{team.workspace}/{team.slug} stop telling anyone.</li>

334

<li>Pull requests that asked it to review keep the people it picked.</li>

</ConfirmDialog>

</div>

</section>

</div>

);

}