diff --git a/templates/web/prod/WorkZone/Browser/Basket.html.twig b/templates/web/prod/WorkZone/Browser/Basket.html.twig
new file mode 100644
index 0000000000..65ef32fa33
--- /dev/null
+++ b/templates/web/prod/WorkZone/Browser/Basket.html.twig
@@ -0,0 +1,48 @@
+<div class="PNB">
+  <div class="PNB header" style="height:40px;bottom:auto;">
+    <table>
+      <tr>
+        <td>
+          <a href="#" class="back">
+            <img src="/skins/prod/Basket/Browser/BASKET_LIST.png"/> 
+            {% trans 'Back to basket list' %}
+          </a>
+        </td>
+        <td>
+          <h1 class="title">
+            <img class="loader" src="/skins/prod/Basket/Browser/loader.gif" />
+            <a href="/prod/baskets/{{ Basket.getId() }}/archive/?archive=1" class="archiver archive_toggler" style="display:{{ Basket.getArchived ? 'none' : '' }};">
+              <span>
+                <img src="/skins/prod/Basket/Browser/archive.png"/>
+              </span>
+            </a>
+            <a href="/prod/baskets/{{ Basket.getId() }}/archive/?archive=0" class="unarchiver archive_toggler" style="display:{{ Basket.getArchived ? '' : 'none' }};">
+              <span>
+                <img src="/skins/prod/Basket/Browser/archived.png"/>
+              </span>
+            </a>
+            <a class="basket_link" href="/prod/WorkZone/Browse/Basket/{{ Basket.getId() }}/">
+              {{ Basket.getName() }}
+            </a>
+          </h1>
+        </td>
+      </tr>
+    </table>
+  </div>
+  <div class="PNB" style="top:40px;bottom:auto;height:160px;">
+  
+  </div>
+  <div class="PNB" style="height:40px;bottom:auto;top:200px;">
+    {% set ElementsCount = Basket.getElements().count() %}
+    {% if ElementsCount == 0 %}
+      {% trans 'No records' %}
+    {% elseif ElementsCount == 1 %}
+      {% trans '1 record' %}
+    {% else %}
+      {% trans %}{{ ElementsCount }} records{% endtrans %}
+    {% endif %}
+  </div>
+  <div class="PNB" style="top:240px;">
+    
+  </div>
+</div>
\ No newline at end of file
diff --git a/templates/web/prod/WorkZone/Browser/Browser.html.twig b/templates/web/prod/WorkZone/Browser/Browser.html.twig
new file mode 100644
index 0000000000..c97ab68517
--- /dev/null
+++ b/templates/web/prod/WorkZone/Browser/Browser.html.twig
@@ -0,0 +1,236 @@
+
+<div class="PNB" id="BasketBrowser">
+  <div class="PNB10 Browser">
+    <div class="PNB10" style="width:190px;right:auto;">
+      <form name="BasketBrowser" method="GET" action="/prod/WorkZone/Browse/Search/">
+        <input name="Query" class="Query" placeholder="{% trans 'Search baskets' %}" type="text"/>
+      
+        <h1>{% trans 'See' %}</h1>
+        <ul>
+          <li class="first">
+            <input id="basket_browse_all" type="radio" name="Type" value="" checked="checked" />
+            <label for="basket_browse_all">
+              {% trans 'All' %}
+            </label>
+          </li>
+          <li>
+            <input id="basket_browse_my_bask" type="radio" name="Type" value="{{ constant('\\Repositories\\BasketRepository::MYBASKETS') }}" />
+            <label for="basket_browse_my_bask">
+              {% trans 'My baskets' %}
+            </label>
+          </li>
+          <li>
+            <input id="basket_browse_received" type="radio" name="Type" value="{{ constant('\\Repositories\\BasketRepository::RECEIVED') }}" />
+            <label for="basket_browse_received">
+              {% trans 'Received baskets' %}
+            </label>
+          </li>
+          <li>
+            <input id="basket_browse_valid_sent" type="radio" name="Type" value="{{ constant('\\Repositories\\BasketRepository::VALIDATION_SENT') }}" />
+            <label for="basket_browse_valid_sent">
+              {% trans 'Validations sent' %}
+            </label>
+          </li>
+          <li>
+            <input id="basket_browse_valid_done" type="radio" name="Type" value="{{ constant('\\Repositories\\BasketRepository::VALIDATION_DONE') }}" />
+            <label for="basket_browse_valid_done">
+              {% trans 'Validations received' %}
+            </label>
+          </li>
+        </ul>
+        <h1>{% trans 'When' %}</h1>
+        <ul>
+          <li class="first">
+            <input id="basket_browse_all_time" type="radio" name="Year" value="" checked="checked" />
+            <label for="basket_browse_all_time">
+              {% trans 'Any time' %}
+            </label>
+          </li>
+          <li>
+            <input id="basket_browse_this_year" type="radio" name="Year" value="{{ CurrentYear }}" />
+            <label for="basket_browse_this_year">
+              {% trans 'This year' %}
+            </label>
+          </li>
+          {% set CurrentYear = CurrentYear - 1 %}
+          <li>
+            <input id="basket_browse_last_year" type="radio" name="Year" value="{{ CurrentYear }}" />
+            <label for="basket_browse_last_year">
+              {% trans 'Past year' %}
+            </label>
+          </li>
+          {% set CurrentYear = CurrentYear - 1 %}
+          <li>
+            <input id="basket_browse_year{{ CurrentYear }}" type="radio" name="Year" value="{{ CurrentYear }}" />
+            <label for="basket_browse_year{{ CurrentYear }}">
+              {{ CurrentYear }}
+            </label>
+          </li>
+          {% set CurrentYear = CurrentYear - 1 %}
+          <li>
+            <input id="basket_browse_year{{ CurrentYear }}" type="radio" name="Year" value="{{ CurrentYear }}" />
+            <label for="basket_browse_year{{ CurrentYear }}">
+              {{ CurrentYear }}
+            </label>
+          </li>
+        </ul>
+      </form>
+
+    </div>
+    <div class="PNB results" style="left:220px;">
+    </div>
+  </div>
+  <div class="PNB10 Basket">
+  </div>
+</div>
+<script type="text/javascript">
+  $(document).ready(function(){
+    
+    var $container = $('#BasketBrowser'),results = null;
+    
+    function loadResults(datas, url)
+    {
+      results = $.ajax({
+        type: 'GET',
+        url: url,
+        dataType: 'html',
+        data: datas,
+        beforeSend: function(){
+          if(results && results.abort && typeof results.abort == 'function')
+            results.abort();
+          $('.results', $container).addClass('loading').empty();
+        },
+        error: function(){
+          $('.results', $container).removeClass('loading');
+        },
+        timeout: function(){
+          $('.results', $container).removeClass('loading');
+        },
+        success: function(data){
+          var results = $('.results', $container);
+          results.removeClass('loading').append(data);
+          activateLinks(results);
+          
+          return;
+        }
+
+      });
+    }
+    
+    
+    function loadBasket(url)
+    {
+      results = $.ajax({
+        type: 'GET',
+        url: url,
+        dataType: 'html',
+        beforeSend: function(){
+          if(results && results.abort && typeof results.abort == 'function')
+            results.abort();
+          $('.Browser', $container).hide();
+          $('.Basket', $container).addClass('loading').empty().show();
+        },
+        error: function(){
+          $('.Browser', $container).show();
+          $('.Basket', $container).removeClass('loading').hide();
+        },
+        timeout: function(){
+          $('.Browser', $container).show();
+          $('.Basket', $container).removeClass('loading').hide();
+        },
+        success: function(data){
+          $('.Basket', $container).removeClass('loading').append(data);
+          
+          $('.Basket a.back', $container).bind('click', function(){
+            $('.Basket', $container).hide();
+            $('.Browser', $container).show();
+
+            return false;
+          });
+          return;
+        }
+
+      });
+    }
+    
+    function activateLinks($scope)
+    {
+      
+      
+      $('a.result', $scope).bind('click', function(){
+        var $this = $(this);
+
+        loadResults({}, $this.attr('href'));
+
+        return false;
+      });
+      
+      $('a.basket_link', $scope).bind('click', function(){
+        var $this = $(this);
+
+        loadBasket($this.attr('href'));
+
+        return false;
+      });
+    
+      $('a.archive_toggler', $scope).bind('click', function(){
+          var $this = $(this), parent = $this.parent();
+
+          $.ajax({
+            type: 'POST',
+            url: $this.attr('href'),
+            dataType: 'json',
+            beforeSend: function(){
+              $('.loader',parent).show();
+              $('.archive_toggler:visible', parent).addClass('last_act').hide();
+            },
+            error: function(){
+              $('.loader',parent).hide();
+              $('.last_act', parent).removeClass('last_act').show();
+            },
+            timeout: function(){
+              $('.loader',parent).hide();
+              $('.last_act', parent).removeClass('last_act').show();
+            },
+            success: function(data){
+              $('.loader',parent).hide();
+              $('.last_act', parent).removeClass('last_act');
+              if(!data.success)
+              {
+                humane.error(data.message);
+                return;
+              }
+              if(data.archive === true)
+              {
+                $('.unarchiver', parent).show();
+                $('.archiver', parent).hide();
+              }
+              else
+              {
+                $('.unarchiver', parent).hide();
+                $('.archiver', parent).show();
+              }
+            
+              p4.WorkZone.refresh();
+              return;
+            }
+
+          });
+
+        return false;
+      });
+    }
+    
+    $('form[name="BasketBrowser"]', $container).bind('submit', function(){
+      
+      var $this = $(this);
+      
+      loadResults($this.serializeArray(), $this.attr('action'));
+    
+      return false;
+    }).trigger('submit').find('input').bind('change', function(){
+      $('form[name="BasketBrowser"]', $container).trigger('submit')
+    });
+    
+  });
+</script>
\ No newline at end of file
diff --git a/templates/web/prod/WorkZone/Browser/Results.html.twig b/templates/web/prod/WorkZone/Browser/Results.html.twig
new file mode 100644
index 0000000000..51eab8e7fc
--- /dev/null
+++ b/templates/web/prod/WorkZone/Browser/Results.html.twig
@@ -0,0 +1,131 @@
+{% import 'common/thumbnail.html' as thumbnail %}
+
+<div class="PNB header">
+  <table>
+    <tr>
+      <td>
+        {% if Total == 0 %}
+          {% trans 'No results' %}
+        {% elseif Total == 1 %}
+          {% trans '1 result' %}
+        {% else %}
+          {% trans %}{{ Total }} results{% endtrans %}
+        {% endif %}
+      </td>
+      <td class="paginator">
+        {% if Page - 1  > 0 %}
+        <a href="/prod/WorkZone/Browse/Search/?Query={{ Query }}&Year={{ Year }}&Type={{ Type }}&Page={{ Page - 1 }}" class="result">
+          <img src="/skins/prod/Basket/Browser/left.png" />
+        </a>
+        {% endif %}
+        <span>
+          Page {{ Page }} / {{ MaxPage }} 
+        </span>
+        {% if Page + 1  <= MaxPage %}
+        <a href="/prod/WorkZone/Browse/Search/?Query={{ Query }}&Year={{ Year }}&Type={{ Type }}&Page={{ Page + 1 }}" class="result">
+          <img src="/skins/prod/Basket/Browser/right.png" />
+        </a>
+        {% endif %}
+      </td>
+    </tr>
+  </table>
+</div>
+<div class="PNB datas">
+  <div class="PNB" style="right:10px">
+  {% for Basket in Baskets %}
+    <div class="result {% if loop.index is odd %}odd{% endif %}">
+      <div class="PNB10">
+        <table>
+          <tr>
+            <td class="thumbnail">
+              {% set BasketElement = Basket.getElements().first() %}
+              {% if BasketElement %}
+                {{thumbnail.format(BasketElement.getRecord().get_thumbnail(), 80, 80, '', session, true)}}
+              {% endif %}
+              <div class="counter">
+                 {{ Basket.getElements().count() }}
+              </div>
+            </td>
+            <td class="content">
+              <h1 class="title">
+                <img class="loader" src="/skins/prod/Basket/Browser/loader.gif" />
+                <a href="/prod/baskets/{{ Basket.getId() }}/archive/?archive=1" class="archiver archive_toggler" style="display:{{ Basket.getArchived ? 'none' : '' }};">
+                  <span>
+                    <img src="/skins/prod/Basket/Browser/archive.png"/>
+                  </span>
+                </a>
+                <a href="/prod/baskets/{{ Basket.getId() }}/archive/?archive=0" class="unarchiver archive_toggler" style="display:{{ Basket.getArchived ? '' : 'none' }};">
+                  <span>
+                    <img src="/skins/prod/Basket/Browser/archived.png"/>
+                  </span>
+                </a>
+                <a class="basket_link" href="/prod/WorkZone/Browse/Basket/{{ Basket.getId() }}/">
+                  {{ Basket.getName() }}
+                </a>
+              </h1>
+                
+              {% if Basket.getPusher() %}
+              <p>
+                {% set user_name = '<a href="/prod/tooltip/user/' ~ Basket.getPusher().get_id() ~ '/" class="userTips">' ~ Basket.getPusher().get_display_name() ~ '</a>' %}
+                {% trans %}
+                  Received from {{ user_name }}
+                {% endtrans %}
+              </p>
+              {% endif %}
+              
+              
+              {% if Basket.getValidation() %}
+              <p>
+                {% set list_participants = '' %}
+                {% for Participant in Basket.getValidation().getParticipants() %}
+                  {% set list_participants = list_participants ~ '<a href="/user/{{ Participant.getUser().get_id() }}/">
+                    {{ Participant.getUser().get_display_name }}
+                  </a>' %}
+                {% endfor %}
+                {% trans %}
+                  Sent for validation to {{ list_participants }}
+                {% endtrans %}
+              </p>
+              {% endif %}
+            
+            </td>
+            <td>
+
+            </td>
+          </tr>
+        </table>
+      </div>
+    </div>
+    {% endfor %}
+    </div>
+  </div>
+  <div class="PNB footer">
+    <table>
+      <tr>
+        <td>
+          {% if Total == 0 %}
+            {% trans 'No results' %}
+          {% elseif Total == 1 %}
+            {% trans '1 result' %}
+          {% else %}
+            {% trans %}{{ Total }} results{% endtrans %}
+          {% endif %}
+        </td>
+        <td class="paginator">
+          {% if Page - 1  > 0 %}
+          <a href="/prod/WorkZone/Browse/Search/?Query={{ Query }}&Year={{ Year }}&Type={{ Type }}&Page={{ Page - 1 }}" class="result">
+            <img src="/skins/prod/Basket/Browser/left.png" />
+          </a>
+          {% endif %}
+          <span>
+            Page {{ Page }} / {{ MaxPage }} 
+          </span>
+          {% if Page + 1  <= MaxPage %}
+          <a href="/prod/WorkZone/Browse/Search/?Query={{ Query }}&Year={{ Year }}&Type={{ Type }}&Page={{ Page + 1 }}" class="result">
+            <img src="/skins/prod/Basket/Browser/right.png" />
+          </a>
+          {% endif %}
+        </td>
+      </tr>
+    </table>
+  </div>
\ No newline at end of file