mirror of
https://github.com/filecoin-project/slate.git
synced 2024-10-26 22:39:39 +03:00
Merge pull request #513 from filecoin-project/@akuokojnr/fix-status-bug
fix status bug on peers tab
This commit is contained in:
commit
93b82d77ab
@ -239,9 +239,11 @@ function UserEntry({
|
||||
message,
|
||||
external,
|
||||
url,
|
||||
userOnline,
|
||||
checkStatus,
|
||||
showStatusIndicator,
|
||||
}) {
|
||||
const isOnline = checkStatus({ id: user.id });
|
||||
|
||||
return (
|
||||
<div key={user.username} css={STYLES_USER_ENTRY}>
|
||||
{external ? (
|
||||
@ -254,8 +256,8 @@ function UserEntry({
|
||||
<div
|
||||
css={STYLES_DIRECTORY_STATUS_INDICATOR}
|
||||
style={{
|
||||
borderColor: userOnline && `${Constants.system.active}`,
|
||||
backgroundColor: userOnline && `${Constants.system.active}`,
|
||||
borderColor: isOnline && `${Constants.system.active}`,
|
||||
backgroundColor: isOnline && `${Constants.system.active}`,
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
@ -274,8 +276,8 @@ function UserEntry({
|
||||
<div
|
||||
css={STYLES_DIRECTORY_STATUS_INDICATOR}
|
||||
style={{
|
||||
borderColor: userOnline && `${Constants.system.active}`,
|
||||
backgroundColor: userOnline && `${Constants.system.active}`,
|
||||
borderColor: isOnline && `${Constants.system.active}`,
|
||||
backgroundColor: isOnline && `${Constants.system.active}`,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@ -310,13 +312,11 @@ export default class Profile extends React.Component {
|
||||
}).length,
|
||||
fetched: false,
|
||||
tab: this.props.tab,
|
||||
isOnline: false,
|
||||
};
|
||||
|
||||
componentDidMount = () => {
|
||||
this._handleUpdatePage();
|
||||
this.filterByVisibility();
|
||||
this.checkStatus();
|
||||
};
|
||||
|
||||
componentDidUpdate = (prevProps) => {
|
||||
@ -404,11 +404,9 @@ export default class Profile extends React.Component {
|
||||
});
|
||||
};
|
||||
|
||||
checkStatus = () => {
|
||||
const activeUsers = this.props.activeUsers;
|
||||
const userId = this.props.data?.id;
|
||||
|
||||
this.setState({ isOnline: activeUsers && activeUsers.includes(userId) });
|
||||
checkStatus = ({ id }) => {
|
||||
const { activeUsers } = this.props;
|
||||
return activeUsers && activeUsers.includes(id);
|
||||
};
|
||||
|
||||
render() {
|
||||
@ -473,12 +471,13 @@ export default class Profile extends React.Component {
|
||||
) : null}
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<UserEntry
|
||||
key={relation.id}
|
||||
user={relation.user}
|
||||
button={button}
|
||||
userOnline={this.state.isOnline}
|
||||
checkStatus={this.checkStatus}
|
||||
showStatusIndicator={this.props.isAuthenticated}
|
||||
onClick={() => {
|
||||
this.props.onAction({
|
||||
@ -532,7 +531,7 @@ export default class Profile extends React.Component {
|
||||
key={relation.id}
|
||||
user={relation.owner}
|
||||
button={button}
|
||||
userOnline={this.state.isOnline}
|
||||
checkStatus={this.checkStatus}
|
||||
showStatusIndicator={this.props.isAuthenticated}
|
||||
onClick={() => {
|
||||
this.props.onAction({
|
||||
@ -581,8 +580,10 @@ export default class Profile extends React.Component {
|
||||
<div
|
||||
css={STYLES_STATUS_INDICATOR}
|
||||
style={{
|
||||
borderColor: this.state.isOnline && `${Constants.system.active}`,
|
||||
backgroundColor: this.state.isOnline && `${Constants.system.active}`,
|
||||
borderColor:
|
||||
this.checkStatus({ id: this.props.data?.id }) && `${Constants.system.active}`,
|
||||
backgroundColor:
|
||||
this.checkStatus({ id: this.props.data?.id }) && `${Constants.system.active}`,
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
@ -112,7 +112,9 @@ const STYLES_NAME = css`
|
||||
text-overflow: ellipsis;
|
||||
`;
|
||||
|
||||
function UserEntry({ user, button, onClick, message, userOnline }) {
|
||||
function UserEntry({ user, button, onClick, message, checkStatus }) {
|
||||
const isOnline = checkStatus({ id: user.id });
|
||||
|
||||
return (
|
||||
<div key={user.username} css={STYLES_USER_ENTRY}>
|
||||
<div css={STYLES_USER} onClick={onClick}>
|
||||
@ -120,8 +122,8 @@ function UserEntry({ user, button, onClick, message, userOnline }) {
|
||||
<div
|
||||
css={STYLES_STATUS_INDICATOR}
|
||||
style={{
|
||||
borderColor: userOnline && `${Constants.system.active}`,
|
||||
backgroundColor: userOnline && `${Constants.system.active}`,
|
||||
borderColor: isOnline && `${Constants.system.active}`,
|
||||
backgroundColor: isOnline && `${Constants.system.active}`,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
@ -159,11 +161,6 @@ export default class SceneDirectory extends React.Component {
|
||||
state = {
|
||||
copyValue: "",
|
||||
contextMenu: null,
|
||||
isOnline: false,
|
||||
};
|
||||
|
||||
componentDidMount = () => {
|
||||
this.checkStatus();
|
||||
};
|
||||
|
||||
_handleCopy = (e, value) => {
|
||||
@ -196,11 +193,10 @@ export default class SceneDirectory extends React.Component {
|
||||
});
|
||||
};
|
||||
|
||||
checkStatus = () => {
|
||||
const activeUsers = this.props.activeUsers;
|
||||
const userId = this.props.data?.id;
|
||||
checkStatus = ({ id }) => {
|
||||
const { activeUsers } = this.props;
|
||||
|
||||
this.setState({ isOnline: activeUsers && activeUsers.includes(userId) });
|
||||
return activeUsers && activeUsers.includes(id);
|
||||
};
|
||||
|
||||
render() {
|
||||
@ -240,7 +236,7 @@ export default class SceneDirectory extends React.Component {
|
||||
key={relation.id}
|
||||
user={relation.user}
|
||||
button={button}
|
||||
userOnline={this.state.isOnline}
|
||||
checkStatus={this.checkStatus}
|
||||
onClick={() => {
|
||||
this.props.onAction({
|
||||
type: "NAVIGATE",
|
||||
@ -289,7 +285,7 @@ export default class SceneDirectory extends React.Component {
|
||||
key={relation.id}
|
||||
user={relation.owner}
|
||||
button={button}
|
||||
userOnline={this.state.isOnline}
|
||||
checkStatus={this.checkStatus}
|
||||
onClick={() => {
|
||||
this.props.onAction({
|
||||
type: "NAVIGATE",
|
||||
|
Loading…
Reference in New Issue
Block a user