Finish implementing logout and refresh

mgoetz · Oct 20, 2017 · b732683 · b732683
1 parent 6f77c4a
commit b732683
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 9 deletions.
diff --git a/STTApi b/STTApi
diff --git a/src/assets/css/App.css b/src/assets/css/App.css
@@ -218,6 +218,7 @@
     text-align: center;
     font-family: LCARS, "Helvetica Neue", Helvetica, Arial, sans-serif;
     font-size: 28px;
+    line-height: 40px;
 }
 
 .image-disabled {

diff --git a/src/components/App.js b/src/components/App.js
@@ -74,6 +74,7 @@ class App extends React.Component {
 		this._captainButtonElement = null;
 		this._onAccessToken = this._onAccessToken.bind(this);
 		this._onLogout = this._onLogout.bind(this);
+		this._onRefresh = this._onRefresh.bind(this);
 		this._getCommandItems = this._getCommandItems.bind(this);
 		this._onShare = this._onShare.bind(this);
 		this._onCaptainClicked = this._onCaptainClicked.bind(this);
@@ -96,6 +97,11 @@ class App extends React.Component {
 	}
 
 	_onCaptainClicked() {
+		if (!STTApi.loggedIn) {
+			this._onLogout();
+			return;
+		}
+
 		if (!this.state.showSpinner)
 			this.setState({ isCaptainCalloutVisible: !this.state.isCaptainCalloutVisible });
 	}
@@ -140,7 +146,7 @@ class App extends React.Component {
 								onDismiss={this._onCaptainCalloutDismiss}
 								setInitialFocus={true}
 							>
-								<CaptainCard captainAvatarBodyUrl={this.state.captainAvatarBodyUrl} onLogout={this._onLogout} />
+								<CaptainCard captainAvatarBodyUrl={this.state.captainAvatarBodyUrl} onLogout={this._onLogout} onRefresh={this._onRefresh} />
 							</Callout>
 						)}
 					</div>
@@ -317,8 +323,17 @@ class App extends React.Component {
 	}
 
 	_onLogout() {
-		// TODO: Implement a logout in STTApi itself to clear out any old data before proceeding
+		this.setState({ isCaptainCalloutVisible: false });
+		STTApi.refreshEverything(true);
 		this.setState({ showLoginDialog: true, dataLoaded: false, captainName: 'Welcome!', spinnerLabel: 'Loading...', secondLine: ''});
+		this.refs.loginDialog._showDialog('');
+	}
+
+	_onRefresh() {
+		this.setState({ isCaptainCalloutVisible: false });
+		STTApi.refreshEverything(false);
+		this.setState({ dataLoaded: false, spinnerLabel: 'Refreshing...'});
+		this._onAccessToken();
 	}
 
 	_onDataError(reason) {

diff --git a/src/components/CaptainCard.js b/src/components/CaptainCard.js
@@ -9,6 +9,10 @@ import { CONFIG } from 'sttapi';
 
 export class CaptainCard extends React.Component {
 	render() {
+		if (!STTApi.loggedIn) {
+			return <span/>;
+		}
+
 		return (<div className="ui inverted segment">
 			<div className="ui two column grid">
 			<div className="row">
@@ -57,11 +61,7 @@ export class CaptainCard extends React.Component {
 						</div>
 					</div>
 					<button className="ui primary button" onClick={() => this.props.onLogout()}><i className="icon sign out"></i>Logout</button>
-					<button className="ui primary button" onClick={() => this.setState({ loggedIn: false })}><i className="icon refresh"></i>Refresh inventory</button>
-					<br />
-					<div className="ui">
-						<i>Note:</i> refershing the inventory will <b>not</b> recalculate crew recommendations. Please restart the app for that!
-					</div>
+					<button className="ui primary button" onClick={() => this.props.onRefresh()}><i className="icon refresh"></i>Refresh everything</button>
 				</div>
 			</div>
 		</div>

diff --git a/src/components/GauntletHelper.js b/src/components/GauntletHelper.js
@@ -216,7 +216,7 @@ export class GauntletHelper extends React.Component {
 					<Label>Crew refeshes in {Math.floor(this.state.gauntlet.seconds_to_next_crew_refresh / 60)} minutes and the gauntlet ends in {Math.floor(this.state.gauntlet.seconds_to_end / 60)} minutes</Label>
 					<Label>Your rank is {this.state.roundOdds.rank} and you have {this.state.roundOdds.consecutive_wins} consecutive wins</Label>
 					<span><h3>Your crew stats <DefaultButton onClick={this._reloadGauntletData} text='Reload data' iconProps={{ iconName: 'Refresh' }} /></h3></span>
-					<div style={{ display: 'flex' }} >
+					<div style={{ display: 'flex', width: '95%' }} >
 						{this.state.gauntlet.contest_data.selected_crew.map(function (crew) {
 							return <GauntletCrew key={crew.crew_id} crew={crew} />;
 						})}