diff --git a/docs/DeveloperGuide.md b/docs/DeveloperGuide.md
index 074a65a750..6f96975ede 100644
--- a/docs/DeveloperGuide.md
+++ b/docs/DeveloperGuide.md
@@ -51,7 +51,7 @@ Command back to the main based on the command type. The Final step is to call th
 is the type of `fightCommand`, we will call the execute function with one parameter `Scanner`. For all other
 conditions, we will call the execute function with no parameter.
 
-### Map Component
+### Map Component: Overview
 
 The API of this component is defined in BaseMap.java.
 
@@ -76,6 +76,26 @@ an `Enemy` is interacted with and the [FIGHT] command is used, the `enableFight`
 also applies for the Shop. `enableFight` is another game loop that handles all the user - Enemy or user - ShopKeeper
 interactions. 
 
+### Map Component: ShopMap Class
+
+The API of this class is defined in ShopMap.java.
+
+There exists only 1 shop at any given time during gameplay. During an interaction with the shop. A new separate gameloop
+ will execute. This comes from the execution of `enableFight`. Below is the diagram that displays how the `enableFight`
+method works.
+
+![ShopMap](https://raw.githubusercontent.com/AY2324S2-CS2113-W12-3/tp/master/picture/ShopMap.png)
+
+This is the general flow of `enableFight`.
+
+1. Enter game loop.
+2. Print player status, the shopkeeper and the text box.
+3. Get a command from the user.
+4. if a valid purchase is detected the purchase is processed.
+5. push dialogue to the text box.
+6. repeat until the command given is "exit".
+
+
 ### Interacting with Environment Component
 
 The API of this component is defined in InteractingCommand.java
diff --git a/docs/diagrams/ShopMap.puml b/docs/diagrams/ShopMap.puml
index 24c0d96d75..c5dbc22794 100644
--- a/docs/diagrams/ShopMap.puml
+++ b/docs/diagrams/ShopMap.puml
@@ -1,33 +1,42 @@
-
 @startuml
-hide circle
-class ShopMap {
-    - currentPlayer : PlayerStatus
-    - currentTextBox : TextBox
-    - currentEntity : ShopKeeper
-    + ShopMap(player : PlayerStatus, text : TextBox, shopKeeper : ShopKeeper)
-    + initMap(givenWidth : int, givenHeight : int) : void
-    + queueTextBox() : void
-    + enableFight() : void
-    + getEntityDeath() : boolean
-    + getPlayerDeath() : boolean
-    + handleDeath() : void
-    + handleLootingByPlayer() : void
-}
+actor Player
+participant "ShopMap" as Shop
+participant "Ui" as UI
+participant "TextBox" as TextBox
+participant "Scanner" as Scanner
+
+Player -> Shop : enableFight(Scanner)
+activate Shop
 
-class PlayerStatus {
-}
+Shop -> TextBox : queueTextBox()
+activate TextBox
+TextBox -> TextBox : setNextNarration("You are greeted...")
+TextBox -> TextBox : setNextDialogue(currentEntity.getDefaultMessage() + formatShop())
+TextBox -> TextBox : setNextInstruction("Give the shopkeeper...")
+deactivate TextBox
 
-class TextBox {
-}
+loop while answerCommand != "exit"
+    Shop -> UI : printPlayerStatus(currentPlayer)
+    Shop -> UI : printShopKeeper(currentEntity)
+    Shop -> UI : printTextBox(currentTextBox)
+    UI -> Player : await command
+    Player -> Scanner : answerCommand = in.nextLine().trim()
+    Scanner -> Shop
 
-class ShopKeeper {
-}
+    alt if answerCommand matches "\\d+"
+        Shop -> Shop : processPurchase(answerCommand)
+    else if answerCommand == "run"
+        TextBox -> TextBox : setNextError("Invalid command...")
+    else
+        TextBox -> TextBox : setNextError("Invalid command...")
+    end if
 
-ShopMap --> PlayerStatus : -currentPlayer
-ShopMap --> TextBox : -currentTextBox
-ShopMap --> ShopKeeper : -currentEntity
+    Shop -> TextBox : prepareNextDialogue()
+    TextBox -> Player : Display updated dialogue/instruction
+end
 
+Shop -> TextBox : clearAll()
+TextBox -> TextBox : setNextNarration("You exited the shop!!")
+deactivate Shop
 @enduml
 
-@enduml
\ No newline at end of file
diff --git a/picture/Map.png b/picture/Map.png
index e465bc0f65..4723146448 100644
Binary files a/picture/Map.png and b/picture/Map.png differ
diff --git a/picture/ShopMap.png b/picture/ShopMap.png
new file mode 100644
index 0000000000..894c79f20f
Binary files /dev/null and b/picture/ShopMap.png differ
diff --git a/src/main/java/map/BattleInterface/BattleInterface.java b/src/main/java/map/BattleInterface/BattleInterface.java
index a1cd8d6d8a..75bba40708 100644
--- a/src/main/java/map/BattleInterface/BattleInterface.java
+++ b/src/main/java/map/BattleInterface/BattleInterface.java
@@ -60,7 +60,8 @@ public void enableFight(Scanner in) {
             }
             answer = Integer.parseInt(answerCommand); // Parse the possibly truncated input
             if (mathQuestion.checkAns(answer)) {
-                currentTextBox.setNextDialogue("You got the question CORRECT. You then proceed to swing as hard as you can");
+                currentTextBox.setNextDialogue("You got the question CORRECT. You then proceed to swing as " +
+                        "hard as you can");
                 playerHitEnemy();
                 difficulty += 1;
             } else {
diff --git a/src/main/java/map/ShopMap.java b/src/main/java/map/ShopMap.java
index 672dbbb2eb..15a99d02ad 100644
--- a/src/main/java/map/ShopMap.java
+++ b/src/main/java/map/ShopMap.java
@@ -47,7 +47,7 @@ public void queueTextBox(){
         currentTextBox.setNextNarration("You are greeted by a cat with oddly small eyes.\n");
         currentTextBox.setNextDialogue(currentEntity.getDefaultMessage() + "\n" + currentEntity.formatShop());
         currentTextBox.setNextInstruction("Give the shop keeper an [INDEX] to view the item and purchase" +
-                " or enter [exit] or [run]" +
+                " or enter [exit]" +
                 " to leave the shop.");
     }