diff --git a/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/OrderCRUDController.java b/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/OrderCRUDController.java
index c408b3e1b..2e29099c5 100644
--- a/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/OrderCRUDController.java
+++ b/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/OrderCRUDController.java
@@ -41,6 +41,7 @@ import org.navalplanner.web.common.Level;
 import org.navalplanner.web.common.MessagesForUser;
 import org.navalplanner.web.common.OnlyOneVisible;
 import org.navalplanner.web.common.Util;
+import org.navalplanner.web.orders.components.TreeComponent;
 import org.navalplanner.web.planner.order.IOrderPlanningGate;
 import org.navalplanner.web.users.OrderAuthorizationController;
 import org.springframework.beans.factory.annotation.Autowired;
@@ -173,9 +174,10 @@ public class OrderCRUDController extends GenericForwardComposer {
 
     private void setupOrderElementTreeController(Component comp,
             OrderElementController orderElementController) throws Exception {
-        OrderElementTreeController controller = new OrderElementTreeController(
-                orderModel, orderElementController);
-        controller.doAfterCompose(editWindow.getFellowIfAny("orderElementTree"));
+        TreeComponent orderElementsTree = (TreeComponent) editWindow
+                .getFellow("orderElementTree");
+        orderElementsTree.useController(new OrderElementTreeController(
+                orderModel, orderElementController));
     }
 
     private IOrderElementModel getOrderElementModel() {
@@ -404,8 +406,9 @@ public class OrderCRUDController extends GenericForwardComposer {
     }
 
     private void clearEditWindow() {
-        OrderElementTreeController controller = (OrderElementTreeController) editWindow.getVariable("orderElementTreeController", true);
-        controller.clear();
+        TreeComponent treeComponent = (TreeComponent) editWindow
+                .getFellow("orderElementTree");
+        treeComponent.clear();
     }
 
     public void goToCreateForm() {
diff --git a/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/OrderElementTreeController.java b/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/OrderElementTreeController.java
index 26c1846f2..198aee67c 100644
--- a/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/OrderElementTreeController.java
+++ b/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/OrderElementTreeController.java
@@ -293,7 +293,6 @@ public class OrderElementTreeController extends GenericForwardComposer {
     public void doAfterCompose(Component comp) throws Exception {
         super.doAfterCompose(comp);
         messagesForUser = new MessagesForUser(messagesContainer);
-        comp.setVariable("orderElementTreeController", this, true);
     }
 
     public class OrderElementTreeitemRenderer implements TreeitemRenderer,
diff --git a/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/components/TreeComponent.java b/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/components/TreeComponent.java
new file mode 100644
index 000000000..559a7e78c
--- /dev/null
+++ b/navalplanner-webapp/src/main/java/org/navalplanner/web/orders/components/TreeComponent.java
@@ -0,0 +1,53 @@
+/*
+ * This file is part of ###PROJECT_NAME###
+ *
+ * Copyright (C) 2009 Fundación para o Fomento da Calidade Industrial e
+ *                    Desenvolvemento Tecnolóxico de Galicia
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+package org.navalplanner.web.orders.components;
+
+import org.navalplanner.web.orders.OrderElementTreeController;
+import org.zkoss.zk.ui.HtmlMacroComponent;
+
+/**
+ * macro component for order elements tree and similar pages<br />
+ * @author Óscar González Fernández <ogonzalez@igalia.com>
+ */
+public class TreeComponent extends HtmlMacroComponent {
+
+    private static final String CONTROLLER_NAME = "treeController";
+
+    public void clear() {
+        OrderElementTreeController controller = (OrderElementTreeController) getVariable(
+                CONTROLLER_NAME, true);
+        controller.clear();
+    }
+
+    public void useController(OrderElementTreeController controller) {
+        doAfterComposeOnController(controller);
+        this.setVariable(CONTROLLER_NAME, controller, true);
+    }
+
+    private void doAfterComposeOnController(
+            OrderElementTreeController controller) {
+        try {
+            controller.doAfterCompose(this);
+        } catch (Exception e) {
+            throw new RuntimeException(e);
+        }
+    }
+
+}
diff --git a/navalplanner-webapp/src/main/webapp/orders/_edition.zul b/navalplanner-webapp/src/main/webapp/orders/_edition.zul
index 6519b54fd..bcdfc5b33 100644
--- a/navalplanner-webapp/src/main/webapp/orders/_edition.zul
+++ b/navalplanner-webapp/src/main/webapp/orders/_edition.zul
@@ -18,7 +18,8 @@
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
 
-<?component name="orderElementTree" inline="true" macroURI="_orderElementTree.zul"?>
+<?component name="orderElementTree" macroURI="components/_orderElementTree.zul"
+  class="org.navalplanner.web.orders.components.TreeComponent"?>
 <?component name="listOrderElementHours" inline="true" macroURI="_listOrderElementHours.zul"?>
 <?component name="listOrderElementAdvances" inline="true" macroURI="_listOrderElementAdvances.zul"?>
 <?component name="listOrderElementLabels" inline="true" macroURI="_listOrderElementLabels.zul"?>
@@ -104,7 +105,7 @@
                 </grid>
             </tabpanel>
             <tabpanel sclass="orderelements-tab">
-                <orderElementTree />
+                <orderElementTree id="orderElementTree"/>
             </tabpanel>
             <tabpanel>
                 <listOrderElementHours id="orderElementHours" />
diff --git a/navalplanner-webapp/src/main/webapp/orders/_orderElementTree.zul b/navalplanner-webapp/src/main/webapp/orders/components/_orderElementTree.zul
similarity index 74%
rename from navalplanner-webapp/src/main/webapp/orders/_orderElementTree.zul
rename to navalplanner-webapp/src/main/webapp/orders/components/_orderElementTree.zul
index 5852ae1cd..2856a980b 100644
--- a/navalplanner-webapp/src/main/webapp/orders/_orderElementTree.zul
+++ b/navalplanner-webapp/src/main/webapp/orders/components/_orderElementTree.zul
@@ -18,30 +18,30 @@
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
 
-<vbox id="orderElementTree">
+<vbox>
     <vbox>
         <hbox>
             <button id="btnNew" label="${i18n:_('New order element')}"
-                onClick="orderElementTreeController.addOrderElement();" />
+                onClick="treeController.addOrderElement();" />
             <button label="${i18n:_('Create Template')}"
-                onClick="orderElementTreeController.createTemplate();" />
+                onClick="treeController.createTemplate();" />
             <button id="btnDown" label="${i18n:_('Down')}"
-                onClick="orderElementTreeController.down();" />
+                onClick="treeController.down();" />
             <button id="btnUp" label="${i18n:_('Up')}"
-                onClick="orderElementTreeController.up();" />
+                onClick="treeController.up();" />
             <button id="btnUnindent" label="${i18n:_('Unindent')}"
-                onClick="orderElementTreeController.unindent();" />
+                onClick="treeController.unindent();" />
             <button id="btnIndent" label="${i18n:_('Indent')}"
-                onClick="orderElementTreeController.indent();" />
+                onClick="treeController.indent();" />
             <button id="btnDelete" label="${i18n:_('Delete order element')}"
-                onClick="orderElementTreeController.removeOrderElement();" />
+                onClick="treeController.removeOrderElement();" />
         </hbox>
     </vbox>
     <vbox>
         <hbox>
           <!-- Filter by label -->
           <combobox id="cbFilterType" value="${i18n:_('Show all')}"
-                onChange="orderElementTreeController.onShowAll(event)"
+                onChange="treeController.onShowAll(event)"
                 constraint="no empty:${i18n:_('cannot be null or empty')}"
                 readonly="true" >
               <comboitem label="${i18n:_('Show all')}"
@@ -50,17 +50,17 @@
                     description="${i18n:_('Filter all order elements by label')}" />
           </combobox>
           <bandboxSearch id="bdFilter" finder="LabelBandboxFinder"
-                model="@{orderElementTreeController.labels}"/>
+                model="@{treeController.labels}"/>
           <button label="${i18n:_('Filter')}" style="margin-top: -4px"
-                onClick="orderElementTreeController.onApplyFilter(event)"/>
+                onClick="treeController.onApplyFilter(event)"/>
         </hbox>
     </vbox>
     <vbox>
         <tree id="tree" width="1050" multiple="true" droppable="true"
-            onDrop="orderElementTreeController.move(self, event.dragged)"
-            onSelect="orderElementTreeController.updateControlButtons(event)"
-            model="@{orderElementTreeController.orderElementTreeModel}"
-            treeitemRenderer="@{orderElementTreeController.renderer}" pageSize="10"
+            onDrop="treeController.move(self, event.dragged)"
+            onSelect="treeController.updateControlButtons(event)"
+            model="@{treeController.orderElementTreeModel}"
+            treeitemRenderer="@{treeController.renderer}" pageSize="10"
             sclass="orderTree"
             zclass="z-dottree">
             <treecols sizable="true">