Monorepo for Tangled
appview/notifications: add link element to each notification
oppiliappan
(Sep 30, 2025, 4:46 PM +0100)
5c9bf597
054a6a04
+27
-208
+27
-208
appview/pages/templates/notifications/fragments/item.html
+27
-208
appview/pages/templates/notifications/fragments/item.html
···
1
1
{{define "notifications/fragments/item"}}
2
-
<div
3
-
class="
4
-
w-full mx-auto rounded drop-shadow-sm dark:text-white bg-white dark:bg-gray-800 px-2 md:px-6 py-4 transition-colors
5
-
{{if not .Read}}bg-blue-50 dark:bg-blue-900/20 border border-blue-500 dark:border-sky-800{{end}}
6
-
flex gap-2 items-center
7
-
"
8
-
>
2
+
<a href="{{ template "notificationUrl" . }}" class="block no-underline hover:no-underline">
3
+
<div
4
+
class="
5
+
w-full mx-auto rounded drop-shadow-sm dark:text-white bg-white dark:bg-gray-800 px-2 md:px-6 py-4 transition-colors
6
+
{{if not .Read}}bg-blue-50 dark:bg-blue-800/20 border border-blue-500 dark:border-sky-800{{end}}
7
+
flex gap-2 items-center
8
+
">
9
+
{{ template "notificationIcon" . }}
10
+
<div class="flex-1 w-full flex flex-col gap-1">
11
+
<span>{{ template "notificationHeader" . }}</span>
12
+
<span class="text-sm text-gray-500 dark:text-gray-400">{{ template "notificationSummary" . }}</span>
13
+
</div>
9
14
10
-
{{ template "notificationIcon" . }}
11
-
<div class="flex-1 w-full flex flex-col gap-1">
12
-
<span>{{ template "notificationHeader" . }}</span>
13
-
<span class="text-sm text-gray-500 dark:text-gray-400">{{ template "notificationSummary" . }}</span>
14
15
</div>
15
-
16
-
</div>
16
+
</a>
17
17
{{end}}
18
18
19
19
{{ define "notificationIcon" }}
···
64
64
{{ end }}
65
65
{{ end }}
66
66
67
-
{{define "issueNotification"}}
68
-
{{$url := printf "/%s/%s/issues/%d" (resolve .Repo.Did) .Repo.Name .Issue.IssueId}}
69
-
<a
70
-
href="{{$url}}"
71
-
class="block no-underline hover:no-underline text-inherit -m-3 p-3"
72
-
>
73
-
<div class="flex items-center justify-between">
74
-
<div class="min-w-0 flex-1">
75
-
<!-- First line: icon + actor action -->
76
-
<div class="flex items-center gap-2 text-gray-900 dark:text-white">
77
-
{{if eq .Type "issue_created"}}
78
-
<span class="text-green-600 dark:text-green-500">
79
-
{{ i "circle-dot" "w-4 h-4" }}
80
-
</span>
81
-
{{else if eq .Type "issue_commented"}}
82
-
<span class="text-gray-500 dark:text-gray-400">
83
-
{{ i "message-circle" "w-4 h-4" }}
84
-
</span>
85
-
{{else if eq .Type "issue_closed"}}
86
-
<span class="text-gray-500 dark:text-gray-400">
87
-
{{ i "ban" "w-4 h-4" }}
88
-
</span>
89
-
{{end}}
90
-
{{template "user/fragments/picHandle" .ActorDid}}
91
-
{{if eq .Type "issue_created"}}
92
-
<span class="text-gray-500 dark:text-gray-400">opened issue</span>
93
-
{{else if eq .Type "issue_commented"}}
94
-
<span class="text-gray-500 dark:text-gray-400">commented on issue</span>
95
-
{{else if eq .Type "issue_closed"}}
96
-
<span class="text-gray-500 dark:text-gray-400">closed issue</span>
97
-
{{end}}
98
-
{{if not .Read}}
99
-
<div class="w-2 h-2 bg-blue-500 rounded-full flex-shrink-0 ml-1"></div>
100
-
{{end}}
101
-
</div>
102
-
103
-
<div class="text-sm text-gray-600 dark:text-gray-400 mt-0.5 ml-6 flex items-center gap-1">
104
-
<span class="text-gray-500 dark:text-gray-400">#{{.Issue.IssueId}}</span>
105
-
<span class="text-gray-900 dark:text-white truncate">{{.Issue.Title}}</span>
106
-
<span>on</span>
107
-
<span class="font-medium text-gray-900 dark:text-white">{{resolve .Repo.Did}}/{{.Repo.Name}}</span>
108
-
</div>
109
-
</div>
67
+
{{ define "notificationUrl" }}
68
+
{{ $url := "" }}
69
+
{{ if eq .Type "repo_starred" }}
70
+
{{$url = printf "/%s/%s" (resolve .Repo.Did) .Repo.Name}}
71
+
{{ else if .Issue }}
72
+
{{$url = printf "/%s/%s/issues/%d" (resolve .Repo.Did) .Repo.Name .Issue.IssueId}}
73
+
{{ else if .Pull }}
74
+
{{$url = printf "/%s/%s/pulls/%d" (resolve .Repo.Did) .Repo.Name .Pull.PullId}}
75
+
{{ else if eq .Type "followed" }}
76
+
{{$url = printf "/%s" (resolve .ActorDid)}}
77
+
{{ else }}
78
+
{{ end }}
110
79
111
-
<div class="text-xs text-gray-500 dark:text-gray-400 flex-shrink-0 ml-2">
112
-
{{ template "repo/fragments/time" .Created }}
113
-
</div>
114
-
</div>
115
-
</a>
116
-
{{end}}
117
-
118
-
{{define "pullNotification"}}
119
-
{{$url := printf "/%s/%s/pulls/%d" (resolve .Repo.Did) .Repo.Name .Pull.PullId}}
120
-
<a
121
-
href="{{$url}}"
122
-
class="block no-underline hover:no-underline text-inherit -m-3 p-3"
123
-
>
124
-
<div class="flex items-center justify-between">
125
-
<div class="min-w-0 flex-1">
126
-
<div class="flex items-center gap-2 text-gray-900 dark:text-white">
127
-
{{if eq .Type "pull_created"}}
128
-
<span class="text-green-600 dark:text-green-500">
129
-
{{ i "git-pull-request-create" "w-4 h-4" }}
130
-
</span>
131
-
{{else if eq .Type "pull_commented"}}
132
-
<span class="text-gray-500 dark:text-gray-400">
133
-
{{ i "message-circle" "w-4 h-4" }}
134
-
</span>
135
-
{{else if eq .Type "pull_merged"}}
136
-
<span class="text-purple-600 dark:text-purple-500">
137
-
{{ i "git-merge" "w-4 h-4" }}
138
-
</span>
139
-
{{else if eq .Type "pull_closed"}}
140
-
<span class="text-red-600 dark:text-red-500">
141
-
{{ i "git-pull-request-closed" "w-4 h-4" }}
142
-
</span>
143
-
{{end}}
144
-
{{template "user/fragments/picHandle" (resolve .ActorDid)}}
145
-
{{if eq .Type "pull_created"}}
146
-
<span class="text-gray-500 dark:text-gray-400">opened pull request</span>
147
-
{{else if eq .Type "pull_commented"}}
148
-
<span class="text-gray-500 dark:text-gray-400">commented on pull request</span>
149
-
{{else if eq .Type "pull_merged"}}
150
-
<span class="text-gray-500 dark:text-gray-400">merged pull request</span>
151
-
{{else if eq .Type "pull_closed"}}
152
-
<span class="text-gray-500 dark:text-gray-400">closed pull request</span>
153
-
{{end}}
154
-
{{if not .Read}}
155
-
<div class="w-2 h-2 bg-blue-500 rounded-full flex-shrink-0 ml-1"></div>
156
-
{{end}}
157
-
</div>
158
-
159
-
<div class="text-sm text-gray-600 dark:text-gray-400 mt-0.5 ml-6 flex items-center gap-1">
160
-
<span class="text-gray-500 dark:text-gray-400">#{{.Pull.PullId}}</span>
161
-
<span class="text-gray-900 dark:text-white truncate">{{.Pull.Title}}</span>
162
-
<span>on</span>
163
-
<span class="font-medium text-gray-900 dark:text-white">{{resolve .Repo.Did}}/{{.Repo.Name}}</span>
164
-
</div>
165
-
</div>
166
-
167
-
<div class="text-xs text-gray-500 dark:text-gray-400 flex-shrink-0 ml-2">
168
-
{{ template "repo/fragments/time" .Created }}
169
-
</div>
170
-
</div>
171
-
</a>
172
-
{{end}}
173
-
174
-
{{define "repoNotification"}}
175
-
{{$url := printf "/%s/%s" (resolve .Repo.Did) .Repo.Name}}
176
-
<a
177
-
href="{{$url}}"
178
-
class="block no-underline hover:no-underline text-inherit -m-3 p-3"
179
-
>
180
-
<div class="flex items-center justify-between">
181
-
<div class="flex items-center gap-2 min-w-0 flex-1">
182
-
<span class="text-yellow-500 dark:text-yellow-400">
183
-
{{ i "star" "w-4 h-4" }}
184
-
</span>
185
-
186
-
<div class="min-w-0 flex-1">
187
-
<!-- Single line for stars: actor action subject -->
188
-
<div class="flex items-center gap-1 text-gray-900 dark:text-white">
189
-
{{template "user/fragments/picHandle" (resolve .ActorDid)}}
190
-
<span class="text-gray-500 dark:text-gray-400">starred</span>
191
-
<span class="font-medium">{{resolve .Repo.Did}}/{{.Repo.Name}}</span>
192
-
{{if not .Read}}
193
-
<div class="w-2 h-2 bg-blue-500 rounded-full flex-shrink-0 ml-1"></div>
194
-
{{end}}
195
-
</div>
196
-
</div>
197
-
</div>
198
-
199
-
<div class="text-xs text-gray-500 dark:text-gray-400 flex-shrink-0 ml-2">
200
-
{{ template "repo/fragments/time" .Created }}
201
-
</div>
202
-
</div>
203
-
</a>
204
-
{{end}}
205
-
206
-
{{define "followNotification"}}
207
-
{{$url := printf "/%s" (resolve .ActorDid)}}
208
-
<a
209
-
href="{{$url}}"
210
-
class="block no-underline hover:no-underline text-inherit -m-3 p-3"
211
-
>
212
-
<div class="flex items-center justify-between">
213
-
<div class="flex items-center gap-2 min-w-0 flex-1">
214
-
<span class="text-blue-600 dark:text-blue-400">
215
-
{{ i "user-plus" "w-4 h-4" }}
216
-
</span>
217
-
218
-
<div class="min-w-0 flex-1">
219
-
<div class="flex items-center gap-1 text-gray-900 dark:text-white">
220
-
{{template "user/fragments/picHandle" (resolve .ActorDid)}}
221
-
<span class="text-gray-500 dark:text-gray-400">followed you</span>
222
-
{{if not .Read}}
223
-
<div class="w-2 h-2 bg-blue-500 rounded-full flex-shrink-0 ml-1"></div>
224
-
{{end}}
225
-
</div>
226
-
</div>
227
-
</div>
228
-
229
-
<div class="text-xs text-gray-500 dark:text-gray-400 flex-shrink-0 ml-2">
230
-
{{ template "repo/fragments/time" .Created }}
231
-
</div>
232
-
</div>
233
-
</a>
234
-
{{end}}
235
-
236
-
{{define "genericNotification"}}
237
-
<a
238
-
href="#"
239
-
class="block no-underline hover:no-underline text-inherit -m-3 p-3"
240
-
>
241
-
<div class="flex items-center justify-between">
242
-
<div class="flex items-center gap-2 min-w-0 flex-1">
243
-
<span class="{{if not .Read}}text-blue-600 dark:text-blue-400{{else}}text-gray-500 dark:text-gray-400{{end}}">
244
-
{{ i "bell" "w-4 h-4" }}
245
-
</span>
246
-
247
-
<div class="min-w-0 flex-1">
248
-
<div class="flex items-center gap-1 text-gray-900 dark:text-white">
249
-
<span>New notification</span>
250
-
{{if not .Read}}
251
-
<div class="w-2 h-2 bg-blue-500 rounded-full flex-shrink-0 ml-1"></div>
252
-
{{end}}
253
-
</div>
254
-
</div>
255
-
</div>
256
-
257
-
<div class="text-xs text-gray-500 dark:text-gray-400 flex-shrink-0 ml-2">
258
-
{{ template "repo/fragments/time" .Created }}
259
-
</div>
260
-
</div>
261
-
</a>
262
-
{{end}}
80
+
{{ $url }}
81
+
{{ end }}