mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-10 01:03:36 -05:00
Add system message icons. Closes #10
This commit is contained in:
parent
25615cc16d
commit
34e8d54512
2 changed files with 39 additions and 0 deletions
|
@ -124,6 +124,10 @@ export default styled.div<BaseMessageProps>`
|
|||
time {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.system-message-icon {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
|
|
|
@ -1,3 +1,15 @@
|
|||
import {
|
||||
InfoCircle,
|
||||
UserPlus,
|
||||
UserMinus,
|
||||
ArrowToRight,
|
||||
ArrowToLeft,
|
||||
UserX,
|
||||
ShieldX,
|
||||
EditAlt,
|
||||
Edit,
|
||||
MessageSquareEdit,
|
||||
} from "@styled-icons/boxicons-solid";
|
||||
import { observer } from "mobx-react-lite";
|
||||
import { Message } from "revolt.js/dist/maps/Messages";
|
||||
import { User } from "revolt.js/dist/maps/Users";
|
||||
|
@ -40,6 +52,19 @@ interface Props {
|
|||
hideInfo?: boolean;
|
||||
}
|
||||
|
||||
const iconDictionary = {
|
||||
user_added: UserPlus,
|
||||
user_remove: UserMinus,
|
||||
user_joined: ArrowToRight,
|
||||
user_left: ArrowToLeft,
|
||||
user_kicked: UserX,
|
||||
user_banned: ShieldX,
|
||||
channel_renamed: EditAlt,
|
||||
channel_description_changed: Edit,
|
||||
channel_icon_changed: MessageSquareEdit,
|
||||
text: InfoCircle,
|
||||
};
|
||||
|
||||
export const SystemMessage = observer(
|
||||
({ attachContext, message, highlight, hideInfo }: Props) => {
|
||||
const client = useClient();
|
||||
|
@ -89,6 +114,15 @@ export const SystemMessage = observer(
|
|||
data = { type: "text", content };
|
||||
}
|
||||
|
||||
const SystemMessageIcon = iconDictionary[data.type] ?? InfoCircle;
|
||||
|
||||
const SystemIcon = styled(SystemMessageIcon)`
|
||||
height: 1.33em;
|
||||
width: 1.33em;
|
||||
margin-right: 0.5em;
|
||||
color: var(--tertiary-foreground);
|
||||
`;
|
||||
|
||||
let children;
|
||||
switch (data.type) {
|
||||
case "text":
|
||||
|
@ -161,6 +195,7 @@ export const SystemMessage = observer(
|
|||
{!hideInfo && (
|
||||
<MessageInfo>
|
||||
<MessageDetail message={message} position="left" />
|
||||
<SystemIcon className="system-message-icon" />
|
||||
</MessageInfo>
|
||||
)}
|
||||
<SystemContent>{children}</SystemContent>
|
||||
|
|
Loading…
Reference in a new issue