No edit images

TODO.md

@@ -8,10 +8,9 @@
 
 
 
-- When resiszing and if im already at the bottom of the channel, i want to make sure i stay at the bottom of the channel.
+- When resiszing the window and if im already at the bottom of the channel, i want to make sure i stay at the bottom of the channel.
 
-- You should not be allowed to edit a image or video file upload message.
+- So right now in our search we can search and jump to messages. We can only jump to messages loaded in our chat already. How can we make it so we can jump to older messages not loaded in our chat at the moment?
 
 
-
-- Lets make it so if i right click on someone on the memebers list or if they are in voice we get a couple more options. As is if they are in voice we get server mute and all that. Thats fine only when they are in voice but we should have more options for someone like, Change Nickname (If you have permission to change people nicknames), Message (To send them a direct message), Start a Call (To start a private call). Also this change nickname is for the whole server to see. So everywhere their username would be will be their nickname instead of their username. So if they have a nickname it will show up in the chat and in the members list instead of their username for everyone to see.
+- Are we using the encryped sql database to help load messages faster?

packages/shared/src/components/ChatArea.jsx

@@ -25,7 +25,7 @@ import UserProfilePopup from './UserProfilePopup';
 import Avatar from './Avatar';
 import MentionMenu from './MentionMenu';
 import SlashCommandMenu from './SlashCommandMenu';
-import MessageItem, { getUserColor } from './MessageItem';
+import MessageItem, { getUserColor, parseAttachment } from './MessageItem';
 import ColoredIcon from './ColoredIcon';
 import { usePlatform } from '../platform';
 import { useVoice } from '../contexts/VoiceContext';
@@ -449,7 +449,7 @@ const EmojiButton = ({ onClick, active }) => {
     );
 };
 
