Adding new item to database using ASP.NET Core MVC - asp.net-core-mvc

Question

I'm building a Pet Shop website using ASP.NET Core MVC (the latest version).
I have database with instructions for primary key and identity(1,1) (auto increment).
In my website,in order to check and see if my 'Create' method is working, I've created a page (a controller and view) of Create new animal and a page for the list of all the animals that I've got (Index controller). After clicking Submit on the create page, it's redirected to Index - where I should see the animal that I've added (this line wrote on SQL):
The problem is that I don't see anything added to my list (the photo above). After a few tries, I've tried to add animal directly in my SQL and I saw that it's got the number ID 22 - meaning that maybe I did succeeded to add new animal and I just don't see it?
I really don't know where my problem is and I would be happy to get help.
Controller:
public async Task<IActionResult> Index()
{
var petShopDataContext = _context.Animals.Include(a => a.Category);
return View(await petShopDataContext.ToListAsync());
}
public async Task<IActionResult> CreateAnimal()
{
var categories = await _categoryService.GetAnimalCategory();
ViewBag.Categories = categories.Select(c => new SelectListItem(c.Name, c.CategoryId.ToString())).ToList();
return View();
}
public async Task<IActionResult> CreateAnimal([FromForm] CreateAnimalViewModel vm)
{
vm.Animal.Category = await _categoryService.GetAsync(vm.Animal.CategoryId);
_animalService.AddAnimalAsync(vm.Animal, vm.Photo);
return RedirectToAction("Index");
}
CreateAnimalViewModel:
public class CreateAnimalViewModel
{
public Animal Animal { get; set; }
public IFormFile Photo { get; set; }
}
Create Animal View:
#model PetShop.Client.Models.CreateAnimalViewModel
#{
ViewBag.Title = "CreateAnimal";
}
<h4>Create New Animal</h4>
<hr />
<div class="row">
<div class="col-md-4">
<form asp-action="CreateAnimal" enctype="multipart/form-data" method="post">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
<label asp-for="Animal.Name" class="control-label"></label>
<input asp-for="Animal.Name" class="form-control" />
<span asp-validation-for="Animal.Name" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Animal.BirthDate" class="control-label"></label>
<input asp-for="Animal.BirthDate" class="form-control" />
<span asp-validation-for="Animal.BirthDate" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Animal.Description" class="control-label"></label>
<input asp-for="Animal.Description" class="form-control" />
<span asp-validation-for="Animal.Description" class="text-danger"></span>
</div>
<div class="form-group">
<label asp-for="Animal.Category">Category</label>
<select asp-for="Animal.CategoryId" asp-items="ViewBag.Categories" class ="form-control" id="category"></select>
<span asp-validation-for="Animal.CategoryId" />
<a asp-controller="Admin" asp-action="CreateCategory">
<input type="button" value="Add new category"/>
</a>
</div>
<div class="form-group">
<label asp-for="Photo" class="control-label"></label>
<input type="file" asp-for="Photo" accept="image/*" class="form-control-file"/>
<span asp-validation-for="Photo" class="text-danger"></span>
</div>
<div class="form-group">
<input type="submit" value="Create" class="btn btn-primary" />
</div>
</form>
</div>
</div>
Index View:
#model IEnumerable<PetShop.Data.Models.Animal>
#{
ViewBag.Title = "Index";
}
<h1>Index</h1>
<p>
<a asp-action="CreateAnimal">Create New</a>
</p>
<table class="table">
<thead>
<tr>
<th>
#Html.DisplayNameFor(model => model.Name)
</th>
<th>
#Html.DisplayNameFor(model => model.BirthDate)
</th>
<th>
#Html.DisplayNameFor(model => model.Description)
</th>
<th>
#Html.DisplayNameFor(model => model.PhotoUrl)
</th>
<th>
#Html.DisplayNameFor(model => model.Category)
</th>
<th></th>
</tr>
</thead>
<tbody>
#foreach (var item in Model) {
<tr>
<td>
#Html.DisplayFor(modelItem => item.Name)
</td>
<td>
#Html.DisplayFor(modelItem => item.BirthDate)
</td>
<td>
#Html.DisplayFor(modelItem => item.Description)
</td>
<td>
#Html.DisplayFor(modelItem => item.PhotoUrl)
</td>
<td>
#Html.DisplayFor(modelItem => item.Category.Name)
</td>
<td>
<a asp-action="Edit" asp-route-id="#item.AnimalId">Edit</a> |
<a asp-action="Details" asp-route-id="#item.AnimalId">Details</a> |
<a asp-action="Delete" asp-route-id="#item.AnimalId">Delete</a>
</td>
</tr>
}
</tbody>
</table>
Animal Service:
public async Task<Animal> AddAnimalAsync(Animal animal, IFormFile image)
{
var entity = _animalRepository.Add(animal);
var path = await _imageService.UploadImage(image, animal);
if (path != String.Empty)
{
return _animalRepository.Update(entity);
}
return entity;
}
Animal Repository:
public Animal Add(Animal entity)
{
_context.Animals.Add(entity);
_context.SaveChanges();
return entity;
}