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