this repo has no description
Show account block in Composer
+42
-18
+21
-12
src/components/account-block.jsx
+21
-12
src/components/account-block.jsx
···
1
1
import './account-block.css';
2
2
3
-
import { useNavigate } from 'react-router-dom';
4
-
3
+
// import { useNavigate } from 'react-router-dom';
5
4
import enhanceContent from '../utils/enhance-content';
6
5
import niceDateTime from '../utils/nice-date-time';
7
6
import shortenNumber from '../utils/shorten-number';
···
21
20
onClick,
22
21
showActivity = false,
23
22
showStats = false,
23
+
accountInstance,
24
+
hideDisplayName = false,
24
25
}) {
25
26
if (skeleton) {
26
27
return (
···
35
36
);
36
37
}
37
38
38
-
const navigate = useNavigate();
39
+
// const navigate = useNavigate();
39
40
40
41
const {
41
42
id,
···
53
54
note,
54
55
group,
55
56
} = account;
56
-
const [_, acct1, acct2] = acct.match(/([^@]+)(@.+)/i) || [, acct];
57
+
let [_, acct1, acct2] = acct.match(/([^@]+)(@.+)/i) || [, acct];
58
+
if (accountInstance) {
59
+
acct2 = `@${accountInstance}`;
60
+
}
57
61
58
62
const verifiedField = fields?.find((f) => !!f.verifiedAt && !!f.value);
59
63
···
68
72
e.preventDefault();
69
73
if (onClick) return onClick(e);
70
74
if (internal) {
71
-
navigate(`/${instance}/a/${id}`);
75
+
// navigate(`/${instance}/a/${id}`);
76
+
location.hash = `/${instance}/a/${id}`;
72
77
} else {
73
78
states.showAccount = {
74
79
account,
···
79
84
>
80
85
<Avatar url={avatar} size={avatarSize} squircle={bot} />
81
86
<span>
82
-
{displayName ? (
83
-
<b>
84
-
<EmojiText text={displayName} emojis={emojis} />
85
-
</b>
86
-
) : (
87
-
<b>{username}</b>
87
+
{!hideDisplayName && (
88
+
<>
89
+
{displayName ? (
90
+
<b>
91
+
<EmojiText text={displayName} emojis={emojis} />
92
+
</b>
93
+
) : (
94
+
<b>{username}</b>
95
+
)}
96
+
<br />
97
+
</>
88
98
)}
89
-
<br />
90
99
<span class="account-block-acct">
91
100
@{acct1}
92
101
<wbr />
+9
src/components/compose.css
+9
src/components/compose.css
···
25
25
position: sticky;
26
26
top: 0;
27
27
z-index: 100;
28
+
white-space: nowrap;
29
+
}
30
+
#compose-container .compose-top .account-block {
31
+
text-align: start;
32
+
pointer-events: none;
33
+
overflow: hidden;
34
+
color: var(--text-insignificant-color);
35
+
line-height: 1.1;
36
+
font-size: 90%;
28
37
}
29
38
30
39
#compose-container textarea {
+12
-6
src/components/compose.jsx
+12
-6
src/components/compose.jsx
···
28
28
import useInterval from '../utils/useInterval';
29
29
import visibilityIconsMap from '../utils/visibility-icons-map';
30
30
31
-
import Avatar from './avatar';
31
+
import AccountBlock from './account-block';
32
+
// import Avatar from './avatar';
32
33
import Icon from './icon';
33
34
import Loader from './loader';
34
35
import Modal from './modal';
···
508
509
<div id="compose-container" class={standalone ? 'standalone' : ''}>
509
510
<div class="compose-top">
510
511
{currentAccountInfo?.avatarStatic && (
511
-
<Avatar
512
-
url={currentAccountInfo.avatarStatic}
513
-
size="xl"
514
-
alt={currentAccountInfo.username}
515
-
squircle={currentAccountInfo?.bot}
512
+
// <Avatar
513
+
// url={currentAccountInfo.avatarStatic}
514
+
// size="xl"
515
+
// alt={currentAccountInfo.username}
516
+
// squircle={currentAccountInfo?.bot}
517
+
// />
518
+
<AccountBlock
519
+
account={currentAccountInfo}
520
+
accountInstance={currentAccount.instanceURL}
521
+
hideDisplayName
516
522
/>
517
523
)}
518
524
{!standalone ? (