rick/rosterchirp-dev
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v0.8.5 fix pinning

Browse Source
This commit is contained in:
Ricky Stretch
2026-03-13 10:51:27 -04:00
parent a02facff1a
commit b3aac1981c
13 changed files with 153 additions and 504 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
frontend/src/components/Message.jsx
View File

@@ -31,7 +31,7 @@ function isEmojiOnly(str) {
return emojiRegex.test(str.trim());
}
export default function Message({ message: msg, prevMessage, currentUser, onReply, onDelete, onReact, onDirectMessage, isDirect, onPin, onUnpin, isPinned, pinCount = 0, onlineUserIds = new Set() }) {
export default function Message({ message: msg, prevMessage, currentUser, onReply, onDelete, onReact, onDirectMessage, isDirect, onlineUserIds = new Set() }) {
const [showActions, setShowActions] = useState(false);
const [showOptionsMenu, setShowOptionsMenu] = useState(false);
const longPressTimer = useRef(null);
@@ -240,16 +240,7 @@ export default function Message({ message: msg, prevMessage, currentUser, onRepl
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"/></svg>
</button>
)}
{isDirect && (
<button
className={`btn-icon action-btn${isPinned ? ' action-pinned' : ''}`}
onClick={() => { isPinned ? onUnpin(msg.id) : (pinCount < 5 && onPin(msg.id)); setShowActions(false); }}
disabled={!isPinned && pinCount >= 5}
title={isPinned ? 'Unpin message' : pinCount >= 5 ? 'Pin limit reached (5/5)' : `Pin message (${pinCount + 1}/5)`}
>
<svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor"><path d="M16 2v4l-3 3v7l-4-4-4 4V9L2 6V2h14zm2 0h2v2h-2V2z"/></svg>
</button>
)}
{/* Emoji picker anchored to the toolbar */}
{showEmojiPicker && (
<div
@@ -286,36 +277,7 @@ export default function Message({ message: msg, prevMessage, currentUser, onRepl
<span className="msg-time">{formatTime(msg.created_at)}</span>
{/* Mobile long-press / right-click bottom sheet for pin */}
{isDirect && showOptionsMenu && (
<div className="msg-sheet-overlay" onClick={() => setShowOptionsMenu(false)}>
<div
className="msg-sheet"
ref={optionsMenuRef}
onClick={e => e.stopPropagation()}
>
<div className="msg-sheet-handle" />
{isPinned ? (
<button className="msg-sheet-btn" onClick={() => { onUnpin(msg.id); setShowOptionsMenu(false); }}>
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M16 2v4l-3 3v7l-4-4-4 4V9L2 6V2h14zm2 0h2v2h-2V2z"/></svg>
Unpin message
</button>
) : (
<button
className="msg-sheet-btn"
onClick={() => { if (pinCount < 5) { onPin(msg.id); setShowOptionsMenu(false); } }}
disabled={pinCount >= 5}
>
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor"><path d="M16 2v4l-3 3v7l-4-4-4 4V9L2 6V2h14zm2 0h2v2h-2V2z"/></svg>
{pinCount >= 5 ? 'Pin limit reached (5/5)' : `Pin message (${pinCount + 1}/5)`}
</button>
)}
<button className="msg-sheet-btn msg-sheet-cancel" onClick={() => setShowOptionsMenu(false)}>
Cancel
</button>
</div>
</div>
)}
</div>
{Object.keys(reactionMap).length > 0 && (