import { Text } from "preact-i18n"; import UserShort from "../../user/UserShort"; import styled, { css } from "styled-components"; import Markdown from "../../../markdown/Markdown"; import { Reply, File } from "@styled-icons/boxicons-regular"; import { useUser } from "../../../../context/revoltjs/hooks"; import { useRenderState } from "../../../../lib/renderer/Singleton"; interface Props { channel: string index: number id: string } export const ReplyBase = styled.div<{ head?: boolean, fail?: boolean, preview?: boolean }>` gap: 4px; display: flex; font-size: 0.8em; margin-left: 30px; user-select: none; margin-bottom: 4px; align-items: center; color: var(--secondary-foreground); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; svg { flex-shrink: 0; transform: scaleX(-1); color: var(--tertiary-foreground); } ${ props => props.fail && css` color: var(--tertiary-foreground); ` } ${ props => props.head && css` margin-top: 12px; ` } ${ props => props.preview && css` margin-left: 0; ` } `; export function MessageReply({ index, channel, id }: Props) { const view = useRenderState(channel); if (view?.type !== 'RENDER') return null; const message = view.messages.find(x => x._id === id); if (!message) { return ( ) } const user = useUser(message.author); return ( { message.attachments && message.attachments.length > 0 && } ) }