inetraction stuff

src/app/pages/interactions/interactions.component.html

@@ -1,3 +1,4 @@
+@let shownMenu = interactionMenuState();
 <div class="flex flex-col h-[100vh]">
   <div class="min-h-56 h-2/3 max-h-2/3">
     @if (chibi()) {
@@ -12,11 +13,26 @@
       </div>
     }
   </div>
-  <div class="h-1/3 min-h-20 bg-primary-300">
-    <ff-food-pantry></ff-food-pantry>
-    <ff-inventory></ff-inventory>
-    <ff-button (click)="interact(EChibiInteraction.WakeUp)">{{
-      lang.game.actions.wakeUp
-    }}</ff-button>
+  <div class="h-1/3 min-h-20 bg-primary-300 relative">
+    @if (shownMenu == EInteractionMenuState.Pantry) {
+      <ff-food-pantry
+        (onClose)="closeMenu()"
+        (onFoodChosen)="interact(EChibiInteraction.Feed, $event)"
+      ></ff-food-pantry>
+    }
+    @if (shownMenu == EInteractionMenuState.Inventory) {
+      <ff-inventory (onClose)="closeMenu()"></ff-inventory>
+    }
+    <div class="flex flex-row gap-5 py-4 container mx-auto">
+      <ff-button (click)="openInventory()">{{
+        lang.game.actions.giveItem
+      }}</ff-button>
+      <ff-button (click)="openFoodPantry()">{{
+        lang.game.actions.feed
+      }}</ff-button>
+      <ff-button (click)="interact(EChibiInteraction.WakeUp)">{{
+        lang.game.actions.wakeUp
+      }}</ff-button>
+    </div>
   </div>
 </div>