|  | 
| 1 | 1 | <div role="main" aria-label="{{.Title}}" class="page-content user notification" id="notification_div" data-sequence-number="{{.SequenceNumber}}"> | 
| 2 | 2 | 	<div class="ui container"> | 
|  | 3 | +		{{$statusUnread := 1}}{{$statusRead := 2}}{{$statusPinned := 3}} | 
| 3 | 4 | 		{{$notificationUnreadCount := call .PageGlobalData.GetNotificationUnreadCount}} | 
| 4 |  | -		<div class="tw-flex tw-items-center tw-justify-between tw-mb-[--page-spacing]"> | 
|  | 5 | +		{{$pageTypeIsRead := eq $.PageType "read"}} | 
|  | 6 | +		<div class="flex-text-block tw-justify-between tw-mb-[--page-spacing]"> | 
| 5 | 7 | 			<div class="small-menu-items ui compact tiny menu"> | 
| 6 |  | -				<a class="{{if eq .Status 1}}active {{end}}item" href="{{AppSubUrl}}/notifications?q=unread"> | 
|  | 8 | +				<a class="{{if not $pageTypeIsRead}}active{{end}} item" href="{{AppSubUrl}}/notifications?type=unread"> | 
| 7 | 9 | 					{{ctx.Locale.Tr "notification.unread"}} | 
| 8 | 10 | 					<div class="notifications-unread-count ui label {{if not $notificationUnreadCount}}tw-hidden{{end}}">{{$notificationUnreadCount}}</div> | 
| 9 | 11 | 				</a> | 
| 10 |  | -				<a class="{{if eq .Status 2}}active {{end}}item" href="{{AppSubUrl}}/notifications?q=read"> | 
|  | 12 | +				<a class="{{if $pageTypeIsRead}}active{{end}} item" href="{{AppSubUrl}}/notifications?type=read"> | 
| 11 | 13 | 					{{ctx.Locale.Tr "notification.read"}} | 
| 12 | 14 | 				</a> | 
| 13 | 15 | 			</div> | 
| 14 |  | -			{{if and (eq .Status 1)}} | 
|  | 16 | +			{{if and (not $pageTypeIsRead) $notificationUnreadCount}} | 
| 15 | 17 | 				<form action="{{AppSubUrl}}/notifications/purge" method="post"> | 
| 16 | 18 | 					{{$.CsrfTokenHtml}} | 
| 17 |  | -					<div class="{{if not $notificationUnreadCount}}tw-hidden{{end}}"> | 
| 18 |  | -						<button class="ui mini button primary tw-mr-0" title="{{ctx.Locale.Tr "notification.mark_all_as_read"}}"> | 
| 19 |  | -							{{svg "octicon-checklist"}} | 
| 20 |  | -						</button> | 
| 21 |  | -					</div> | 
|  | 19 | +					<button class="ui mini button primary tw-mr-0" title="{{ctx.Locale.Tr "notification.mark_all_as_read"}}"> | 
|  | 20 | +						{{svg "octicon-checklist"}} | 
|  | 21 | +					</button> | 
| 22 | 22 | 				</form> | 
| 23 | 23 | 			{{end}} | 
| 24 | 24 | 		</div> | 
| 25 |  | -		<div class="tw-p-0"> | 
| 26 |  | -			<div id="notification_table"> | 
| 27 |  | -				{{if not .Notifications}} | 
| 28 |  | -					<div class="tw-flex tw-items-center tw-flex-col tw-p-4"> | 
| 29 |  | -						{{svg "octicon-inbox" 56 "tw-mb-4"}} | 
| 30 |  | -						{{if eq .Status 1}} | 
| 31 |  | -							{{ctx.Locale.Tr "notification.no_unread"}} | 
|  | 25 | +		<div id="notification_table"> | 
|  | 26 | +			{{range $one := .Notifications}} | 
|  | 27 | +				<div class="notifications-item" id="notification_{{$one.ID}}" data-status="{{$one.Status}}"> | 
|  | 28 | +					<div class="tw-self-start tw-mt-[2px]"> | 
|  | 29 | +						{{if $one.Issue}} | 
|  | 30 | +							{{template "shared/issueicon" $one.Issue}} | 
| 32 | 31 | 						{{else}} | 
| 33 |  | -							{{ctx.Locale.Tr "notification.no_read"}} | 
|  | 32 | +							{{svg "octicon-repo" 16 "text grey"}} | 
| 34 | 33 | 						{{end}} | 
| 35 | 34 | 					</div> | 
| 36 |  | -				{{else}} | 
| 37 |  | -					{{range $notification := .Notifications}} | 
| 38 |  | -						<div class="notifications-item tw-flex tw-items-center tw-flex-wrap tw-gap-2 tw-p-2" id="notification_{{.ID}}" data-status="{{.Status}}"> | 
| 39 |  | -							<div class="notifications-icon tw-ml-2 tw-mr-1 tw-self-start tw-mt-1"> | 
| 40 |  | -								{{if .Issue}} | 
| 41 |  | -									{{template "shared/issueicon" .Issue}} | 
| 42 |  | -								{{else}} | 
| 43 |  | -									{{svg "octicon-repo" 16 "text grey"}} | 
| 44 |  | -								{{end}} | 
| 45 |  | -							</div> | 
| 46 |  | -							<a class="notifications-link tw-flex tw-flex-1 tw-flex-col silenced" href="{{.Link ctx}}"> | 
| 47 |  | -								<div class="notifications-top-row tw-text-13 tw-break-anywhere"> | 
| 48 |  | -									{{.Repository.FullName}} {{if .Issue}}<span class="text light-3">#{{.Issue.Index}}</span>{{end}} | 
| 49 |  | -									{{if eq .Status 3}} | 
| 50 |  | -										{{svg "octicon-pin" 13 "text blue tw-mt-0.5 tw-ml-1"}} | 
| 51 |  | -									{{end}} | 
| 52 |  | -								</div> | 
| 53 |  | -								<div class="notifications-bottom-row tw-text-16 tw-py-0.5"> | 
| 54 |  | -									<span class="issue-title tw-break-anywhere"> | 
| 55 |  | -										{{if .Issue}} | 
| 56 |  | -											{{.Issue.Title | ctx.RenderUtils.RenderIssueSimpleTitle}} | 
| 57 |  | -										{{else}} | 
| 58 |  | -											{{.Repository.FullName}} | 
| 59 |  | -										{{end}} | 
| 60 |  | -									</span> | 
| 61 |  | -								</div> | 
| 62 |  | -							</a> | 
| 63 |  | -							<div class="notifications-updated tw-items-center tw-mr-2"> | 
| 64 |  | -								{{if .Issue}} | 
| 65 |  | -									{{DateUtils.TimeSince .Issue.UpdatedUnix}} | 
| 66 |  | -								{{else}} | 
| 67 |  | -									{{DateUtils.TimeSince .UpdatedUnix}} | 
| 68 |  | -								{{end}} | 
| 69 |  | -							</div> | 
| 70 |  | -							<div class="notifications-buttons tw-items-center tw-justify-end tw-gap-1 tw-px-1"> | 
| 71 |  | -								{{if ne .Status 3}} | 
| 72 |  | -									<form action="{{AppSubUrl}}/notifications/status" method="post"> | 
| 73 |  | -										{{$.CsrfTokenHtml}} | 
| 74 |  | -										<input type="hidden" name="notification_id" value="{{.ID}}"> | 
| 75 |  | -										<input type="hidden" name="status" value="pinned"> | 
| 76 |  | -										<button class="btn interact-bg tw-p-2" title="{{ctx.Locale.Tr "notification.pin"}}" | 
| 77 |  | -											data-url="{{AppSubUrl}}/notifications/status" | 
| 78 |  | -											data-status="pinned" | 
| 79 |  | -											data-page="{{$.Page.Paginater.Current}}" | 
| 80 |  | -											data-notification-id="{{.ID}}" | 
| 81 |  | -											data-q="{{$.Keyword}}"> | 
| 82 |  | -											{{svg "octicon-pin"}} | 
| 83 |  | -										</button> | 
| 84 |  | -									</form> | 
| 85 |  | -								{{end}} | 
| 86 |  | -								{{if or (eq .Status 1) (eq .Status 3)}} | 
| 87 |  | -									<form action="{{AppSubUrl}}/notifications/status" method="post"> | 
| 88 |  | -										{{$.CsrfTokenHtml}} | 
| 89 |  | -										<input type="hidden" name="notification_id" value="{{.ID}}"> | 
| 90 |  | -										<input type="hidden" name="status" value="read"> | 
| 91 |  | -										<input type="hidden" name="page" value="{{$.Page.Paginater.Current}}"> | 
| 92 |  | -										<button class="btn interact-bg tw-p-2" title="{{ctx.Locale.Tr "notification.mark_as_read"}}" | 
| 93 |  | -											data-url="{{AppSubUrl}}/notifications/status" | 
| 94 |  | -											data-status="read" | 
| 95 |  | -											data-page="{{$.Page.Paginater.Current}}" | 
| 96 |  | -											data-notification-id="{{.ID}}" | 
| 97 |  | -											data-q="{{$.Keyword}}"> | 
| 98 |  | -											{{svg "octicon-check"}} | 
| 99 |  | -										</button> | 
| 100 |  | -									</form> | 
| 101 |  | -								{{else if eq .Status 2}} | 
| 102 |  | -									<form action="{{AppSubUrl}}/notifications/status" method="post"> | 
| 103 |  | -										{{$.CsrfTokenHtml}} | 
| 104 |  | -										<input type="hidden" name="notification_id" value="{{.ID}}"> | 
| 105 |  | -										<input type="hidden" name="status" value="unread"> | 
| 106 |  | -										<input type="hidden" name="page" value="{{$.Page.Paginater.Current}}"> | 
| 107 |  | -										<button class="btn interact-bg tw-p-2" title="{{ctx.Locale.Tr "notification.mark_as_unread"}}" | 
| 108 |  | -											data-url="{{AppSubUrl}}/notifications/status" | 
| 109 |  | -											data-status="unread" | 
| 110 |  | -											data-page="{{$.Page.Paginater.Current}}" | 
| 111 |  | -											data-notification-id="{{.ID}}" | 
| 112 |  | -											data-q="{{$.Keyword}}"> | 
| 113 |  | -											{{svg "octicon-bell"}} | 
| 114 |  | -										</button> | 
| 115 |  | -									</form> | 
| 116 |  | -								{{end}} | 
| 117 |  | -							</div> | 
|  | 35 | +					<a class="notifications-link silenced tw-flex-1" href="{{$one.Link ctx}}"> | 
|  | 36 | +						<div class="flex-text-block tw-text-[0.95em]"> | 
|  | 37 | +							{{$one.Repository.FullName}} {{if $one.Issue}}<span class="text light-3">#{{$one.Issue.Index}}</span>{{end}} | 
|  | 38 | +							{{if eq $one.Status $statusPinned}} | 
|  | 39 | +								{{svg "octicon-pin" 13 "text blue"}} | 
|  | 40 | +							{{end}} | 
|  | 41 | +						</div> | 
|  | 42 | +						<div class="tw-text-16 tw-py-0.5"> | 
|  | 43 | +							{{if $one.Issue}} | 
|  | 44 | +								{{$one.Issue.Title | ctx.RenderUtils.RenderIssueSimpleTitle}} | 
|  | 45 | +							{{else}} | 
|  | 46 | +								{{$one.Repository.FullName}} | 
|  | 47 | +							{{end}} | 
| 118 | 48 | 						</div> | 
|  | 49 | +					</a> | 
|  | 50 | +					<div class="notifications-updated flex-text-inline"> | 
|  | 51 | +						{{if $one.Issue}} | 
|  | 52 | +							{{DateUtils.TimeSince $one.Issue.UpdatedUnix}} | 
|  | 53 | +						{{else}} | 
|  | 54 | +							{{DateUtils.TimeSince $one.UpdatedUnix}} | 
|  | 55 | +						{{end}} | 
|  | 56 | +					</div> | 
|  | 57 | +					<form class="notifications-buttons" action="{{AppSubUrl}}/notifications/status?type={{$.PageType}}&page={{$.Page.Paginater.Current}}&perPage={{$.Page.Paginater.PagingNum}}" method="post" | 
|  | 58 | +								hx-boost="true" hx-target="#notification_div" hx-swap="outerHTML" | 
|  | 59 | +					> | 
|  | 60 | +						{{$.CsrfTokenHtml}} | 
|  | 61 | +						<input type="hidden" name="notification_id" value="{{$one.ID}}"> | 
|  | 62 | +						{{if ne $one.Status $statusPinned}} | 
|  | 63 | +							<button class="btn interact-bg tw-p-2" data-tooltip-content="{{ctx.Locale.Tr "notification.pin"}}" | 
|  | 64 | +											name="notification_action" value="pin" | 
|  | 65 | +							> | 
|  | 66 | +								{{svg "octicon-pin"}} | 
|  | 67 | +							</button> | 
|  | 68 | +						{{end}} | 
|  | 69 | +						{{if or (eq $one.Status $statusUnread) (eq $one.Status $statusPinned)}} | 
|  | 70 | +							<button class="btn interact-bg tw-p-2" data-tooltip-content="{{ctx.Locale.Tr "notification.mark_as_read"}}" | 
|  | 71 | +											name="notification_action" value="mark_as_read" | 
|  | 72 | +							> | 
|  | 73 | +								{{svg "octicon-check"}} | 
|  | 74 | +							</button> | 
|  | 75 | +						{{else if eq $one.Status $statusRead}} | 
|  | 76 | +							<button class="btn interact-bg tw-p-2" data-tooltip-content="{{ctx.Locale.Tr "notification.mark_as_unread"}}" | 
|  | 77 | +											name="notification_action" value="mark_as_unread" | 
|  | 78 | +							> | 
|  | 79 | +								{{svg "octicon-bell"}} | 
|  | 80 | +							</button> | 
|  | 81 | +						{{end}} | 
|  | 82 | +					</form> | 
|  | 83 | +				</div> | 
|  | 84 | +			{{else}} | 
|  | 85 | +				<div class="empty-placeholder"> | 
|  | 86 | +					{{svg "octicon-inbox" 56 "tw-mb-4"}} | 
|  | 87 | +					{{if $pageTypeIsRead}} | 
|  | 88 | +						{{ctx.Locale.Tr "notification.no_read"}} | 
|  | 89 | +					{{else}} | 
|  | 90 | +						{{ctx.Locale.Tr "notification.no_unread"}} | 
| 119 | 91 | 					{{end}} | 
| 120 |  | -				{{end}} | 
| 121 |  | -			</div> | 
|  | 92 | +				</div> | 
|  | 93 | +			{{end}} | 
| 122 | 94 | 		</div> | 
| 123 | 95 | 		{{template "base/paginate" .}} | 
| 124 | 96 | 	</div> | 
|  | 
0 commit comments