filecoin-project/slate
1
1
Fork 0
mirror of https://github.com/filecoin-project/slate.git synced 2024-10-26 22:39:39 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #513 from filecoin-project/@akuokojnr/fix-status-bug

Browse Source 
fix status bug on peers tab
This commit is contained in:
CAKE 2021-02-09 09:58:58 -08:00 committed by GitHub
commit 93b82d77ab
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
components/core/Profile.js
View File

@ -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}`,
}}
/>
)}

24
scenes/SceneDirectory.js
View File

@ -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",