MessageLogger: Add toggle deleted highlight rightclick button

This commit is contained in:
Vendicated 2023-04-17 01:27:25 +02:00
parent ce64631310
commit 7d55a81bac
No known key found for this signature in database
GPG Key ID: A1DC0CFB5615D905
2 changed files with 23 additions and 8 deletions

@ -43,7 +43,8 @@ function addDeleteStyle() {
} }
} }
const MENU_ITEM_ID = "message-logger-remove-history"; const REMOVE_HISTORY_ID = "ml-remove-history";
const TOGGLE_DELETE_STYLE_ID = "ml-toggle-style";
const patchMessageContextMenu: NavContextMenuPatchCallback = (children, props) => () => { const patchMessageContextMenu: NavContextMenuPatchCallback = (children, props) => () => {
const { message } = props; const { message } = props;
const { deleted, editHistory, id, channel_id } = message; const { deleted, editHistory, id, channel_id } = message;
@ -52,11 +53,11 @@ const patchMessageContextMenu: NavContextMenuPatchCallback = (children, props) =
children.push(( children.push((
<Menu.MenuItem <Menu.MenuItem
id={MENU_ITEM_ID} id={REMOVE_HISTORY_ID}
key={MENU_ITEM_ID} key={REMOVE_HISTORY_ID}
label="Remove Message History" label="Remove Message History"
action={() => { action={() => {
if (message.deleted) { if (deleted) {
FluxDispatcher.dispatch({ FluxDispatcher.dispatch({
type: "MESSAGE_DELETE", type: "MESSAGE_DELETE",
channelId: channel_id, channelId: channel_id,
@ -69,6 +70,20 @@ const patchMessageContextMenu: NavContextMenuPatchCallback = (children, props) =
}} }}
/> />
)); ));
if (!deleted) return;
const domElement = document.getElementById(`chat-messages-${channel_id}-${id}`);
if (!domElement) return;
children.push((
<Menu.MenuItem
id={TOGGLE_DELETE_STYLE_ID}
key={TOGGLE_DELETE_STYLE_ID}
label="Toggle Deleted Highlight"
action={() => domElement.classList.toggle("messagelogger-deleted")}
/>
));
}; };
export default definePlugin({ export default definePlugin({

@ -2,15 +2,15 @@
display: none; display: none;
} }
.messagelogger-deleted :is(video), .messagelogger-deleted :is(video, .emoji, [data-type="sticker"]),
.messagelogger-deleted-attachment, .messagelogger-deleted .messagelogger-deleted-attachment,
.messagelogger-deleted div iframe { .messagelogger-deleted div iframe {
filter: grayscale(1) !important; filter: grayscale(1) !important;
transition: 150ms filter ease-in-out; transition: 150ms filter ease-in-out;
} }
.messagelogger-deleted:hover :is(video), .messagelogger-deleted:hover :is(video, .emoji, [data-type="sticker"]),
.messagelogger-deleted-attachment:hover, .messagelogger-deleted .messagelogger-deleted-attachment:hover,
.messagelogger-deleted iframe:hover { .messagelogger-deleted iframe:hover {
filter: grayscale(0) !important; filter: grayscale(0) !important;
} }