-const MessageContextMenu = ({ x, y, onInteract, onClose, isOwner, canDelete }) => {
+const MessageContextMenu = ({ x, y, onInteract, onClose, isOwner, isAttachment, canDelete }) => {
     const menuRef = useRef(null);
     const [pos, setPos] = useState({ top: y, left: x });
     useEffect(() => { const h = () => onClose(); window.addEventListener('click', h); window.addEventListener('close-context-menus', h); return () => { window.removeEventListener('click', h); window.removeEventListener('close-context-menus', h); }; }, [onClose]);
@@ -474,7 +474,7 @@ const MessageContextMenu = ({ x, y, onInteract, onClose, isOwner, canDelete }) =
     return (
         <div ref={menuRef} className="context-menu" style={{ top: pos.top, left: pos.left }} onClick={(e) => e.stopPropagation()}>
             <MenuItem label="Add Reaction" iconSrc={EmojieIcon} iconColor={ICON_COLOR_DEFAULT} onClick={() => onInteract('reaction')} />
-            {isOwner && <MenuItem label="Edit Message" iconSrc={EditIcon} iconColor={ICON_COLOR_DEFAULT} onClick={() => onInteract('edit')} />}
+            {isOwner && !isAttachment && <MenuItem label="Edit Message" iconSrc={EditIcon} iconColor={ICON_COLOR_DEFAULT} onClick={() => onInteract('edit')} />}
             <MenuItem label="Reply" iconSrc={ReplyIcon} iconColor={ICON_COLOR_DEFAULT} onClick={() => onInteract('reply')} />
             <div className="context-menu-separator" />
             <MenuItem label="Pin Message" iconSrc={PinIcon} iconColor={ICON_COLOR_DEFAULT} onClick={() => onInteract('pin')} />
@@ -1897,11 +1897,11 @@ const ChatArea = ({ channelId, channelName, channelType, username, channelKey, u
                 username={username}
                 onHover={() => setHoveredMessageId(msg.id)}
                 onLeave={() => setHoveredMessageId(null)}
-                onContextMenu={(e) => { e.preventDefault(); window.dispatchEvent(new Event('close-context-menus')); setContextMenu({ x: e.clientX, y: e.clientY, messageId: msg.id, isOwner, canDelete }); }}
+                onContextMenu={(e) => { e.preventDefault(); window.dispatchEvent(new Event('close-context-menus')); setContextMenu({ x: e.clientX, y: e.clientY, messageId: msg.id, isOwner, isAttachment: !!parseAttachment(msg.content), canDelete }); }}
                 onAddReaction={(emoji) => { if (emoji) { addReaction({ messageId: msg.id, userId: currentUserId, emoji }); } else { setReactionPickerMsgId(reactionPickerMsgId === msg.id ? null : msg.id); } }}
                 onEdit={() => { setEditingMessage({ id: msg.id, content: msg.content }); setEditInput(msg.content); }}
                 onReply={() => setReplyingTo({ messageId: msg.id, username: msg.username, content: msg.content?.substring(0, 100) })}
-                onMore={(e) => { const rect = e.target.getBoundingClientRect(); setContextMenu({ x: rect.left, y: rect.bottom, messageId: msg.id, isOwner, canDelete }); }}
+                onMore={(e) => { const rect = e.target.getBoundingClientRect(); setContextMenu({ x: rect.left, y: rect.bottom, messageId: msg.id, isOwner, isAttachment: !!parseAttachment(msg.content), canDelete }); }}
                 onEditInputChange={(e) => setEditInput(e.target.value)}
                 onEditKeyDown={handleEditKeyDown}
                 onEditSave={handleEditSave}
@@ -1964,7 +1964,7 @@ const ChatArea = ({ channelId, channelName, channelType, username, channelKey, u
                     />
                 )}
             </div>
-            {contextMenu && <MessageContextMenu x={contextMenu.x} y={contextMenu.y} isOwner={contextMenu.isOwner} canDelete={contextMenu.canDelete} onClose={() => setContextMenu(null)} onInteract={(action) => handleContextInteract(action, contextMenu.messageId)} />}
+            {contextMenu && <MessageContextMenu x={contextMenu.x} y={contextMenu.y} isOwner={contextMenu.isOwner} isAttachment={contextMenu.isAttachment} canDelete={contextMenu.canDelete} onClose={() => setContextMenu(null)} onInteract={(action) => handleContextInteract(action, contextMenu.messageId)} />}
             {reactionPickerMsgId && (
                 <div style={{ position: 'fixed', top: 0, left: 0, right: 0, bottom: 0, zIndex: 999 }} onClick={() => setReactionPickerMsgId(null)}>
                     <div style={{ position: 'absolute', right: '80px', top: '50%', transform: 'translateY(-50%)' }} onClick={(e) => e.stopPropagation()}>

packages/shared/src/components/MessageItem.jsx

@@ -154,7 +154,7 @@ const IconButton = ({ onClick, emoji }) => (
     </div>
 );
 
-const MessageToolbar = ({ onAddReaction, onEdit, onReply, onMore, isOwner }) => (
+const MessageToolbar = ({ onAddReaction, onEdit, onReply, onMore, isOwner, isAttachment }) => (
     <div className="message-toolbar">
         <Tooltip text="Thumbs Up" position="top">
             <IconButton onClick={() => onAddReaction('thumbsup')} emoji={<ColoredIcon src={thumbsupIcon} size="20px" />} />
@@ -169,7 +169,7 @@ const MessageToolbar = ({ onAddReaction, onEdit, onReply, onMore, isOwner }) =>
         <Tooltip text="Add Reaction" position="top">
             <IconButton onClick={() => onAddReaction(null)} emoji={<ColoredIcon src={EmojieIcon} color={ICON_COLOR_DEFAULT} size="20px" />} />
         </Tooltip>
-        {isOwner && (
+        {isOwner && !isAttachment && (
             <Tooltip text="Edit" position="top">
                 <IconButton onClick={onEdit} emoji={<ColoredIcon src={EditIcon} color={ICON_COLOR_DEFAULT} size="20px" />} />
             </Tooltip>
@@ -366,6 +366,7 @@ const MessageItem = React.memo(({
                         )}
                         {isHovered && !isEditing && (
                             <MessageToolbar isOwner={isOwner}
+                                isAttachment={!!parseAttachment(msg.content)}
                                 onAddReaction={onAddReaction}
                                 onEdit={onEdit}
                                 onReply={onReply}