diff --git a/src/common/getInitialState.js b/src/common/getInitialState.js
index 346c6eb..f0ab90e 100644
--- a/src/common/getInitialState.js
+++ b/src/common/getInitialState.js
@@ -1,13 +1,9 @@
-export function getInitialState(
- savedDisplay,
- hasVisitedEver,
- hasVisitedRecently,
-) {
+export function getInitialState(savedDisplay, hasVisitedEver, hasSeenWhatsNew) {
if (!hasVisitedEver) {
return "rules";
}
- if (!hasVisitedRecently) {
+ if (!hasSeenWhatsNew) {
return "whatsNew";
}
diff --git a/src/common/getInitialState.test.js b/src/common/getInitialState.test.js
index 005028a..fa40424 100644
--- a/src/common/getInitialState.test.js
+++ b/src/common/getInitialState.test.js
@@ -7,19 +7,19 @@ describe("getInitialState", () => {
expect(getInitialState("game", false, false)).toBe("rules");
});
- test("returns 'whatsNew' if hasVisitedRecently is false", () => {
+ test("returns 'whatsNew' if hasSeenWhatsNew is false", () => {
expect(getInitialState("game", true, false)).toBe("whatsNew");
});
- test("returns 'game' if hasVisitedEver and hasVisitedRecently are true and savedDisplay is 'game", () => {
+ test("returns 'game' if hasVisitedEver and hasSeenWhatsNew are true and savedDisplay is 'game", () => {
expect(getInitialState("game", true, true)).toBe("game");
});
- test("returns 'daily' if hasVisitedEver and hasVisitedRecently are true and savedDisplay is 'daily", () => {
+ test("returns 'daily' if hasVisitedEver and hasSeenWhatsNew are true and savedDisplay is 'daily", () => {
expect(getInitialState("daily", true, true)).toBe("daily");
});
- test("returns 'game' if hasVisitedEver and hasVisitedRecently are and savedDisplay is not 'game' or 'daily", () => {
+ test("returns 'game' if hasVisitedEver and hasSeenWhatsNew are and savedDisplay is not 'game' or 'daily", () => {
expect(getInitialState("rules", true, true)).toBe("game");
});
});
diff --git a/src/components/App.js b/src/components/App.js
index 5307b1f..1ef7f39 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -37,9 +37,23 @@ export default function App() {
const [isCustom, seed, numLetters] = parseUrlQuery();
// Determine when the player last visited the game
- // This is used to determine whether to show the rules or an announcement instead of the game
+ // This is used to determine whether to show the rules instead of the game
const hasVisitedEver = hasVisitedSince("crossjigLastVisited", "20240429");
- const hasVisitedRecently = hasVisitedSince("crossjigLastVisited", "20240908");
+
+ const savedHasSeenWhatsNew = JSON.parse(
+ localStorage.getItem("crossjigHasSeenWhatsNew20240909"),
+ );
+
+ const [hasSeenWhatsNew, setHasSeenWhatsNew] = React.useState(
+ savedHasSeenWhatsNew ?? false,
+ );
+
+ React.useEffect(() => {
+ window.localStorage.setItem(
+ "crossjigHasSeenWhatsNew20240909",
+ JSON.stringify(hasSeenWhatsNew),
+ );
+ }, [hasSeenWhatsNew]);
const [lastVisited] = React.useState(getDailySeed());
React.useEffect(() => {
@@ -52,7 +66,7 @@ export default function App() {
// Determine what view to show the user
const savedDisplay = JSON.parse(localStorage.getItem("crossjigDisplay"));
const [display, setDisplay] = React.useState(
- getInitialState(savedDisplay, hasVisitedEver, hasVisitedRecently),
+ getInitialState(savedDisplay, hasVisitedEver, hasSeenWhatsNew),
);
// Determine the opacity for the validity indicator
@@ -202,7 +216,12 @@ export default function App() {
switch (display) {
case "rules":
- return