NewRelease.tsx
Raw
1import type { RepositoryRow } from "../../db/index.ts";
2import type { SessionUser } from "../../middleware/session.ts";
3import { Layout } from "../layout.tsx";
4import { RepoHeader } from "../repos/RepoHeader.tsx";
5import { RepoNav } from "../repos/RepoNav.tsx";
6
7interface NewReleaseProps {
8 user: SessionUser;
9 repo: RepositoryRow;
10 error?: string;
11 values?: {
12 create_tag?: boolean;
13 tag_name?: string;
14 revision?: string;
15 name?: string;
16 notes?: string;
17 include_source_code?: boolean;
18 };
19}
20
21export function NewRelease({ user, repo, error, values }: NewReleaseProps) {
22 const showTagFields = values?.create_tag ?? false;
23 const defaultRevision =
24 values?.revision !== undefined ? values.revision : repo.default_branch;
25 return (
26 <Layout user={user} title={`New Release — ${repo.name}`}>
27 <div class="container">
28 <RepoHeader repo={repo} />
29 <RepoNav repo={repo} active="releases" user={user} />
30 <div class="form-page">
31 <h2 class="page-title">New Release</h2>
32 {error && <div class="form-error">{error}</div>}
33 <form
34 method="post"
35 action={`/${repo.name}/releases`}
36 enctype="multipart/form-data"
37 class="form"
38 >
39 <div class="form-group">
40 <label class="form-label" for="name">
41 Release title{" "}
42 <span class="form-required">*</span>
43 </label>
44 <input
45 type="text"
46 id="name"
47 name="name"
48 class="form-input"
49 required
50 value={values?.name ?? ""}
51 placeholder="e.g. Version 1.0 — Initial Release"
52 />
53 </div>
54 <div class="form-group">
55 <label class="checkbox-label">
56 <input
57 type="checkbox"
58 id="create_tag"
59 name="create_tag"
60 value="on"
61 checked={showTagFields}
62 />
63 <span>Create a git tag for this release</span>
64 </label>
65 </div>
66 <div
67 id="tag-fields-group"
68 style={showTagFields ? "" : "display:none"}
69 >
70 <div class="form-group">
71 <label class="form-label" for="tag_name">
72 Tag name{" "}
73 <span class="form-required">*</span>
74 </label>
75 <input
76 type="text"
77 id="tag_name"
78 name="tag_name"
79 class="form-input"
80 value={values?.tag_name ?? ""}
81 placeholder="v1.0.0"
82 />
83 </div>
84 <div class="form-group">
85 <label class="form-label" for="revision">
86 Revision{" "}
87 <span class="form-required">*</span>
88 </label>
89 <input
90 type="text"
91 id="revision"
92 name="revision"
93 class="form-input monospace"
94 value={defaultRevision}
95 placeholder="branch, tag, or commit"
96 />
97 <p class="form-hint">
98 Branch, tag, or commit to tag.
99 </p>
100 </div>
101 </div>
102 <div class="form-group">
103 <label class="form-label" for="notes">
104 Release notes
105 </label>
106 <textarea
107 id="notes"
108 name="notes"
109 class="form-input form-textarea"
110 rows="8"
111 >
112 {values?.notes ?? ""}
113 </textarea>
114 </div>
115 <div class="form-group">
116 <label class="checkbox-label">
117 <input
118 type="checkbox"
119 name="include_source_code"
120 value="on"
121 checked={
122 values?.include_source_code ?? false
123 }
124 />
125 <span>
126 Include source code archives (zip, tar.gz,
127 tar.zst)
128 </span>
129 </label>
130 </div>
131 <div class="form-group">
132 <label class="form-label" for="files">
133 Attach files
134 </label>
135 <input
136 type="file"
137 id="files"
138 name="files"
139 class="form-input"
140 multiple
141 />
142 <p class="form-hint">
143 You can attach multiple files to this release.
144 </p>
145 </div>
146 <div class="form-actions">
147 <button type="submit" class="btn btn-primary">
148 Create release
149 </button>
150 <a
151 href={`/${repo.name}/releases`}
152 class="btn btn-secondary"
153 >
154 Cancel
155 </a>
156 </div>
157 </form>
158 </div>
159 </div>
160 <script>{`
161 (function() {
162 var cb = document.getElementById('create_tag');
163 var group = document.getElementById('tag-fields-group');
164 cb.addEventListener('change', function() {
165 group.style.display = cb.checked ? '' : 'none';
166 });
167 })();
168 `}</script>
169 </Layout>
170 );
171}
172