hearthforge

hearthforge/src/views/patches/NewPatch.tsx
NewPatch.tsx
⎇
Raw
1import config from "../../config.ts";
2import type { LabelRow, RepositoryRow } from "../../db/index.ts";
3import { labelTextColor } from "../../lib/labelColor.ts";
4import type { SessionUser } from "../../middleware/session.ts";
5import { Layout } from "../layout.tsx";
6import { RepoHeader } from "../repos/RepoHeader.tsx";
7import { RepoNav } from "../repos/RepoNav.tsx";
8
9interface NewPatchProps {
10 user: SessionUser;
11 repo: RepositoryRow;
12 error?: string;
13 template?: string;
14 labels: LabelRow[];
15}
16
17export function NewPatch({
18 user,
19 repo,
20 error,
21 template,
22 labels,
23}: NewPatchProps) {
24 return (
25 <Layout user={user} title={`New patch — ${repo.name}`}>
26 <div class="container">
27 <RepoHeader repo={repo} />
28 <RepoNav repo={repo} active="patches" user={user} />
29 <h2 class="section-title">Upload patch</h2>
30 {error && <p class="form-error">{error}</p>}
31 <form
32 method="POST"
33 action={`/${repo.name}/patches`}
34 enctype="multipart/form-data"
35 class="form-card"
36 >
37 <div class="form-group">
38 <label for="title">Title</label>
39 <input
40 id="title"
41 name="title"
42 type="text"
43 required
44 maxlength={config.MAX_TITLE_BYTES}
45 placeholder="What does this patch do?"
46 />
47 </div>
48 <div class="form-group">
49 <label for="description">
50 Description{" "}
51 <span class="text-muted">
52 (Markdown supported, optional)
53 </span>
54 </label>
55 <textarea id="description" name="description" rows="5" maxlength={config.MAX_TEXT_BODY_BYTES}>
56 {template ?? ""}
57 </textarea>
58 </div>
59 <div class="form-group">
60 <label for="patch_file">
61 Patch file <span class="text-muted">(.patch)</span>
62 </label>
63 <input
64 id="patch_file"
65 name="patch_file"
66 type="file"
67 accept=".patch"
68 required
69 />
70 </div>
71 {labels.length > 0 &&
72 (user.isAdmin || repo.allow_user_labels === 1) && (
73 <div class="form-group">
74 <span class="form-group-label">Labels</span>
75 <div class="label-checkbox-list">
76 {labels.map((label) => (
77 <label class="label-checkbox-item">
78 <input
79 type="checkbox"
80 name="label_ids"
81 value={String(label.id)}
82 />
83 <span
84 class="label-badge"
85 style={`background:${label.color};color:${labelTextColor(label.color)}`}
86 >
87 {label.name}
88 </span>
89 </label>
90 ))}
91 </div>
92 </div>
93 )}
94 <div class="form-actions">
95 <button type="submit" class="btn btn-primary">
96 Upload patch
97 </button>
98 <a href={`/${repo.name}/patches`} class="btn">
99 Cancel
100 </a>
101 </div>
102 </form>
103 </div>
104 </Layout>
105 );
106}
107