added store route

backend/entities/game.ts

@@ -54,7 +54,7 @@ const expandBoard = (serverGame: ServerGame) => {
   }
   // Expand the board by the current board size 8x8 -> 16x8
   if (dir === "down") {
-    const newHeight = Math.floor(Math.min(height + 6, height * 1.5));
+    const newHeight = Math.floor(Math.min(height + 7, height * 1.5));
     const newWidth = width;
     const newMinesCount = Math.floor(
       width * height * 0.5 * (0.2 + 0.0015 * stage),
@@ -112,7 +112,7 @@ const expandBoard = (serverGame: ServerGame) => {
     });
   }
   if (dir === "right") {
-    const newWidth = Math.floor(Math.min(width + 6, width * 1.5));
+    const newWidth = Math.floor(Math.min(width + 7, width * 1.5));
     const newHeight = height;
     const newMinesCount = Math.floor(
       width * height * 0.5 * (0.2 + 0.0015 * stage),

src/Shell.tsx

@@ -9,6 +9,7 @@ import {
   Menu,
   Play,
   Settings,
+  Store,
 } from "lucide-react";
 import Hr from "./components/Hr";
 import NavLink from "./components/NavLink";
@@ -75,6 +76,10 @@ const Shell: React.FC<PropsWithChildren> = ({ children }) => {
             <History />
             History
           </NavLink>
+          <NavLink href="/store">
+            <Store />
+            Store
+          </NavLink>
           <NavLink href="/collection">
             <Library />
             Collection <Tag size="sm">NEW</Tag>

src/main.tsx

@@ -13,6 +13,7 @@ import Settings from "./views/settings/Settings.tsx";
 import MatchHistory from "./views/match-history/MatchHistory.tsx";
 import Collection from "./views/collection/Collection.tsx";
 import { AnimatePresence } from "framer-motion";
+import Store from "./views/store/Store.tsx";
 
 const setup = async () => {
   const token = localStorage.getItem("loginToken");
@@ -42,6 +43,7 @@ setup().then(() => {
               <Route path="/history" component={MatchHistory} />
               <Route path="/settings" component={Settings} />
               <Route path="/collection" component={Collection} />
+              <Route path="/store" component={Store} />
             </Switch>
           </AnimatePresence>
         </Shell>

src/views/store/Store.tsx

@@ -0,0 +1,14 @@
+const Store = () => {
+  return (
+    <div className="flex flex-col gap-4 w-full">
+      <h2 className="text-white/90 text-xl">Store</h2>
+      <div className="flex flex-row gap-y-6 gap-x-8 items-center w-full flex-wrap justify-center mb-10">
+        <div className="flex flex-col gap-4 justify-between">
+          <h3 className="text-white/90 text-lg">Lootboxes</h3>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default Store;