Как создать две сетки / полки в шаблоне каталога TVML?

Question

Шаблон каталога позволяет создать меню слева и отображать соответствующий контент в правой части экрана.

С помощью приведенного ниже кода я вижу только одну сетку с одной строкой изображений. Если я добавлю еще 20 изображений, все они будут в одном ряду с одним заголовком раздела.

<document>
   <catalogTemplate>
      <banner>
         <title>Movies</title>
      </banner>
      <list>
         <section>
            <listItemLockup>
               <title>All Movies</title>
               <decorationLabel>6</decorationLabel>
               <relatedContent>
                  <grid>
                     <section>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_A.png" width="250" height="376" />
                           <title>Movie 1</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_B.png" width="250" height="376" />
                           <title>Movie 2</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_C.png" width="250" height="376" />
                           <title>Movie 3</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375.png" width="250" height="376" />
                           <title>Movie 4</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_C.png" width="250" height="376" />
                           <title>Movie 5</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375.png" width="250" height="376" />
                           <title>Movie 6</title>
                        </lockup>
                     </section>
                  </grid>
               </relatedContent>
           </listItemLockup>
         </section>
      </list>
   </catalogTemplate>
</document>

Но мне нужны два раздела с разными заголовками. Поэтому я скопировал содержимое сетки и вставил снова.

<document>
   <catalogTemplate>
      <banner>
         <title>Movies</title>
      </banner>
      <list>
         <section>
            <listItemLockup>
               <title>All Movies</title>
               <decorationLabel>6</decorationLabel>
               <relatedContent>
                  <grid>
                     <section>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_A.png" width="250" height="376" />
                           <title>Movie 1</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_B.png" width="250" height="376" />
                           <title>Movie 2</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_C.png" width="250" height="376" />
                           <title>Movie 3</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375.png" width="250" height="376" />
                           <title>Movie 4</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_C.png" width="250" height="376" />
                           <title>Movie 5</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375.png" width="250" height="376" />
                           <title>Movie 6</title>
                        </lockup>
                     </section>
                  </grid>
                  <grid>
                     <section>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_A.png" width="250" height="376" />
                           <title>Movie 1</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_B.png" width="250" height="376" />
                           <title>Movie 2</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_C.png" width="250" height="376" />
                           <title>Movie 3</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375.png" width="250" height="376" />
                           <title>Movie 4</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375_C.png" width="250" height="376" />
                           <title>Movie 5</title>
                        </lockup>
                        <lockup>
                           <img src="path to images on your server/Car_Movie_250x375.png" width="250" height="376" />
                           <title>Movie 6</title>
                        </lockup>
                     </section>
                  </grid>
               </relatedContent>
           </listItemLockup>
         </section>
      </list>
   </catalogTemplate>
</document>

Но он не показывает две сетки с разными рядами изображений. Может ли кто-нибудь помочь мне решить эту проблему? Спасибо.