Add toggle for replacing player info with song info

package.json

@@ -16,7 +16,6 @@
 		"critters": "^0.0.16",
 		"ioredis": "^5.2.3",
 		"next": "12",
-		"next-redux-wrapper": "^8.0.0",
 		"next-seo": "^5.9.0",
 		"next-themes": "^0.2.1",
 		"node-fetch": "^3.2.10",
@@ -25,7 +24,6 @@
 		"react-country-flag": "^3.0.2",
 		"react-dom": "^18.2.0",
 		"react-toastify": "^9.0.8",
-		"redux": "^4.2.0",
 		"sharp": "^0.31.1"
 	},
 	"devDependencies": {

src/pages/index.js

@@ -41,6 +41,7 @@ export default class Home extends Component {
 				showPlayerStats: true,
 				showScoreInfo: false,
 				showSongInfo: false,
+				shouldReplacePlayerInfoWithScore: false,
 			},
 		};
 	}
@@ -254,10 +255,7 @@ export default class Home extends Component {
 										</Radio>
 									</Radio.Group>
 									<Spacer y={1} />
-									<Text>
+									<Text>Show player stats (Current PP, global pos, etc)</Text>
-										Do you want to show Player Stats (Current PP, global pos,
-										etc)
-									</Text>
 									<Switch
 										label="Ranked leaderboard"
 										onChange={(event) =>
@@ -268,8 +266,7 @@ export default class Home extends Component {
 									/>
 									<Spacer y={1.2} />
 									<Text>
-										Do you want to show Score Info (Current swing values, total
+										Show score info (Current swing values, total score, etc)
-										score, etc)
 									</Text>
 									<Switch
 										onChange={(event) =>
@@ -279,10 +276,7 @@ export default class Home extends Component {
 										size="md"
 									/>
 									<Spacer y={1.2} />
-									<Text>
+									<Text>Show song info (Song name, bsr, song art, etc)</Text>
-										Do you want to show Song Info (Song name, bsr, song art,
-										etc)
-									</Text>
 									<Switch
 										onChange={(event) =>
 											this.updateValue("showSongInfo", event.target.checked)
@@ -291,6 +285,21 @@ export default class Home extends Component {
 										size="md"
 									/>
 									<Spacer y={1.2} />
+									<Text>
+										Hide player info to hide when a song starts (Show song info
+										Required)
+									</Text>
+									<Switch
+										onChange={(event) =>
+											this.updateValue(
+												"shouldReplacePlayerInfoWithScore",
+												event.target.checked
+											)
+										}
+										checked={this.state.values.shouldReplacePlayerInfoWithScore}
+										size="md"
+									/>
+									<Spacer y={1.2} />
 
 									<Button.Group>
 										<Button

src/pages/overlay.js

@@ -29,28 +29,37 @@ export default class Overlay extends Component {
 		this.state = {
 			hasError: false,
 
+			// Steam ID
+			id: undefined,
+
+			// Values from the query parameters
 			loadingPlayerData: true,
 			isConnectedToSocket: false,
-			id: undefined,
 			isValidSteamId: false,
 			websiteType: "ScoreSaber",
-			data: undefined,
 			showPlayerStats: true,
 			showScore: false,
 			showSongInfo: false,
-			loadedDuringSong: false,
+			shouldReplacePlayerInfoWithScore: false,
 
+			// Internal
+			loadedDuringSong: false,
 			socket: undefined,
-			isVisible: false,
+			data: undefined,
-			isPlayerInfoVisible: false,
-			songInfo: undefined,
 			beatSaverData: undefined,
-			currentSongTime: 0,
+			songInfo: undefined,
+			mapStarCount: undefined,
+
+			// UI elements
+			isPlayerInfoVisible: false,
+			isVisible: false,
+
+			// Score data
 			paused: true,
+			failed: false,
+			currentSongTime: 0,
 			currentScore: 0,
 			percentage: "100.00%",
-			failed: false,
-			mapStarCount: undefined,
 			SaberA: {
 				cutDistanceScore: 0.0,
 				averagePreSwing: 0.0,
@@ -123,6 +132,10 @@ export default class Overlay extends Component {
 			shouldConnectSocket = true;
 		}
 
+		if (params.shouldReplacePlayerInfoWithScore === "true") {
+			this.setState({ shouldReplacePlayerInfoWithScore: true });
+		}
+
 		// Check if the player wants to show the current song
 		if (params.showSongInfo === "true" || params.songinfo === "true") {
 			this.setState({ showSongInfo: true });
@@ -310,7 +323,7 @@ export default class Overlay extends Component {
 			}, 1000); // 1 second
 		}
 
-		if (visible) {
+		if (visible && this.state.shouldReplacePlayerInfoWithScore) {
 			this.setState({ isPlayerInfoVisible: false });
 		} else {
 			this.setState({ isPlayerInfoVisible: true });
@@ -442,6 +455,7 @@ export default class Overlay extends Component {
 			showPlayerStats,
 			loadingPlayerData,
 			isPlayerInfoVisible,
+			shouldReplacePlayerInfoWithScore,
 			id,
 		} = this.state;
 
@@ -462,7 +476,10 @@ export default class Overlay extends Component {
 						</div>
 					) : (
 						<div className={styles.overlay}>
-							{showPlayerStats && !loadingPlayerData && isPlayerInfoVisible ? (
+							{showPlayerStats &&
+							!loadingPlayerData &&
+							isPlayerInfoVisible &&
+							!shouldReplacePlayerInfoWithScore ? (
 								<PlayerStats
 									pp={data.pp.toLocaleString("en-US", {
 										maximumFractionDigits: 2,
@@ -485,8 +502,7 @@ export default class Overlay extends Component {
 							)}
 							{this.state.showSongInfo &&
 							this.state.beatSaverData !== undefined &&
-							this.state.isVisible &&
+							this.state.isVisible ? (
-							!isPlayerInfoVisible ? (
 								<SongInfo data={this.state} />
 							) : (
 								<></>

yarn.lock

@@ -17,13 +17,6 @@
   dependencies:
     regenerator-runtime "^0.13.4"
 
-"@babel/runtime@^7.9.2":
-  version "7.20.0"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.20.0.tgz#824a9ef325ffde6f78056059db3168c08785e24a"
-  integrity sha512-NDYdls71fTXoU8TZHfbBWg7DiZfNzClcKui/+kyi6ppD2L1qnWW3VV6CjtaBXSUGGhiTWJ6ereOIkUvenif66Q==
-  dependencies:
-    regenerator-runtime "^0.13.10"
-
 "@beam-australia/react-env@^3.1.1":
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/@beam-australia/react-env/-/react-env-3.1.1.tgz#63cb8316861b8fbdb4b9c550a62139cd90675e40"
@@ -2332,11 +2325,6 @@ natural-compare@^1.4.0:
   resolved "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz"
   integrity sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=
 
-next-redux-wrapper@^8.0.0:
-  version "8.0.0"
-  resolved "https://registry.yarnpkg.com/next-redux-wrapper/-/next-redux-wrapper-8.0.0.tgz#588f2d89146c60c77d4a40c0af7e5282acfe4773"
-  integrity sha512-zKRdpvDeqNXQr1j5DUWwsB2fz6XpHR32iy2qJGItTKLsbLB9GvtxDL9b4mFCfhDvnzy5dw97UqMjWDpFY8h0zA==
-
 next-seo@^5.9.0:
   version "5.9.0"
   resolved "https://registry.yarnpkg.com/next-seo/-/next-seo-5.9.0.tgz#1bc68a25677f0459609c587264c5ee90a2a00730"
@@ -2732,18 +2720,6 @@ redis-parser@^3.0.0:
   dependencies:
     redis-errors "^1.0.0"
 
-redux@^4.2.0:
-  version "4.2.0"
-  resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.0.tgz#46f10d6e29b6666df758780437651eeb2b969f13"
-  integrity sha512-oSBmcKKIuIR4ME29/AeNUnl5L+hvBq7OaJWzaptTQJAntaPvxIJqfnjbaEiCzzaIz+XmVILfqAM3Ob0aXLPfjA==
-  dependencies:
-    "@babel/runtime" "^7.9.2"
-
-regenerator-runtime@^0.13.10:
-  version "0.13.10"
-  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.10.tgz#ed07b19616bcbec5da6274ebc75ae95634bfc2ee"
-  integrity sha512-KepLsg4dU12hryUO7bp/axHAKvwGOCV0sGloQtpagJ12ai+ojVDqkeGSiRX1zlq+kjIMZ1t7gpze+26QqtdGqw==
-
 regenerator-runtime@^0.13.4:
   version "0.13.9"
   resolved "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz"