diff --git a/src/app/features/room/message/Message.tsx b/src/app/features/room/message/Message.tsx
index c8393137..ac1998b2 100644
--- a/src/app/features/room/message/Message.tsx
+++ b/src/app/features/room/message/Message.tsx
@@ -79,7 +79,7 @@ import { MemberPowerTag, StateEvent } from '../../../../types/matrix/room';
import { PowerIcon } from '../../../components/power';
import colorMXID from '../../../../util/colorMXID';
import { getPowerTagIconSrc } from '../../../hooks/useMemberPowerTag';
-import { AddReactionButton } from '../../../../owl/components/AddReactionButton';
+import { timeHourMinute } from '../../../utils/time';
export type ReactionHandler = (keyOrMxc: string, shortcode: string) => void;
@@ -1143,10 +1143,16 @@ export const Message = as<'div', MessageProps>(
)}
- {!edit && collapse && canSendReaction && !hasVisibleReactions
- && messageLayout !== MessageLayout.Compact
+ {!edit && collapse && messageLayout !== MessageLayout.Compact
&& (hover || !!emojiBoardAnchor) && (
-
+
+ {timeHourMinute(mEvent.getTs(), hour24Clock)}
+
)}
{messageLayout === MessageLayout.Compact && (
diff --git a/src/app/features/room/message/styles.css.ts b/src/app/features/room/message/styles.css.ts
index 4be501bd..2493d882 100644
--- a/src/app/features/room/message/styles.css.ts
+++ b/src/app/features/room/message/styles.css.ts
@@ -55,3 +55,13 @@ export const ReactionsContainer = style({
export const ReactionsTooltipText = style({
wordBreak: 'break-word',
});
+
+export const CollapsedTime = style({
+ position: 'absolute',
+ left: config.space.S400,
+ top: '50%',
+ transform: 'translateY(-50%)',
+ opacity: 0.6,
+ userSelect: 'none',
+ pointerEvents: 'none',
+});
diff --git a/src/owl/components/AddReactionButton.tsx b/src/owl/components/AddReactionButton.tsx
index bd112be5..3fead937 100644
--- a/src/owl/components/AddReactionButton.tsx
+++ b/src/owl/components/AddReactionButton.tsx
@@ -4,14 +4,13 @@ import * as css from '../styles/reactions.css';
type AddReactionButtonProps = {
onClick: MouseEventHandler;
- ghost?: boolean;
};
-export function AddReactionButton({ onClick, ghost }: AddReactionButtonProps) {
+export function AddReactionButton({ onClick }: AddReactionButtonProps) {
return (