order detail page

MyFirstBlazor/BlazingPizza/Controllers/OrdersController.cs

@@ -27,6 +27,21 @@ namespace BlazingPizza.Controllers
 			return orders.Select(o => OrderWithStatus.FromOrder(o)).ToList();
 		}
 
+		[HttpGet("{orderId}")]
+		public async Task<ActionResult<OrderWithStatus>> GetOrderWithStatus(int orderId)
+		{
+			var order = await _db.Orders
+				.Where(o => o.OrderId == orderId)
+				.Include(o => o.Pizzas).ThenInclude(p => p.Special)
+				.Include(o => o.Pizzas).ThenInclude(p => p.Toppings).ThenInclude(t => t.Topping)
+				.SingleOrDefaultAsync();
+
+			if (order == null)
+				return NotFound();
+
+			return OrderWithStatus.FromOrder(order);
+        }
+
 		[HttpPost]
 		public async Task<ActionResult<int>> PlaceOrder(Order order)
 		{

MyFirstBlazor/BlazingPizza/Pages/Checkout.razor

@@ -60,6 +60,6 @@
         var newOrderId = await response.Content.ReadFromJsonAsync<int>();
         OrderState.ResetOrder();
 
-        NavigationManager.NavigateTo("/");
+        NavigationManager.NavigateTo($"myorders/{newOrderId}");
     }
 }

MyFirstBlazor/BlazingPizza/Pages/MyOrders.razor

@@ -11,7 +11,7 @@
         <img src="/img/pizza-slice.svg" />
         <div>Get Pizza</div>
     </NavLink>
-    <NavLink class="nav-tab" href="myorders" Match="NavLinkMatch.All">
+    <NavLink class="nav-tab" href="myorders">
         <img src="img/bike.svg" />
         <div>My orders</div>
     </NavLink>
@@ -46,7 +46,7 @@
                     @if (item.StatusText != "Delivered")
                     {
                         <div class="col flex-grow-0">
-                            <a class="btn btn-success" href="myorders/">
+                            <a class="btn btn-success" href="myorders/@item.Order.OrderId">
                                 Track >
                             </a>
                         </div>

MyFirstBlazor/BlazingPizza/Pages/OrderDetail.razor

@@ -0,0 +1,86 @@
+@page "/myorders/{orderId:int}"
+@inject HttpClient HttpClient
+@inject NavigationManager NavigationManager
+
+<div class="top-bar">
+    <a class="logo" href="">
+        <img src="img/logo.svg" />
+    </a>
+
+    <NavLink class="nav-tab" href="" Match="NavLinkMatch.All">
+        <img src="/img/pizza-slice.svg" />
+        <div>Get Pizza</div>
+    </NavLink>
+    <NavLink class="nav-tab" href="myorders">
+        <img src="img/bike.svg" />
+        <div>My orders</div>
+    </NavLink>
+</div>
+
+<div class="main">
+    @if (_invalidOrder)
+    {
+        <h2>Order not found</h2>
+        <p>We're sorry but this order no longer exists.</p>
+    }
+    else if (_orderWithStatus == null)
+    {
+        <div class="track-order">
+            <div class="track-order-title">
+                <h2>
+                    <text>Loading...</text>
+                </h2>
+                <p class="ml-auto mb-0">
+                    ...
+                </p>
+            </div>
+        </div>
+    }
+    else
+    {
+        <div class="track-order">
+            <div class="track-order-title">
+                <h2>
+                    Order placed @_orderWithStatus.Order.CreatedTime.ToLongDateString()
+                </h2>
+                <p class="ml-auto mb-0">
+                    Status: <strong>@_orderWithStatus.StatusText</strong>
+                </p>
+            </div>
+            <div class="track-order-body">
+                <div class="track-order-details">
+                    @foreach (var pizza in _orderWithStatus.Order.Pizzas)
+                    {
+                        <p>
+                            <strong>
+                                @(pizza.Size)'
+                                @pizza.Special.Name
+                                (£@pizza.GetFormattedTotalPrice())
+                            </strong>
+                        </p>
+                    }
+                </div>
+            </div>
+        </div>
+    }
+</div>
+
+@code {
+    [Parameter] public int OrderId { get; set; }
+
+    OrderWithStatus _orderWithStatus;
+    bool _invalidOrder = false;
+
+    protected override async Task OnParametersSetAsync()
+    {
+        try
+        {
+            _orderWithStatus = await HttpClient.GetFromJsonAsync<OrderWithStatus>($"{NavigationManager.BaseUri}orders/{OrderId}");
+        }
+        catch (Exception ex)
+        {
+            _invalidOrder = true;
+            Console.Error.WriteLine(ex);
+        }
+    }
+}