tickets

9.3 KB

1. // components/ticket_list.hl — `/`, `/project/:projectName` (also `/:projectName`, ticket #25),
2. // `/state/:stateSlug` and both:
3. // the tickets, newest update first, filtered by project and state, and the form that
4. // opens a new ticket. Live: a ticket created or changed anywhere (web or API) lands in,
5. // moves within or leaves this list without a reload. Ticket #12: the summary is an <md-editor>
6. // around the textarea (shared/md-editor.js; the textarea keeps the Markdown).
7. // Ticket #20: a project's page (`/<slug>`, also `/project/<slug>`; `/projects/<slug>` answers 301) shows its title, description
8. // (Markdown), its tickets and — for an admin — the link to its settings page. The new-ticket form needs the
9. // role edit or admin: its project choice holds only the projects the user may open tickets in.
10. parent './main.hl'
11. import { ticketRows, createTicket } from '../lib/tickets.hl'
12. import { projectLinks, stateLinks, stateOfSlug } from '../lib/tickets-helpers.hl'
13. import { projectByAnySlug, editableProjects, isAdminOf } from '../lib/projects.hl'
14. import { markdownBlocks } from '../lib/markdown.hl'
15. import { siteName } from '../project.hl'
16. import { canWriteSession, writerOfSession, userOfSession } from '../lib/users.hl'
17. import { connectionRows, disconnect } from '../lib/connections.hl'
18. import Markdown from './markdown.hl'
20. projectName = null
21. stateSlug = null
22. filterState = stateOfSlug(stateSlug)
23. rows = ticketRows(projectName, filterState)
24. projects = projectLinks(projectName, filterState)
25. stateFilters = stateLinks(projectName, filterState)
26. session = null
27. project = projectName != null ? projectByAnySlug(projectName) : null
28. noSuchProject = projectName != null && project == null
29. projectId = project != null ? project.id : ''
30. hasDescription = project != null && project.description != null && project.description != ''
31. descriptionMd = hasDescription ? markdownBlocks(project.description) : []
32. isAdmin = project != null && isAdminOf(project.id, userOfSession(session))
33. // ticket #21: the apps connected to this project (connections.hl), shown to everybody; an admin can disconnect
34. connections = project != null ? connectionRows(project.id) : []
35. hasConnections = connections.length > 0
36. connectionMessage = ''
37. settingsHref = project != null ? '/projects/' + project.slug + '/settings' : ''
38. isEmpty = rows.length == 0
39. heading = (projectName != null ? (project != null ? project.title : projectName) : 'All projects') + (filterState != null ? ' · ' + filterState : '')
40. __title = siteName + ' | ' + heading
42. // the new-ticket form
43. myProjects = editableProjects(userOfSession(session))
44. newProject = projectName != null && project != null ? project.slug : (myProjects.length > 0 ? myProjects[0].slug : '')
45. newSubject = ''
46. newSummary = ''
47. // only for a member with the role edit or admin (ticket #20): the author is that user
48. canWrite = myProjects.length > 0
49. canCreateProject = canWriteSession(session)
50. mustLogIn = userOfSession(session) == null
51. noRole = userOfSession(session) != null && myProjects.length == 0
52. notice = ''
53. noticeHref = ''
54. hasNotice = false
56. View {
57. ticketBoard {
58. h1 { id = "heading" heading }
59. ticketFilters {
60. nav { id = "projectfilter"
61. for (f of projects) { a { href = f.href class = f.cls f.label } }
62. }
63. nav { id = "statefilter"
64. for (f of stateFilters) { a { href = f.href class = f.cls f.label } }
65. }
66. }
67. if (noSuchProject) { p { id = "noproject" class = "empty" "There is no such project." } }
68. if (hasDescription) { projectDescription { id = "description" Markdown { blocks = descriptionMd } } }
69. if (hasConnections) { ul { id = "connections" class = "connections"
70. for (c of connections) {
71. li { class = "connection"
72. "Connected to " strong { c.text }
73. if (isAdmin) { button { type = "button" class = "quiet danger disconnect" "Disconnect" on click(e) { emit dropConnection(c.id) } } }
74. }
75. }
76. } }
77. p { id = "connectionmessage" class = "message" connectionMessage }
78. projectActions {
79. if (canCreateProject) { a { id = "newprojectlink" class = "button" href = "/new-project" "New project" } }
80. if (isAdmin) { a { id = "settingslink" class = "button" href = settingsHref "Project settings" } }
81. }
82. if (mustLogIn) { p { id = "loginhint" class = "hint" "Reading is open to everyone. To open a ticket, log in with ident (top right)." } }
83. if (noRole) { p { id = "rolehint" class = "hint" "To open a ticket you need the role edit or admin in a project — ask an admin of the project to invite you." } }
84. if (canWrite) { details { id = "newticket"
85. summary { "New ticket" }
86. form { id = "newticketform"
87. on submit(e) {
88. e.preventDefault()
89. emit create(e)
90. }
91. label { "Project"
92. select { id = "newproject" name = "project" value = newProject on change(e) { emit setProject(e.target.value) }
93. for (p of myProjects) { option { value = p.slug p.title } }
94. }
95. }
96. label { "Subject"
97. input { id = "newsubject" name = "subject" required = "required" maxlength = "200" value = newSubject on input(e) { emit setSubject(e.target.value) } }
98. }
99. label { "Summary"
100. mdEditor { textarea { id = "newsummary" name = "summary" rows = "4" value = newSummary on input(e) { emit setSummary(e.target.value) } } }
101. }
102. button { id = "newsubmit" type = "submit" "Open ticket" }
103. }
104. } }
105. if (hasNotice) { p { id = "notice" class = "notice" notice " " a { id = "noticelink" href = noticeHref "open it" } } }
106. if (isEmpty) { p { id = "empty" class = "empty" "No tickets here." } }
107. ol { id = "tickets" class = "tickets"
108. for (row of rows) {
109. li {
110. ticketState { class = row.stateSlug row.state }
111. a { class = "subject" href = row.href ticketRef { row.ref } row.subject }
112. ticketMeta {
113. a { href = row.projectHref row.projectTitle }
114. if (row.hasAssignee) { assignee { row.assignee } }
115. time { row.updated }
116. }
117. }
118. }
119. }
120. }
121. }
123. on setProject(v) { newProject = v }
124. on setSubject(v) { newSubject = v }
125. on setSummary(v) { newSummary = v }
127. on create(e) {
128. if (newProject.trim() == '' || newSubject.trim() == '') { return null }
129. r = emit server openTicket(newProject, newSubject, newSummary)
130. if (r != null && r.error == null) {
131. notice = 'Opened ' + r.project + ' ' + r.ref + '.'
132. noticeHref = r.href
133. hasNotice = true
134. newSubject = ''
135. newSummary = ''
136. } else {
137. notice = r != null ? r.error : 'could not open the ticket'
138. noticeHref = ''
139. hasNotice = true
140. }
141. }
143. // does a row belong in THIS list (its filters)?
144. belongs = (row) => {
145. return (projectName == null || row.projectId == projectId) && (filterState == null || row.state == filterState)
146. }
148. // the row goes to the top (newest update first) if it belongs, and out if not
149. place = (row) => {
150. next = []
151. if (belongs(row)) { next.push(row) }
152. for (r of rows) { if (r.id != row.id) { next.push(r) } }
153. rows = next
154. isEmpty = next.length == 0
155. }
157. on client ticketCreated(row) { place(row) }
159. on dropConnection(id) {
160. r = emit server disconnectApp(projectId, id)
161. if (r == null || r.error != null) {
162. connectionMessage = r != null ? r.error : 'could not disconnect'
163. return null
164. }
165. connectionMessage = ''
166. connections = r.connections
167. hasConnections = r.connections.length > 0
168. }
169. on client connectionsChanged(slug) {
170. r = emit server connectionsOfProject(projectId)
171. if (r != null && r.connections != null) {
172. connections = r.connections
173. hasConnections = r.connections.length > 0
174. }
175. }
176. on client signedIn(tag, info) {
177. r = emit server whatICanOpen(projectName != null ? projectName : '')
178. if (r != null && r.projects != null) {
179. myProjects = r.projects
180. canWrite = r.projects.length > 0
181. noRole = r.projects.length == 0 && info.named
182. canCreateProject = info.named
183. mustLogIn = false
184. isAdmin = r.admin == true
185. if (newProject == '' && r.projects.length > 0) { newProject = r.projects[0].slug }
186. }
187. }
188. on client signedOut(tag) {
189. canWrite = false
190. canCreateProject = false
191. isAdmin = false
192. noRole = false
193. mustLogIn = true
194. myProjects = []
195. }
196. on client ticketEvent(ticketId, ev, row) { place(row) }
198. // THE FACE: a ticket opened from the web by the session's user (#31: only a real session).
199. // The same push the API sends.
200. on server openTicket(project, subject, summary, session) {
201. w = writerOfSession(session)
202. if (w.error != null) { return { error = w.error } }
203. r = createTicket(project, subject, summary, w.user, null, null)
204. if (r.error != null) { return { error = r.error } }
205. emit client ticketCreated(r.ticket)
206. return r.ticket
207. }
209. // what this session's user may do here after a login without a reload: the projects they may open tickets in,
210. // and whether they are an admin of THIS page's project (`slug` null = the all-projects page)
211. on server whatICanOpen(slug, session) {
212. u = userOfSession(session)
213. if (u == null) { return { error = 'log in first' } }
214. p = slug != null && slug != '' ? projectByAnySlug(slug) : null
215. return { projects = editableProjects(u) admin = p != null && isAdminOf(p.id, u) }
216. }
218. // ticket #21: an admin ends a connection — the key is dead at once (connections.hl)
219. on server disconnectApp(projectId, connectionId, session) {
220. w = writerOfSession(session)
221. if (w.error != null) { return { error = w.error } }
222. r = disconnect('' + projectId, w.user, '' + connectionId)
223. if (r.error != null) { return { error = r.error } }
224. emit client connectionsChanged('')
225. return { connections = r.connections }
226. }
228. on server connectionsOfProject(projectId, session) {
229. return { connections = connectionRows('' + projectId) }
230. }