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
56 id="description"
57 name="description"
58 rows="5"
59 maxlength={config.MAX_TEXT_BODY_BYTES}
60 >
61 {template ?? ""}
62 </textarea>
63 </div>
64 <div class="form-group">
65 <label for="patch_file">
66 Patch file <span class="text-muted">(.patch)</span>
67 </label>
68 <input
69 id="patch_file"
70 name="patch_file"
71 type="file"
72 accept=".patch"
73 required
74 />
75 </div>
76 {labels.length > 0 &&
77 (user.isAdmin || repo.allow_user_labels === 1) && (
78 <div class="form-group">
79 <span class="form-group-label">Labels</span>
80 <div class="label-checkbox-list">
81 {labels.map((label) => (
82 <label class="label-checkbox-item">
83 <input
84 type="checkbox"
85 name="label_ids"
86 value={String(label.id)}
87 />
88 <span
89 class="label-badge"
90 style={`background:${label.color};color:${labelTextColor(label.color)}`}
91 >
92 {label.name}
93 </span>
94 </label>
95 ))}
96 </div>
97 </div>
98 )}
99 <div class="form-actions">
100 <button type="submit" class="btn btn-primary">
101 Upload patch
102 </button>
103 <a href={`/${repo.name}/patches`} class="btn">
104 Cancel
105 </a>
106 </div>
107 </form>
108 </div>
109 </Layout>
110 );
111}
112