ident

4.1 KB

1. // components/inbox.hl — `/inbox`: THE NOTIFICATIONS INBOX (piece 4 of 6, ticket ident#6;
2. // CONCEPT.md "Notifications": "The user reads them in ident's notifications inbox").
3. // Every notification of every identity of the signed-in account, newest first: identity,
4. // app, name, text, icon, action link, time; read / unread (a button per notification).
5. // Below: the apps the account's identities are registered in — each links to its per-app
6. // page (`/inbox/<connection id>`, components/appsettings.hl).
7. //
8. // Faces are named `inbox…` (a face is found by its EVENT NAME across all files).
9. parent './main.hl'
10. import { accountOfSession } from '../lib/accounts.hl'
11. import { inboxRows, markRead, connectionRows } from '../lib/notify.hl'
12. import { unreadCount } from '../lib/notify-helpers.hl'
13. import { siteName } from '../project.hl'
15. session = null
16. me = accountOfSession(session)
17. signedIn = me != null
18. signedOut = me == null
19. meEmail = me != null ? me.email : ''
20. items = me != null ? inboxRows(me.id) : []
21. hasItems = items.length > 0
22. noItems = items.length == 0
23. unread = unreadCount(items)
24. unreadText = unread == 1 ? '1 unread' : unread + ' unread'
25. conns = me != null ? connectionRows(me.id) : []
26. hasConns = conns.length > 0
27. noConns = conns.length == 0
28. __title = siteName + ' | inbox'
30. message = ''
32. View {
33. identCard { class = "wide"
34. if (signedOut) {
35. h1 { "Inbox" }
36. p { id = "signinfirst" class = "lead" "Sign in to ident first: " a { href = "/" "sign in" } "." }
37. }
38. if (signedIn) {
39. accountBar {
40. userEmail { id = "meemail" meEmail }
41. unreadTotal { id = "unreadcount" unreadText }
42. }
43. section { id = "inboxsection"
44. h1 { "Inbox" }
45. if (noItems) { p { id = "noitems" class = "lead" "No notifications yet. Apps you signed in to with ident can send you some; they show up here." } }
46. ul { id = "inbox"
47. for (n of items) {
48. li { class = n.state
49. if (n.hasIcon) { img { class = "icon" src = n.icon alt = "" width = "40" height = "40" loading = "lazy" referrerpolicy = "no-referrer" } }
50. noteMain {
51. noteHead {
52. noteName { n.name }
53. if (n.urgent) { urgentBadge { "urgent" } }
54. if (n.unread) { unreadBadge { "new" } }
55. }
56. noteFrom { n.app " · " n.identity }
57. noteText { n.text }
58. noteFoot {
59. time { n.time }
60. if (n.hasLink) { a { class = "action" href = n.link target = "_blank" rel = "noopener noreferrer" "Open" } }
61. button { type = "button" class = "quiet small toggle" value = n.id n.toggleText on click(e) { emit toggle(e.target.value) } }
62. }
63. }
64. }
65. }
66. }
67. }
68. section { id = "connsection"
69. h2 { "Notification settings per app" }
70. if (noConns) { p { id = "noconns" class = "lead" "None of your identities is registered in an app yet." } }
71. ul { id = "conns"
72. for (c of conns) {
73. li {
74. a { class = "conn" href = c.href c.app }
75. connDetails { c.identity " · since " c.since }
76. }
77. }
78. }
79. }
80. }
81. p { id = "message" class = "message" message }
82. }
83. }
85. rowOf = (id) => {
86. for (n of items) { if ('' + n.id == '' + id) { return n } }
87. return null
88. }
90. setItems = (list) => {
91. items = list
92. hasItems = list.length > 0
93. noItems = list.length == 0
94. let u = 0
95. for (n of list) { if (n.unread) { u = u + 1 } }
96. unread = u
97. unreadText = u == 1 ? '1 unread' : u + ' unread'
98. return null
99. }
101. on toggle(id) {
102. message = ''
103. row = rowOf(id)
104. if (row == null) { return null }
105. r = emit server inboxMark('' + id, !row.read)
106. if (r == null) {
107. message = 'the server did not answer — try again'
108. return null
109. }
110. if (r.error != null) {
111. message = r.error
112. return null
113. }
114. setItems(r.items)
115. }
117. // ---- the faces ------------------------------------------------------------------------
118. // The LAST parameter is the session; accountOfSession only accepts the framework's own
119. // Session (hl:web never takes it from the peer, hybriel#16/#31).
120. on server inboxMark(id, read, session) {
121. let me = accountOfSession(session)
122. if (me == null) { return { error = 'you are not signed in' } }
123. r = markRead(me.id, id, read)
124. if (r.error != null) { return r }
125. return { items = inboxRows(me.id) }
126. }