Working with the Project and Adding New Features using Visual Studio for Mac

New Feature: Track My Order

Let's add a new feature to the site that will allow authenticated users to view the current status of their orders. Orders should display their status on the Orders page, which should have the following options:

• Pending
• Out for Delivery
• Delivered

The current version of the application lists "Pending" for every order - it's hard coded in the OrderController class for both the My Orders list action and the order details action.

The My Orders action should simply list the correct status. The details page should display the status as well as a (simply calculated from order date) estimate of when the order will be delivered. Delivered orders should display the (calculated) date when they were delivered.

Update the UI

We can start on this feature from either end, working from the domain model first or from the UI first. In this case, since there's not much domain logic involved and the UI is pretty straightforward, let's start with the UI.

The My Orders page should display the current order status of each order, and should link to the order details page. This is already done, so there's nothing we need to change in MyOrders.cshtml.

(screenshot)

The Order Details page currently just displays the order status, but not delivery estimate or actual delivery time information. The view uses this markup to display the status:

<section class="esh-orders-detail-item col-xs-3">@Model.Status</section>

In this scenario, we can add the date information directly to the model, so that when it displays it's something like this:

Out for Delivery - ETA 1645
or
Delivered today at 1645

It's best to minimize logic in views and viewmodels, so we'll add the logic for these messages to the controller for now. Since all we have to work with at the moment is hard-coded status strings, we can create a simple helper method that uses a string as input, like this one:

private string GetDetailedStatus(string status)
{
    if (status == "Pending") return status;
    if (status == "Out for Delivery")
    {
        return $"{status} - ETA {DateTime.Now.AddHours(1).ToShortTimeString()}";
    }
    if (status == "Delivered")
    {
        return $"{status} at {DateTime.Now.AddHours(-1).ToShortTimeString()}";
    }
    return "Unknown";
}

Now all we need to do is replace the place were Status is being set in the viewmodel in the Detail action with a call to this method:

        Status = GetDetailedStatus("Delivered"),

Now we can test the UI and verify our message displays as we expect:

(screenshot)

Update the Model

In order to populate the ViewModel, we'll need to get the order status information from our domain model. So, we'll add that information. Go to the Order class in ApplicationCore - Entities - OrderAggregate, and add a new string property, Status. We can tie this to an enum or a separate entity in a future update, but for now we'll just use a string.

        public string Status { get; private set; }

Update the Database

Since we're using the EF Core InMemory database, we don't need to update the database just yet. When we're ready to test this with a real database, or before going to production, we would add new migrations using the instructions in the project README and then call dotnet ef database update with the appropriate arguments to apply the changes.