feat: add emoji reaction support for files
All checks were successful
Build and Publish Docker Image / deploy (push) Successful in 1m46s

- Implement `ReactionService` to manage file reactions in the database.
- Add `POST /d/{boxID}/f/{fileID}/react` endpoint to handle user reactions.
- Add `GET /emoji/{pack}/{file}` endpoint to serve custom emoji assets.
- Support loading custom emoji packs dynamically from the data directory.
- Update README with instructions on configuring emoji reaction packs.
This commit is contained in:
2026-06-02 11:30:33 +03:00
parent 1ab5021667
commit f628b489af
13 changed files with 976 additions and 5 deletions

View File

@@ -44,7 +44,7 @@
<div class="download-list file-browser is-list" data-file-browser>
{{range .Data.Files}}
<article class="download-item file-card" data-kind="{{.PreviewKind}}" data-file-context data-preview-url="{{.URL}}" data-view-url="{{.DownloadURL}}?inline=1" data-download-url="{{.DownloadURL}}" data-file-name="{{.Name}}">
<article class="download-item file-card" data-kind="{{.PreviewKind}}" data-file-context data-preview-url="{{.URL}}" data-view-url="{{.DownloadURL}}?inline=1" data-download-url="{{.DownloadURL}}" data-file-name="{{.Name}}" data-reaction-card>
<a class="thumb-link" href="{{.DownloadURL}}?inline=1" aria-label="View {{.Name}}">
<img src="{{.ThumbnailURL}}" alt="" loading="lazy">
</a>
@@ -64,11 +64,54 @@
Download
</a>
</div>
<div class="file-reaction-dock" data-reaction-dock>
<div class="file-reactions" data-reaction-list>
{{range .Reactions}}
<span class="reaction-pill" title="{{.Label}}">
<img src="{{.URL}}" alt="{{.Label}}" loading="lazy">
<span>{{.Count}}</span>
</span>
{{end}}
</div>
{{if not .Reacted}}
<button class="reaction-button" type="button" data-reaction-button data-react-url="{{.ReactURL}}" aria-label="React to {{.Name}}" title="React">
<svg viewBox="0 0 24 24" role="img" focusable="false" aria-hidden="true"><path d="M12 21a9 9 0 1 0-9-9 9 9 0 0 0 9 9Z" /><path d="M8 14s1.4 2 4 2 4-2 4-2" /><path d="M9 9h.01M15 9h.01" /></svg>
</button>
{{end}}
</div>
{{end}}
</article>
{{end}}
</div>
{{if not .Data.Locked}}
<div class="reaction-picker" data-reaction-picker hidden>
<div class="reaction-picker-panel" role="dialog" aria-modal="false" aria-label="Choose a reaction">
<div class="reaction-picker-head">
<strong>React</strong>
<button class="button button-ghost reaction-picker-close" type="button" data-reaction-close aria-label="Close reaction picker">Close</button>
</div>
<div class="reaction-picker-tabs" role="tablist" aria-label="Emoji themes">
{{range $index, $tab := .Data.EmojiTabs}}
<button type="button" class="reaction-tab {{if eq $index 0}}is-active{{end}}" data-reaction-tab="{{$tab.ID}}" role="tab" aria-selected="{{if eq $index 0}}true{{else}}false{{end}}">{{$tab.Label}}</button>
{{end}}
</div>
<label class="reaction-search">
<span class="sr-only">Search emoji</span>
<input type="search" data-reaction-search placeholder="Search emoji">
</label>
<div class="reaction-grid-wrap">
{{range $index, $tab := .Data.EmojiTabs}}
<div class="reaction-grid {{if eq $index 0}}is-active{{end}}" data-reaction-panel="{{$tab.ID}}" role="tabpanel">
{{range $tab.Emojis}}
<button class="reaction-emoji" type="button" data-emoji-id="{{.ID}}" data-emoji-label="{{.Label}}" title="{{.Label}}" aria-label="{{.Label}}">
<img src="{{.URL}}" alt="" loading="lazy">
</button>
{{end}}
</div>
{{end}}
</div>
</div>
</div>
<div class="context-menu" data-file-context-menu role="menu" aria-label="File actions" hidden>
<div class="context-menu-top">
<small>File actions</small>