aboutsummaryrefslogtreecommitdiff
path: root/src/client/util/ServerStats.tsx
diff options
context:
space:
mode:
authorsrichman333 <sarah_n_richman@brown.edu>2023-07-18 13:22:36 -0400
committersrichman333 <sarah_n_richman@brown.edu>2023-07-18 13:22:36 -0400
commit7311dc5e358e34b074391b398e51439b20391ecb (patch)
treef42285e7bdc5baa081f8ac920361fbb84a59ef92 /src/client/util/ServerStats.tsx
parent51718316b592e86c0009b7a27e1e32ba74d2488b (diff)
parent5da0b8c1e12abe13d60361af4f6bbb8454b6814d (diff)
Merge branch 'master' into data-visualization-sarah
Diffstat (limited to 'src/client/util/ServerStats.tsx')
-rw-r--r--src/client/util/ServerStats.tsx24
1 files changed, 19 insertions, 5 deletions
diff --git a/src/client/util/ServerStats.tsx b/src/client/util/ServerStats.tsx
index f84ad8598..6a6ec158e 100644
--- a/src/client/util/ServerStats.tsx
+++ b/src/client/util/ServerStats.tsx
@@ -3,6 +3,9 @@ import { observer } from 'mobx-react';
import * as React from 'react';
import { MainViewModal } from '../views/MainViewModal';
import './SharingManager.scss';
+import { PingManager } from './PingManager';
+import { StrCast } from '../../fields/Types';
+import { Doc } from '../../fields/Doc';
@observer
export class ServerStats extends React.Component<{}> {
@@ -39,11 +42,22 @@ export class ServerStats extends React.Component<{}> {
*/
@computed get sharingInterface() {
return (
- <div>
- <span>Active users:{this._stats?.socketMap.length}</span>
- {this._stats?.socketMap.map((user: any) => (
- <p>{user.username}</p>
- ))}
+ <div style={{
+ display: "flex",
+ height: 300,
+ width: 400,
+ background: StrCast(Doc.UserDoc().userBackgroundColor),
+ opacity: 0.6}}>
+ <div style={{width: 300,height: 100,margin: "auto",display: "flex",flexDirection: "column"}}>
+ {PingManager.Instance.IsBeating ? 'The server connection is active' :
+ 'The server connection has been interrupted.NOTE: Any changes made will appear to persist but will be lost after a browser refreshes.'}
+
+ <br/>
+ <span>Active users:{this._stats?.socketMap.length}</span>
+ {this._stats?.socketMap.map((user: any) => (
+ <p>{user.username}</p>
+ ))}
+ </div>
</div>
);
}