A simple nested views from a menu

I have a simple app structure that looks like below and I want to make a menu that will navigate between these folders.

     - About
     - Pets
        - Details
        - Share
  - User
        - Details
        - AccountSettings
        - Other
  - Adopt

I can arrive to the first directory as in User/ but I can’t navigate to the
sub-directory. I am missing something with routing or maybe menuContent should not be used? I

  angular.module('app.pets', [

  .config(function($stateProvider, $urlRouterProvider) {
      .state('app.pet-index', {
         url: '/pets',
         views: {
         'menuContent': {
              templateUrl: 'app/pets/pets.html',
              controller: 'PetIndexCtrl'

     .controller('PetIndexCtrl', function($scope, PetService) {
        $scope.pets = PetService.all();