Yōten: A social tracker for your language learning journey built on the atproto.
1package partials
2
3import "fmt"
4
5templ NotificationFeed(params NotificationFeedProps) {
6 <div x-init="lucide.createIcons()">
7 <div id="notification-feed" class="flex flex-col gap-6">
8 for _, notification := range params.Feed {
9 @Notification(NotificationProps{
10 Notification: notification,
11 })
12 }
13 if params.NextPage > 0 {
14 <button
15 type="button"
16 id="next-notification-segment"
17 hx-get={ templ.SafeURL(fmt.Sprintf("/notification/feed?page=%d", params.NextPage)) }
18 hx-swap="outerHTML"
19 hx-disabled-elt="this"
20 class="btn btn-primary w-fit group self-center"
21 >
22 Load more
23 <i class="w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" data-lucide="loader-circle"></i>
24 </button>
25 }
26 </div>
27 if len(params.Feed) == 0 {
28 <div class="flex flex-col gap-6">
29 <div class="text-center py-12">
30 <p class="text-text text-lg">All caught up!</p>
31 <p class="text-text-muted">You have no new notifications.</p>
32 </div>
33 </div>
34 }
35 </div>
36}