Merge pull request #28 from jurerotar/develop

feat: added building cancellation feature, added building scheduling feature, refactored test env, added building interface tests

__mocks__/game/player-mock.ts

@@ -1,7 +1,7 @@
 import type { Player } from 'interfaces/models/game/player';
 
 export const playerMock: Player = {
-  id: '42c53448-ab04-4ae3-8ce5-dccad55162a7',
+  id: 'uuid',
   name: 'Player name',
   faction: 'player',
   tribe: 'romans',

__mocks__/game/server-mock.ts

@@ -1,5 +1,5 @@
-import type { Server } from 'interfaces/models/game/server';
 import { serverFactory } from 'app/factories/server-factory';
+import type { Server } from 'interfaces/models/game/server';
 
 const MOCK_SERVER_SEED = '23223ca711';
 const MOCK_SERVER_NAME = 'test server';
@@ -19,6 +19,8 @@ const mockServerConfig: Pick<Server, 'name' | 'seed' | 'configuration' | 'player
 
 export const serverMock: Server = serverFactory(mockServerConfig);
 
+export const serverPathMock = `/game/${serverMock.slug}`;
+
 export const gaulServerMock: Server = {
   ...serverMock,
 };

__mocks__/game/village/village-mock.ts

@@ -7,7 +7,7 @@ const { id: playerId } = playerMock;
 
 export const villageMock: Village = {
   id: '0-0',
-  name: 'player-950bbc85d18046cbc1a87cd58ca03e24f2b0f72e',
+  name: 'player',
   slug: 'v-1',
   coordinates: {
     x: 0,
@@ -17,7 +17,7 @@ export const villageMock: Village = {
   resourceFieldComposition: '4446',
   playerId,
   isCapital: true,
-  lastUpdatedAt: 1703165323113,
+  lastUpdatedAt: Date.now(),
   resources: {
     wood: 750,
     clay: 750,

package.json

@@ -28,7 +28,7 @@
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-hook-form": "7.53.0",
-    "react-i18next": "15.0.1",
+    "react-i18next": "15.0.2",
     "react-icons": "5.3.0",
     "react-modal": "3.16.1",
     "react-router-dom": "6.26.2",
@@ -43,7 +43,7 @@
     "@testing-library/react": "16.0.1",
     "@testing-library/user-event": "14.5.2",
     "@types/node": "22.5.5",
-    "@types/react": "18.3.5",
+    "@types/react": "18.3.7",
     "@types/react-dom": "18.3.0",
     "@types/react-modal": "3.16.3",
     "@types/react-window": "1.8.8",
@@ -57,10 +57,10 @@
     "lint-staged": "15.2.10",
     "postcss": "8.4.47",
     "resize-observer-polyfill": "1.5.1",
-    "sass": "1.78.0",
-    "tailwindcss": "3.4.11",
+    "sass": "1.79.1",
+    "tailwindcss": "3.4.12",
     "typescript": "5.6.2",
-    "vite": "5.4.5",
+    "vite": "5.4.6",
     "vite-bundle-visualizer": "1.2.1",
     "vite-plugin-pwa": "0.20.5",
     "vite-plugin-svgr": "4.2.0",

src/app/[game]/[map]/components/cell.module.scss

@@ -2,9 +2,13 @@
   &-position-#{$position} {
     @include imageSet('#{$resourceBase}/#{$group}/#{$position}');
     @if($hasVariants) {
-      @for $variant from 1 through 3 {
+      @for $variant from 0 through 3 {
         &-variant-#{$variant} {
           $variantPosition: '#{$position}-#{$variant}';
+
+          @if($variant == 0) {
+            $variantPosition: '#{$position}';
+          }
           @include imageSet('#{$resourceBase}/#{$group}/#{$variantPosition}');
         }
       }

src/app/[game]/[village]/[...building-field-id]/components/building-construction.tsx

@@ -64,7 +64,7 @@ const BuildingCategoryPanel: React.FC<BuildingCategoryPanelProps> = ({ buildingC
   const hasNoAvailableBuildings = currentlyAvailableBuildings.length + currentlyUnavailableBuildings.length === 0;
 
   return (
-    <div className="flex flex-col gap-4 pt-4">
+    <div className="flex flex-col gap-4 pt-2">
       {!hasNoAvailableBuildings && (
         <>
           {currentlyAvailableBuildings.length > 0 && (

src/app/[game]/[village]/[...building-field-id]/components/building-details.tsx

@@ -173,12 +173,12 @@ export const BuildingDetails: React.FC = () => {
   const [tabIndex, setTabIndex] = useState<number>(tabNameToIndex[searchParams.get('tab') ?? 'default']);
 
   return (
-    <article className="flex flex-col gap-4 py-2">
+    <article className="flex flex-col gap-2">
       <Tabs
         selectedIndex={tabIndex}
         onSelect={(index) => setTabIndex(index)}
       >
-        <TabList className="flex mb-4 overflow-x-scroll scrollbar-hidden">
+        <TabList className="flex mb-2 overflow-x-scroll scrollbar-hidden">
           <StyledTab>{t('DEFAULT')}</StyledTab>
           {tabs.map((name: string) => (
             <StyledTab key={name}>{t(`${buildingId}.${name}`)}</StyledTab>
@@ -195,7 +195,7 @@ export const BuildingDetails: React.FC = () => {
           </div>
           <Suspense fallback={<>Loading tab</>}>
             {!MainTabAdditionalContent ? null : (
-              <div className="mt-4 border border-gray-500 p-2">
+              <div className="mt-2 border border-gray-500 p-2">
                 <MainTabAdditionalContent />
               </div>
             )}

src/app/[game]/[village]/[...building-field-id]/page.tsx

@@ -13,8 +13,8 @@ export const BuildingPage: React.FC = () => {
   const hasBuilding = !!buildingField;
 
   return (
-    <main className="mt-4 md:mt-24 mx-auto max-w-2xl px-2 lg:px-0">
-      <div className="flex flex-col gap-4">
+    <main className="mt-2 md:mt-24 mx-auto max-w-2xl px-2 lg:px-0 mb-14 lg:mb-0">
+      <div className="flex flex-col gap-2">
         <Backlink />
         {hasBuilding && <BuildingDetails />}
         {!hasBuilding && <BuildingConstruction />}