3-column layout #699
@ -13,11 +13,9 @@ import DmWindow from "@/Element/Chat/DmWindow";
|
|||||||
import { Chat, ChatType, useChatSystem } from "@/chat";
|
import { Chat, ChatType, useChatSystem } from "@/chat";
|
||||||
import { ChatParticipantProfile } from "@/Element/Chat/ChatParticipant";
|
import { ChatParticipantProfile } from "@/Element/Chat/ChatParticipant";
|
||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
import ProfileDmActions from "@/Pages/Messages/ProfileDmActions";
|
|
||||||
import NewChatWindow from "@/Pages/Messages/NewChatWindow";
|
import NewChatWindow from "@/Pages/Messages/NewChatWindow";
|
||||||
|
|
||||||
const TwoCol = 768;
|
const TwoCol = 768;
|
||||||
const ThreeCol = 1500;
|
|
||||||
|
|
||||||
export default function MessagesPage() {
|
export default function MessagesPage() {
|
||||||
const login = useLogin();
|
const login = useLogin();
|
||||||
@ -112,11 +110,6 @@ export default function MessagesPage() {
|
|||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
{chat ? <DmWindow id={chat} /> : pageWidth >= TwoCol && <div className="flex-1"></div>}
|
{chat ? <DmWindow id={chat} /> : pageWidth >= TwoCol && <div className="flex-1"></div>}
|
||||||
{pageWidth >= ThreeCol && chat && (
|
|
||||||
<div className="m-4">
|
|
||||||
<ProfileDmActions id={chat} />
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -1,52 +0,0 @@
|
|||||||
import { decodeTLV, TLVEntryType } from "@snort/system";
|
|
||||||
import { useUserProfile } from "@snort/system-react";
|
|
||||||
import useModeration from "@/Hooks/useModeration";
|
|
||||||
import Avatar from "@/Element/User/Avatar";
|
|
||||||
import { getDisplayName } from "@/SnortUtils";
|
|
||||||
import Text from "@/Element/Text";
|
|
||||||
import Icon from "@/Icons/Icon";
|
|
||||||
import { FormattedMessage } from "react-intl";
|
|
||||||
import React from "react";
|
|
||||||
|
|
||||||
export default function ProfileDmActions({ id }: { id: string }) {
|
|
||||||
const authors = decodeTLV(id)
|
|
||||||
.filter(a => a.type === TLVEntryType.Author)
|
|
||||||
.map(a => a.value as string);
|
|
||||||
const pubkey = authors[0];
|
|
||||||
const profile = useUserProfile(pubkey);
|
|
||||||
const { block, unblock, isBlocked } = useModeration();
|
|
||||||
|
|
||||||
function truncAbout(s?: string) {
|
|
||||||
if ((s?.length ?? 0) > 200) {
|
|
||||||
return `${s?.slice(0, 200)}...`;
|
|
||||||
}
|
|
||||||
return s;
|
|
||||||
}
|
|
||||||
|
|
||||||
const blocked = isBlocked(pubkey);
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Avatar pubkey={pubkey} user={profile} size={210} />
|
|
||||||
<h2>{getDisplayName(profile, pubkey)}</h2>
|
|
||||||
<p>
|
|
||||||
<Text
|
|
||||||
id={pubkey}
|
|
||||||
content={truncAbout(profile?.about) ?? ""}
|
|
||||||
tags={[]}
|
|
||||||
creator={pubkey}
|
|
||||||
disableMedia={true}
|
|
||||||
depth={0}
|
|
||||||
/>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<div className="settings-row" onClick={() => (blocked ? unblock(pubkey) : block(pubkey))}>
|
|
||||||
<Icon name="block" />
|
|
||||||
{blocked ? (
|
|
||||||
<FormattedMessage defaultMessage="Unblock" id="nDejmx" />
|
|
||||||
) : (
|
|
||||||
<FormattedMessage defaultMessage="Block" id="Up5U7K" />
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
}
|
|
Loading…
Reference in New Issue
Block a user