From 56e8451d76171a5f64d8563fcaadcd30732bc416 Mon Sep 17 00:00:00 2001
From: William Braeckman <wbr@odoo.com>
Date: Tue, 24 Dec 2024 15:34:27 +0100
Subject: [PATCH] --wip-- [skip ci]

---
 runbot/__manifest__.py                        |   8 +
 runbot/controllers/frontend.py                | 156 ++++++---
 runbot/models/batch.py                        |   4 +
 runbot/models/build.py                        |  19 ++
 runbot/static/src/css/legacy.scss             |  17 +
 runbot/static/src/css/red404.scss             |  16 +
 runbot/static/src/css/runbot.scss             | 312 +++++++++++++++++-
 .../src/js/manage_preferences_dialog.js       | 124 +++++++
 .../src/js/manage_preferences_dialog.xml      |  62 ++++
 runbot/static/src/js/runbot.js                | 117 ++++++-
 runbot/templates/new/batch.xml                | 214 ++++++++++++
 runbot/templates/new/build.xml                | 286 ++++++++++++++++
 runbot/templates/new/bundle.xml               | 138 ++++++++
 runbot/templates/new/commit.xml               | 121 +++++++
 runbot/templates/new/page.xml                 | 301 +++++++++++++++++
 runbot/templates/new/slot.xml                 |  21 ++
 runbot/templates/utils.xml                    | 158 ++++-----
 runbot/views/repo_views.xml                   |   2 +-
 18 files changed, 1941 insertions(+), 135 deletions(-)
 create mode 100644 runbot/static/src/js/manage_preferences_dialog.js
 create mode 100644 runbot/static/src/js/manage_preferences_dialog.xml
 create mode 100644 runbot/templates/new/batch.xml
 create mode 100644 runbot/templates/new/build.xml
 create mode 100644 runbot/templates/new/bundle.xml
 create mode 100644 runbot/templates/new/commit.xml
 create mode 100644 runbot/templates/new/page.xml
 create mode 100644 runbot/templates/new/slot.xml

diff --git a/runbot/__manifest__.py b/runbot/__manifest__.py
index 6690a92a..8e7e2a01 100644
--- a/runbot/__manifest__.py
+++ b/runbot/__manifest__.py
@@ -36,6 +36,12 @@
         'templates/git.xml',
         'templates/nginx.xml',
         'templates/build_error.xml',
+        'templates/new/page.xml',
+        'templates/new/bundle.xml',
+        'templates/new/batch.xml',
+        'templates/new/build.xml',
+        'templates/new/slot.xml',
+        'templates/new/commit.xml',
 
         'views/branch_views.xml',
         'views/build_error_views.xml',
@@ -94,6 +100,8 @@
 
             '/runbot/static/src/libs/bootstrap/js/bootstrap.bundle.js',
             '/runbot/static/src/js/runbot.js',
+            '/runbot/static/src/js/manage_preferences_dialog.js',
+            '/runbot/static/src/js/manage_preferences_dialog.xml',
         ],
     },
     'post_load': 'runbot_post_load',
diff --git a/runbot/controllers/frontend.py b/runbot/controllers/frontend.py
index a008ba98..0ca29892 100644
--- a/runbot/controllers/frontend.py
+++ b/runbot/controllers/frontend.py
@@ -3,6 +3,7 @@ import datetime
 import werkzeug
 import logging
 import functools
+from typing import TypedDict, Optional, List, NamedTuple
 
 import werkzeug.utils
 import werkzeug.urls
@@ -18,13 +19,39 @@ from odoo.osv import expression
 _logger = logging.getLogger(__name__)
 
 
+class Breadcrumb(NamedTuple):
+    url: str
+    name: str
+
+Breadcrumbs = List[Breadcrumb]
+
+class ToolbarContext(TypedDict):
+    """
+    Context used by 'runbot.layout_toolbar', should be provided through the 'toolbar' context key.
+    """
+    sticky: Optional[bool] # Defines if the toolbar is sticky or not, defaults to true
+
+    start_template: Optional[str] # Default to 'runbot.layout_toolbar_start_section'
+    # start_template default expected values
+    breadcrumbs: Optional[Breadcrumbs]
+    middle_template: Optional[str] # Defaults to 'runbot.layout_toolbar_middle_section'
+    # middle_template default expected values
+    message: Optional[str]
+    end_template: Optional[str] # Defaults to 'runbot.layout_toolbar_end_section'
+    # end_template expected values
+    pending_count: Optional[int]
+    pending_level: Optional[int]
+    pending_assigned_count: Optional[int]
+    # hosts_data: Optional[request.env['runbot.host']]
+
+
 def route(routes, **kw):
     def decorator(f):
         @o_route(routes, **kw)
         @functools.wraps(f)
         def response_wrap(*args, **kwargs):
             projects = request.env['runbot.project'].search([('hidden', '=', False)])
-            more = request.httprequest.cookies.get('more', False) == '1'
+            more = request.httprequest.cookies.get('more', False) in ('1', 'true')
             filter_mode = request.httprequest.cookies.get('filter_mode', 'all')
             keep_search = request.httprequest.cookies.get('keep_search', False) == '1'
             cookie_search = request.httprequest.cookies.get('search', '')
@@ -47,7 +74,6 @@ def route(routes, **kw):
 
                 project = response.qcontext.get('project') or projects and projects[0]
 
-                response.qcontext['theme'] = kwargs.get('theme', request.httprequest.cookies.get('theme', 'legacy'))
                 response.qcontext['projects'] = projects
                 response.qcontext['more'] = more
                 response.qcontext['keep_search'] = keep_search
@@ -72,6 +98,22 @@ def route(routes, **kw):
 
 class Runbot(Controller):
 
+    def _get_default_toolbar(self, *, include_message=False):
+        pending_count, level, _, pending_assigned_count = self._pending()
+
+        if include_message:
+            message = request.env['ir.config_parameter'].sudo().get_param('runbot.runbot_message')
+        else:
+            message = None
+
+        return ToolbarContext(
+            pending_count=pending_count,
+            pending_level=level,
+            pending_assigned_count=pending_assigned_count,
+            hosts_data=request.env['runbot.host'].search([('assigned_only', '=', False)]),
+            message=message,
+        )
+
     def _pending(self):
         ICP = request.env['ir.config_parameter'].sudo().get_param
         warn = int(ICP('runbot.pending.warning', 5))
@@ -82,47 +124,21 @@ class Runbot(Controller):
         level = ['info', 'warning', 'danger'][int(pending_count > warn) + int(pending_count > crit)]
         return pending_count, level, scheduled_count, pending_assigned_count
 
-    @o_route([
-        '/runbot/submit'
-    ], type='http', auth="public", methods=['GET', 'POST'], csrf=False)
-    def submit(self, more=False, redirect='/', keep_search=False, category=False, filter_mode=False, update_triggers=False, **kwargs):
-        assert redirect.startswith('/')
-        response = werkzeug.utils.redirect(redirect)
-        response.set_cookie('more', '1' if more else '0')
-        if update_triggers:
-            enabled_triggers = []
-            project_id = int(update_triggers)
-            for key in kwargs.keys():
-                if key.startswith('trigger_'):
-                    enabled_triggers.append(key.replace('trigger_', ''))
-
-            key = 'trigger_display_%s' % project_id
-            if len(request.env['runbot.trigger'].search([('project_id', '=', project_id)])) == len(enabled_triggers):
-                response.delete_cookie(key)
-            else:
-                response.set_cookie(key, '-'.join(enabled_triggers))
-        return response
-
     @route(['/',
             '/runbot',
             '/runbot/<model("runbot.project"):project>',
             '/runbot/<model("runbot.project"):project>/search/<search>'], website=True, auth='public', type='http')
-    def bundles(self, project=None, search='', projects=False, refresh=False, for_next_freeze=False, limit=40, has_pr=None, **kwargs):
+    def bundles(self, project=None, search='', projects=False, refresh=False, for_next_freeze=False, limit=40, has_pr=None, old=None, **kwargs):
         search = search if len(search) < 60 else search[:60]
         env = request.env
         categories = env['runbot.category'].search([])
         if not project and projects:
             project = projects[0]
 
-        pending_count, level, scheduled_count, pending_assigned_count = self._pending()
         context = {
             'categories': categories,
             'search': search,
-            'message': request.env['ir.config_parameter'].sudo().get_param('runbot.runbot_message'),
-            'pending_count': pending_count,
-            'pending_assigned_count': pending_assigned_count,
-            'pending_level': level,
-            'scheduled_count': scheduled_count,
+            'toolbar': self._get_default_toolbar(include_message=True),
             'hosts_data': request.env['runbot.host'].search([('assigned_only', '=', False)]),
         }
         if project:
@@ -185,29 +201,33 @@ class Runbot(Controller):
                 'search': search,
             })
 
-        context.update({'message': request.env['ir.config_parameter'].sudo().get_param('runbot.runbot_message')})
         # request.is_frontend = False  # remove inherit branding
-        return request.render('runbot.bundles', context)
+        return request.render(f'runbot.bundles{"_new" if not old else ""}', context)
 
     @route([
         '/runbot/bundle/<model("runbot.bundle"):bundle>',
         '/runbot/bundle/<model("runbot.bundle"):bundle>/page/<int:page>',
         '/runbot/bundle/<string:bundle>',
         ], website=True, auth='public', type='http', sitemap=False)
-    def bundle(self, bundle=None, page=1, limit=50, **kwargs):
+    def bundle(self, bundle=None, page=1, limit=50, old=None, **kwargs):
         if isinstance(bundle, str):
             bundle = request.env['runbot.bundle'].search([('name', '=', bundle)], limit=1, order='id')
             if not bundle:
                 raise NotFound
             slug = request.env['ir.http']._slug
             return werkzeug.utils.redirect(f'/runbot/bundle/{slug(bundle)}')
+        if isinstance(limit, str):
+            limit = int(limit)
         domain = [('bundle_id', '=', bundle.id), ('hidden', '=', False)]
         batch_count = request.env['runbot.batch'].search_count(domain)
         pager = request.website.pager(
             url='/runbot/bundle/%s' % bundle.id,
             total=batch_count,
             page=page,
-            step=50,
+            step=limit,
+            url_args={
+                'limit': limit,
+            }
         )
         batchs = request.env['runbot.batch'].search(domain, limit=limit, offset=pager.get('offset', 0), order='id desc')
 
@@ -218,9 +238,16 @@ class Runbot(Controller):
             'project': bundle.project_id,
             'title': 'Bundle %s' % bundle.name,
             'page_info_state': bundle.last_batch._get_global_result(),
+            'toolbar': ToolbarContext(
+                breadcrumbs=[
+                    Breadcrumb('/runbot/%s' % request.env['ir.http']._slug(bundle.project_id), bundle.project_id.display_name),
+                    Breadcrumb('/runbot/bundle/%s' % bundle.id, bundle.display_name),
+                ],
+                middle_template='runbot.bundle_toolbar_middle_section',
+                end_template='runbot.pager',
+            )
         }
-
-        return request.render('runbot.bundle', context)
+        return request.render(f'runbot.bundle{"_new" if not old else ""}', context)
 
     @o_route([
         '/runbot/bundle/<model("runbot.bundle"):bundle>/force',
@@ -237,15 +264,25 @@ class Runbot(Controller):
         return werkzeug.utils.redirect('/runbot/batch/%s' % batch.id)
 
     @route(['/runbot/batch/<int:batch_id>'], website=True, auth='public', type='http', sitemap=False)
-    def batch(self, batch_id=None, **kwargs):
+    def batch(self, batch_id=None, old=None, **kwargs):
         batch = request.env['runbot.batch'].browse(batch_id)
+        bundle = batch.bundle_id
+        project = bundle.project_id
         context = {
             'batch': batch,
-            'project': batch.bundle_id.project_id,
+            'project': project,
             'title': 'Batch %s (%s)' % (batch.id, batch.bundle_id.name),
             'page_info_state': batch._get_global_result(),
+            'toolbar': ToolbarContext(
+                breadcrumbs=[
+                    Breadcrumb('/runbot/%s' % request.env['ir.http']._slug(project), project.display_name),
+                    Breadcrumb('/runbot/bundle/%s' % bundle.id, bundle.display_name),
+                    Breadcrumb('/runbot/bundle/batch/%s' % batch.id, batch.display_name),
+                ],
+                middle_template='runbot.batch_toolbar_middle_section',
+            ),
         }
-        return request.render('runbot.batch', context)
+        return request.render(f'runbot.batch{"_new" if not old else ""}', context)
 
     @o_route(['/runbot/batch/slot/<model("runbot.batch.slot"):slot>/build'], auth='user', type='http')
     def slot_create_build(self, slot=None, **kwargs):
@@ -256,7 +293,7 @@ class Runbot(Controller):
         '/runbot/commit/<model("runbot.commit"):commit>',
         '/runbot/commit/<string(minlength=6, maxlength=40):commit_hash>'
     ], website=True, auth='public', type='http', sitemap=False)
-    def commit(self, commit=None, commit_hash=None, **kwargs):
+    def commit(self, commit=None, commit_hash=None, old=None, **kwargs):
         if commit_hash:
             commit = request.env['runbot.commit'].search([('name', '=like', f'{commit_hash}%')], limit=1)
             if not commit.exists():
@@ -275,9 +312,9 @@ class Runbot(Controller):
             'reflogs': request.env['runbot.ref.log'].search([('commit_id', '=', commit.id)]),
             'status_list': status_list,
             'last_status_by_context': last_status_by_context,
-            'title': 'Commit %s' % commit.name[:8]
+            'title': 'Commit %s' % commit.name[:8],
         }
-        return request.render('runbot.commit', context)
+        return request.render(f'runbot.commit{"_new" if not old else ""}', context)
 
     @o_route(['/runbot/commit/resend/<int:status_id>'], website=True, auth='user', type='http')
     def resend_status(self, status_id=None, **kwargs):
@@ -313,7 +350,7 @@ class Runbot(Controller):
         '/runbot/build/<int:build_id>',
         '/runbot/batch/<int:from_batch>/build/<int:build_id>'
     ], type='http', auth="public", website=True, sitemap=False)
-    def build(self, build_id, search=None, from_batch=None, **post):
+    def build(self, build_id, search=None, from_batch=None, old=None, **post):
         """Events/Logs"""
 
         if from_batch:
@@ -329,10 +366,34 @@ class Runbot(Controller):
         if not build.exists():
             return request.not_found()
         siblings = (build.parent_id.children_ids if build.parent_id else from_batch.slot_ids.build_id if from_batch else build).sorted('id')
+        project = build.params_id.trigger_id.project_id
+        breadcrumbs: Breadcrumbs = [Breadcrumb('/runbot/%s' % request.env['ir.http']._slug(project), project.display_name)]
+        batch = bundle = None
+        if from_batch:
+            batch = from_batch
+            batches = batch
+            bundle = batch.bundle_id
+            bundles = bundle
+        else:
+            batches = build.top_parent.with_context(active_test=False).slot_ids.batch_id
+            bundles = batches.bundle_id
+            if len(batches) == 1:
+                batch = batches
+            if len(bundles) == 1:
+                bundle = bundles
+        if bundle:
+            breadcrumbs.append(Breadcrumb(bundle._url(), bundle.display_name))
+        if batch:
+            breadcrumbs.append(Breadcrumb(batch._url(), batch.display_name))
+        breadcrumbs.extend(
+            Breadcrumb(ancestor.build_url, ancestor.description or ancestor.config_id.name) for ancestor in build.ancestors
+        )
         context = {
             'build': build,
+            'batches': batches,
+            'bundles': bundles,
             'from_batch': from_batch,
-            'project': build.params_id.trigger_id.project_id,
+            'project': project,
             'title': 'Build %s' % build.id,
             'siblings': siblings,
             'page_info_state': build.global_result,
@@ -341,8 +402,13 @@ class Runbot(Controller):
             'prev_bu': next((b for b in reversed(siblings) if b.id < build.id), Build),
             'next_bu': next((b for b in siblings if b.id > build.id), Build),
             'next_ko': next((b for b in siblings if b.id > build.id and b.global_result != 'ok'), Build),
+            'toolbar': ToolbarContext(
+                breadcrumbs=breadcrumbs,
+                middle_template='runbot.build_toolbar_middle_section',
+                end_template='runbot.build_toolbar_end_section',
+            )
         }
-        return request.render("runbot.build", context)
+        return request.render(f'runbot.build{"_new" if not old else ""}', context)
 
     @route([
     '/runbot/build/search',
diff --git a/runbot/models/batch.py b/runbot/models/batch.py
index e617cc0f..7f3aeb35 100644
--- a/runbot/models/batch.py
+++ b/runbot/models/batch.py
@@ -34,6 +34,10 @@ class Batch(models.Model):
         column2='referenced_batch_id',
     )
 
+    def _compute_display_name(self):
+        for batch in self:
+            batch.display_name = f'Batch #{batch.id}'
+
     @api.depends('slot_ids.build_id')
     def _compute_all_build_ids(self):
         all_builds = self.env['runbot.build'].search([('id', 'child_of', self.slot_ids.build_id.ids)])
diff --git a/runbot/models/build.py b/runbot/models/build.py
index 220d8812..3fa9ff02 100644
--- a/runbot/models/build.py
+++ b/runbot/models/build.py
@@ -1269,3 +1269,22 @@ class BuildResult(models.Model):
 
     def _parse_config(self):
         return set(findall(self._server("tools/config.py"), r'--[\w-]+', ))
+
+    def _get_view_class(self):
+        """
+        Returns the color class to use according to bootstrap (+ killed).
+        """
+        self.ensure_one()
+
+        if self.global_state in ('running', 'done'):
+            if self.global_result == 'ok':
+                return 'success'
+            elif self.global_result == 'skipped':
+                return 'skipped'
+            elif self.global_result in ('killed', 'manually_killed'):
+                return 'killed'
+        if self.global_result == 'ko':
+            return 'danger'
+        elif self.global_result == 'warn':
+            return 'warning'
+        return 'info'
diff --git a/runbot/static/src/css/legacy.scss b/runbot/static/src/css/legacy.scss
index 4b6e286f..fab22195 100644
--- a/runbot/static/src/css/legacy.scss
+++ b/runbot/static/src/css/legacy.scss
@@ -14,6 +14,10 @@
         color: #fff !important; // It's black by default, color forced to fit with --bs-info-rgb
     }
 
+    .text-bg-success {
+        color: #000 !important;
+    }
+
     .btn-success {
         --bs-btn-color: #fff;
         --bs-btn-bg: #198754;
@@ -30,4 +34,17 @@
         --bs-btn-disabled-bg: #28a745;
         --bs-btn-disabled-border-color: #28a745;
     }
+
+	.o_runbot_batch_card > .card-header {
+		--bs-success-rgb: 223, 240, 216;
+		--bs-info-rgb: 217, 237, 247;
+		--bs-danger-rgb: 242, 222, 222;
+		--bs-warning-rgb: 255, 249, 230;
+		&.text-bg-info, &.text-bg-danger {
+			color: #000 !important;
+		}
+		.badge {
+			--bs-warning-rgb: 255, 193, 7;
+		}
+	}
 }
diff --git a/runbot/static/src/css/red404.scss b/runbot/static/src/css/red404.scss
index 67a58227..b674cce5 100644
--- a/runbot/static/src/css/red404.scss
+++ b/runbot/static/src/css/red404.scss
@@ -25,4 +25,20 @@
         --bs-btn-disabled-bg: #b90e6c;
         --bs-btn-disabled-border-color: #b90e6c;
     }
+
+	.o_runbot_batch_card > .card-header {
+		--bs-success-rgb: 205, 255, 185;
+		--bs-info-rgb: 182, 226, 248;
+		--bs-danger-rgb: 230, 126, 207;
+		--bs-warning-rgb: 250, 233, 177;
+		&.text-bg-danger {
+			color: #fff !important;
+		}
+		&.text-bg-success {
+			color: #000 !important;
+		}
+		.badge {
+			--bs-warning-rgb: 255, 193, 7;
+		}
+	}
 }
diff --git a/runbot/static/src/css/runbot.scss b/runbot/static/src/css/runbot.scss
index 427a4d93..8c4e9bce 100644
--- a/runbot/static/src/css/runbot.scss
+++ b/runbot/static/src/css/runbot.scss
@@ -23,7 +23,6 @@
 	--bs-btn-disabled-color: var(--btn-default-color);
 	--bs-btn-disabled-bg: var(--bs-body-bg);
 	--bs-btn-disabled-border-color: var(--btn-default-border);
-	;
 }
 
 .btn-info {
@@ -102,7 +101,7 @@ a {
 		color: #005452;
 	}
 
-	.slots_infos:hover {
+	&.slots_infos:hover {
 		text-decoration: none;
 	}
 }
@@ -156,6 +155,10 @@ body,
 	content: none;
 }
 
+.dropdown-toggle-caret:after {
+	content: ' ';
+}
+
 .one_line {
 	white-space: nowrap;
 	overflow: hidden;
@@ -183,12 +186,16 @@ body,
 	margin-left: auto;
 }
 
-.bg-killed {
-	background-color: #aaa;
+.bg-killed,
+.bg-killed-subtle,
+.bg-skipped,
+.bg-skipped-subtle {
+	background-color: var(--bs-tertiary-bg);
 }
 
 .text-bg-killed {
-	background-color: #aaa;
+	color: var(--bs-body-color) !important;
+	background-color: var(--bs-tertiary-bg);
 }
 
 .table-condensed td {
@@ -343,3 +350,298 @@ body,
 code {
 	white-space: pre-wrap;
 }
+
+/* NEW STUFF */
+
+.o_runbot_sticky_star {
+	color: #f0ad4e;
+}
+
+/* Layout */
+.o_runbot_main_container>.row {
+	padding: .5rem 0;
+}
+
+.o_runbot_main_container>.row:not(:last-child) {
+	border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
+}
+
+/* Navbar */
+.o_runbot_navbar_username {
+	max-width: 16rem;
+}
+
+.o_runbot_btn_haspr {
+	color: var(--bs-btn-color) !important;
+	background-color: var(--bs-btn-bg) !important;
+	border-color: var(--bs-btn-border-color) !important;
+}
+
+.o_runbot_btn_haspr:has(input:checked) {
+	color: var(--bs-btn-active-color) !important;
+	background-color: var(--bs-btn-active-bg) !important;
+	border-color: var(--bs-btn-active-border-color) !important;
+}
+
+/* Bundles */
+@media (min-width: 768px) {
+	.o_runbot_bundle_info {
+		width: 16rem;
+		max-width: 16rem;
+	}
+}
+
+.o_runbot_bundle_row .o_runbot_batch_card>.o_runbot_batch_card_content>.o_runbot_batch_card_slots>.o_runbot_batch_card_slot {
+	min-width: 50%;
+	flex-grow: 1;
+}
+
+@media (min-width: 1400px) {
+	.o_runbot_bundle_row .o_runbot_batch_card>.o_runbot_batch_card_content>.o_runbot_batch_card_slots>.o_runbot_batch_card_slot:not(.o_runbot_batch_card_slot_preparing) {
+		max-width: 50%;
+	}
+}
+
+@media (max-width: 576px) {
+	.o_runbot_bundle .o_runbot_batch_card>.o_runbot_batch_card_content>.o_runbot_batch_card_slots>.o_runbot_batch_card_slot {
+		min-width: 50%;
+		flex-grow: 1;
+	}
+}
+
+@media (min-width: 576px) {
+	.o_runbot_bundle .o_runbot_batch_card>.o_runbot_batch_card_content>.o_runbot_batch_card_slots>.o_runbot_batch_card_slot {
+		flex-basis: 200px;
+		flex-grow: 1;
+		max-width: 25%;
+	}
+}
+
+@media (min-width: 992px) {
+	.o_runbot_bundle .o_runbot_batch_card>.o_runbot_batch_card_content>.o_runbot_batch_card_slots>.o_runbot_batch_card_slot {
+		flex-basis: 200px;
+		flex-grow: 1;
+		max-width: 20%;
+		min-width: 12.5%;
+	}
+}
+
+.o_runbot_bundle>.col-12 {
+	--bs-gutter-x: 0.5rem;
+	--bs-gutter-y: 0.5rem;
+}
+
+/* Batch */
+:root[data-bs-theme="legacy"] .o_runbot_batch_card {
+	/* In legacy theme we want to keep the card's border color */
+	border: var(--bs-card-border-width) solid var(--bs-card-border-color) !important;
+}
+
+.o_runbot_batch_card>.o_runbot_batch_card_content>.o_runbot_batch_card_slots>.o_runbot_batch_card_slot>.o_runbot_slot_btn_group {
+	width: 100%;
+}
+
+.o_runbot_batch_card>.o_runbot_batch_card_content>.o_runbot_batch_card_commits {
+	font-size: 80%;
+}
+
+.o_runbot_batch>.o_runbot_batch_slots .o_runbot_slot_btn_group {
+	width: 100%;
+}
+
+/* Slot */
+// .btn-group-ssm > * {
+// 	align-items: center;
+// }
+.btn-group-ssm {
+	>* {
+		align-content: center;
+	}
+
+	.o_runbot_slot_btn_small,
+	.o_runbot_build_menu {
+		flex: 0 0 25px;
+	}
+}
+
+.o_runbot_slot_btn_group .o_runbot_slot_btn_small,
+.o_runbot_slot_btn_group>.o_runbot_build_menu {
+	flex: 0 0 25px;
+}
+
+.o_runbot_grid {
+	// Max width for regular columns
+	--runbot-grid-fit-content-width: 200px;
+
+	display: grid;
+	line-height: normal;
+	min-width: 0;
+	grid-template-columns: (
+		repeat(calc(var(--runbot-grid-columns) - 1), fit-content(var(--runbot-grid-fit-content-width)))
+		1fr
+	);
+
+	&.o_runbot_grid_auto {
+		grid-template-columns: repeat(var(--runbot-grid-columns), 1fr);
+	}
+
+	&>* {
+		padding: 0.25rem;
+	}
+
+	&>.separator {
+		grid-column: span var(--runbot-grid-columns);
+	}
+
+	&>*:not(.separator) {
+		// Same as .border-bottom;
+		border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
+	}
+
+	&>.o_runbot_grid_full_row {
+		grid-column: span var(--runbot-grid-columns);
+	}
+}
+
+@for $size from 2 through 5 {
+	.o_runbot_grid_#{$size} {
+		--runbot-grid-columns: #{$size};
+
+		&>*:nth-last-child(-n + #{$size}) {
+			border-bottom: none !important;
+		}
+
+		&>*:not(:nth-child(#{$size}n+1)) {
+			border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
+		}
+	}
+}
+
+.o_runbot_commit_status_grid {
+	grid-template-columns: fit-content(var(--runbot-grid-fit-content-width)) 1fr repeat(3, fit-content(var(--runbot-grid-fit-content-width)));
+}
+
+.o_runbot_commit_status_history_grid {
+	grid-template-columns: fit-content(var(--runbot-grid-fit-content-width)) 1fr repeat(2, fit-content(var(--runbot-grid-fit-content-width)));
+}
+
+.o_runbot_log_grid {
+	display: grid;
+	grid-template-columns: repeat(3, fit-content(200px)) 1fr;
+	line-height: normal;
+	min-width: 0;
+
+	&>*:not(.separator) {
+		// Same as .border-bottom;
+		border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
+	}
+
+	&>.separator {
+		grid-column: span 4;
+	}
+
+	&>.o_runbot_log_grid_header {
+		font-weight: bold;
+		padding: 0.5rem 0;
+	}
+
+	&>.o_runbot_log_grid_date {
+		padding-left: 0.5rem;
+	}
+
+	&>*:not(.o_runbot_log_grid_message) {
+		padding-right: 0.5rem;
+	}
+
+	&>.o_runbot_log_grid_message {
+		overflow: hidden;
+
+		&>* {
+			overflow: auto;
+			text-wrap: nowrap;
+		}
+
+		.o_runbot_log_message_toolbox {
+			display: flex;
+			position: sticky;
+			left: 0;
+			width: fit-content;
+			margin-top: 0.5rem;
+			opacity: 0.8;
+
+			&:hover {
+				opacity: 1;
+
+				// .btn.disabled has a different opacity
+				&>* {
+					--bs-btn-disabled-opacity: 1;
+				}
+			}
+		}
+	}
+}
+
+/* TODO: remove if not used */
+.bg-danger-subtle-hover:hover {
+	background-color: var(--bs-danger) !important;
+	color: #fff !important;
+}
+
+.bg-success-subtle-hover:hover {
+	background-color: var(--bs-success) !important;
+	color: #fff !important;
+}
+
+.bg-warning-subtle-hover:hover {
+	background-color: var(--bs-warning) !important;
+	color: #000 !important;
+}
+
+.bg-info-subtle-hover:hover {
+	background-color: var(--bs-info) !important;
+	color: #000 !important;
+}
+
+.bg-killed-subtle-hover:hover {
+	background-color: var(--body-secondary-bg);
+	color: var(--body-secondary-color);
+}
+
+
+@media (min-width: 768px) {
+	.w-md-auto {
+		width: auto !important;
+	}
+}
+
+.modal:not([data-bs-backdrop="false"]) {
+    background-color: rgba(0, 0, 0, 0.5);
+}
+
+.fa-bounce {
+	animation: bounceIn 2s 1;
+}
+
+@keyframes bounceIn {
+    0% {
+        transform: scale(1) translateY(0);
+    }
+    // 10% {
+    //     transform:  translateY(0);
+    // }
+    // 30% {
+    //     transform:  translateY(var(--fa-bounce-height, -.5em));
+    // }
+    50% {
+        transform: scale(1.1) translateY(0);
+    }
+    // 57% {
+    //     transform: scale(1) translateY(var(--fa-bounce-rebound, -.125em));
+    // }
+    // 64% {
+    //     transform: scale(1) translateY(0);
+    // }
+    100% {
+        transform: scale(1) translateY(0);
+    }
+}
diff --git a/runbot/static/src/js/manage_preferences_dialog.js b/runbot/static/src/js/manage_preferences_dialog.js
new file mode 100644
index 00000000..f6fff143
--- /dev/null
+++ b/runbot/static/src/js/manage_preferences_dialog.js
@@ -0,0 +1,124 @@
+import { Dialog } from "@web/core/dialog/dialog";
+import { cookie } from "@web/core/browser/cookie";
+import { useService } from "@web/core/utils/hooks";
+
+import { Component, useState, onWillStart, onWillRender } from "@odoo/owl";
+
+
+export class ManagePreferencesDialog extends Component {
+    static components = { Dialog };
+    static template = 'runbot.ManagePreferencesDialog';
+    
+    setup() {
+        const projectId = document.head.querySelector('[name=runbot-project-id]').content;
+        this.projectId = projectId && Number(projectId);
+        this.filterModes = [
+            {value: 'all', label: 'All'},
+            {value: 'sticky', label: 'Sticky only'},
+            {value: 'nosticky', label: 'Dev only'},
+        ]
+        this.originalState = {
+            filter_mode: cookie.get('filter_mode') || 'all',
+            category: Number(cookie.get('category') || '1'),
+        }
+        this.dirtyTriggers = false;
+        this.clearTriggerCookie = false;
+        this.orm = useService('orm');
+
+        this.state = useState({
+            categories: [],
+            categoryById: {},
+            triggersByCategory: {},
+
+            selectedCategory: this.originalState.category,
+            selectedFilterMode: this.originalState.filter_mode,
+        });
+
+        onWillStart(async () => {
+            this.state.categories = await this.orm.searchRead(
+                'runbot.category',
+                [],
+                ['id', 'name'],
+            );
+            this.state.categoryById = Object.fromEntries(
+                this.state.categories.map(c => [c.id, c])
+            );
+            const triggers = await this.orm.searchRead(
+                'runbot.trigger',
+                [['project_id', '=', this.projectId || false]],
+                ['id', 'name', 'category_id', 'hide'],
+            );
+            this.state.triggersByCategory = triggers.reduce(
+                (agg, trigger) => {
+                    if (!agg[trigger.category_id[0]]) {
+                        agg[trigger.category_id[0]] = []
+                    }
+                    agg[trigger.category_id[0]].push(trigger);
+                    return agg;
+                }, {}
+            );
+            const activeTriggerCookie = cookie.get(`trigger_display_${this.projectId}`);
+            const activeTriggersFromCookies = activeTriggerCookie && (
+                activeTriggerCookie.split('-').map(Number)
+            );
+            Array.from(Object.values(this.state.triggersByCategory)).flat().forEach(
+                trigger => {
+                    trigger.active = activeTriggersFromCookies ? activeTriggersFromCookies.includes(trigger.id) : !trigger.hide;
+                }
+            );
+        });
+    }
+
+    get _allTriggers() {
+        return Array.from(Object.values(this.state.triggersByCategory)).flat();
+    }
+
+    save() {
+        const cookieName = `trigger_display_${this.projectId}`;
+        if (this.clearTriggerCookie) {
+            cookie.delete(cookieName);
+        } else if (this.dirtyTriggers) {
+            cookie.set(cookieName, this._computeTriggerCookie());
+        }
+        cookie.set('filter_mode', this.state.selectedFilterMode);
+        cookie.set('category', this.state.selectedCategory);
+        location.reload();
+    }
+
+    _computeTriggerCookie() {
+        return this._allTriggers.filter(t => t.active).map(({ id }) => id).sort().join('-');
+    }
+
+    selectFilterMode({ value }) {
+        this.state.selectedFilterMode = value;
+    }
+
+    selectCategory({ id }) {
+        this.state.selectedCategory = id;
+    }
+    
+    toggleTrigger(trigger) {
+        trigger.active = !trigger.active;
+        this.dirtyTriggers = true;
+        this.clearTriggerCookie = false;
+    }
+
+    resetTriggers() {
+        this._allTriggers.forEach(
+            trigger => trigger.active = !trigger.hide
+        );
+        this.clearTriggerCookie = true;
+    }
+
+    allTriggers() {
+        this._allTriggers.forEach(t => t.active = true);
+        this.dirtyTriggers = true;
+        this.clearTriggerCookie = false;
+    }
+
+    noTriggers() {
+        this._allTriggers.forEach(t => t.active = false);
+        this.dirtyTriggers = true;
+        this.clearTriggerCookie = false;
+    }
+}
diff --git a/runbot/static/src/js/manage_preferences_dialog.xml b/runbot/static/src/js/manage_preferences_dialog.xml
new file mode 100644
index 00000000..441bf7e7
--- /dev/null
+++ b/runbot/static/src/js/manage_preferences_dialog.xml
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates>
+    <t t-name="runbot.ManagePreferencesDialog">
+        <Dialog title="'Manage your preferences'">
+            <t t-set-slot="footer">
+                <div class="row justify-content-between align-items-center flex-wrap w-100 g-2">
+                    <div class="col-auto d-flex flex-wrap flex-grow-1 gap-1">
+                        <button class="btn btn-secondary" t-on-click="() => this.resetTriggers()">Reset to default</button>
+                        <button class="btn btn-secondary" t-on-click="() => this.allTriggers()">All</button>
+                        <button class="btn btn-secondary" t-on-click="() => this.noTriggers()">None</button>
+                    </div>
+                    <div class="col-auto">
+                        <button class="btn btn-primary" t-on-click="() => this.save()">Save</button>
+                    </div>
+                </div>
+            </t>
+            <div class="row gy-3">
+                <div class="d-flex flex-wrap justify-content-between align-items-center">
+                    <label class="form-label" for="filter-mode">Filter Mode</label>
+                    <div class="btn-group" role="group" aria-label="Filter Mode">
+                        <t t-foreach="filterModes" t-as="filterMode" t-key="filterMode.value">
+                            <input type="radio" class="btn-check" name="filter-mode" t-attf-id="filter-mode-{{filterMode.value}}"
+                                autocomplete="off" t-att-checked="state.selectedFilterMode === filterMode.value"
+                                t-on-change="() => this.selectFilterMode(filterMode)"
+                            />
+                            <label class="btn btn-outline-primary" t-attf-for="filter-mode-{{filterMode.value}}" t-esc="filterMode.label"/>
+                        </t>
+                    </div>
+                </div>
+                <div class="d-flex flex-wrap justify-content-between align-items-center">
+                    <label class="form-label" for="category">Category</label>
+                    <div class="btn-group" role="group" aria-label="Category">
+                        <t t-foreach="state.categories" t-as="category" t-key="category.id">
+                            <input type="radio" class="btn-check" name="category" t-attf-id="category-{{category.id}}"
+                                autocomplete="off" t-att-checked="state.selectedCategory === category.id"
+                                t-on-change="() => this.selectCategory(category)"
+                            />
+                            <label class="btn btn-outline-primary" t-attf-for="category-{{category.id}}" t-esc="category.name"/>
+                        </t>
+                    </div>
+                </div>
+                <t t-foreach="Object.entries(this.state.triggersByCategory)" t-as="entry" t-key="entry[0]">
+                    <div t-if="this.state.triggersByCategory[entry[0]]" class="row ps-2">
+                        <div class="col-12"><h4>Triggers: <t t-out="this.state.categoryById[entry[0]].name"/></h4></div>
+                        <div class="col-12 d-flex flex-wrap">
+                            <t t-foreach="this.state.triggersByCategory[entry[0]] || []" t-as="trigger" t-key="trigger.id">
+                                <div class="col-6 col-md-4 col-xl-3 form-check">
+                                    <input class="form-check-input" type="checkbox"
+                                        t-att-value="trigger.id" t-attf-id="category-{{entry[0]}}-trigger-{{trigger.id}}"
+                                        t-att-checked="trigger.active"
+                                        t-on-change="() => this.toggleTrigger(trigger)"
+                                    />
+                                    <label class="form-check-label" t-attf-for="category-{{entry[0]}}-trigger-{{trigger.id}}" t-esc="trigger.name"/>
+                                </div>
+                            </t>
+                        </div>
+                    </div>
+                </t>
+            </div>
+        </Dialog>
+    </t>
+</templates>
diff --git a/runbot/static/src/js/runbot.js b/runbot/static/src/js/runbot.js
index ec396602..34b73656 100644
--- a/runbot/static/src/js/runbot.js
+++ b/runbot/static/src/js/runbot.js
@@ -1,4 +1,8 @@
 import publicWidget from "@web/legacy/js/public/public_widget";
+import { debounce } from "@web/core/utils/timing";
+import { cookie } from "@web/core/browser/cookie";
+import { ManagePreferencesDialog } from "@runbot/js/manage_preferences_dialog";
+// import { FormErrorDialog } from "@web/views/form/form_error_dialog/form_error_dialog";
 
 
 publicWidget.registry.RunbotPage = publicWidget.Widget.extend({
@@ -7,18 +11,29 @@ publicWidget.registry.RunbotPage = publicWidget.Widget.extend({
     events: {
         'click [data-runbot]': '_onClickDataRunbot',
         'click [data-runbot-clipboard]': '_onClickRunbotCopy',
+        'click .o_runbot_copy_link': '_onClickCopyLink',
+    },
+
+    start: function () {
+        this._super(...arguments);
+
+        // If we have a hash, try to animate the hashed id
+        const hash = window.location.hash.substring(1);
+        if (hash.length) {
+            const elem = document.getElementById(hash);
+            if (elem) {
+                elem.classList.add('fa-bounce', 'text-bg-warning');
+            }
+        }
     },
 
     _onClickDataRunbot: async (event) => {
         const { currentTarget: target } = event;
-        if (!target) {
-            return;
-        }
-        event.preventDefault();
         const { runbot: operation, runbotBuild } = target.dataset;
         if (!operation) {
             return;
         }
+        event.preventDefault();
         let url = target.href;
         if (runbotBuild) {
             url = `/runbot/build/${runbotBuild}/${operation}`
@@ -35,12 +50,100 @@ publicWidget.registry.RunbotPage = publicWidget.Widget.extend({
         }
     },
 
-    _onClickRunbotCopy: ({ currentTarget: target }) => {
-        if (!navigator.clipboard || !target) {
+    _writeClipboard: function (text) {
+        return navigator.clipboard.writeText(text);
+    },
+
+    _onClickRunbotCopy: function ({ currentTarget: target }) {
+        if (!navigator.clipboard) {
             return;
         }
-        navigator.clipboard.writeText(
+        this._writeClipboard(
             target.dataset.runbotClipboard
         );
+    },
+
+    _onClickCopyLink: function (event) {
+        if (event.altKey || event.ctrlKey || event.metaKey) {
+            return;
+        }
+        const { currentTarget: target } = event;
+        // Check meta keys and stuff
+        event.preventDefault();
+        this._writeClipboard(target.href);
+    }
+});
+
+// Set initial theme on page load
+document.documentElement.dataset.bsTheme = localStorage.getItem('runbotTheme') || 'light';
+
+publicWidget.registry.ThemeSwitcher = publicWidget.Widget.extend({
+    selector: '.o_runbot_preferences',
+    events: {
+        'change .o_runbot_theme_switcher': '_onChangeTheme',
+        'click .o_runbot_more_info': '_onChangeMoreInfo',
+        'click .o_runbot_manage_filters': '_onClickManageFilters',
+    },
+
+    init: function () {
+        this._super(...arguments);
+        this.theme = localStorage.getItem('runbotTheme') || 'light';
+        document.documentElement.dataset.bsTheme = this.theme;
+        this._onChangeMoreInfo = debounce(this._onChangeMoreInfo, 300).bind(this);
+    },
+
+    start: function () {
+        this.moreInfoEl = this.el.querySelector('.o_runbot_more_info');
+        this.dropdownMenu = this.el.querySelector('.dropdown-menu');
+        this.el.querySelector('.o_runbot_theme_switcher').value = this.theme;
+    },
+
+    _onChangeTheme: ({ currentTarget: target }) => {
+        this.theme = target.value;
+        document.documentElement.dataset.bsTheme = this.theme;
+        localStorage.setItem('runbotTheme', this.theme);
+    },
+
+    _onChangeMoreInfo: function () {
+        const { checked } = this.moreInfoEl;
+        const cookieChecked = cookie.get('more');
+        if (checked && !cookieChecked) {
+            cookie.set('more', 'true');
+        } else if (!checked && cookieChecked) {
+            cookie.delete('more');
+        } else {
+            return;
+        }
+        location.reload();
+    },
+
+    _onClickManageFilters: function (event) {
+        event.preventDefault();
+        this.dropdownMenu.classList.remove('show');
+        this.call('dialog', 'add', ManagePreferencesDialog);
+    },
+});
+
+publicWidget.registry.RunbotToolbar = publicWidget.Widget.extend({
+    selector: '.o_runbot_toolbar.position-sticky',
+
+    start: function () {
+        this._super();
+
+        const navbarElem = document.querySelector('nav.navbar');
+        if (!navbarElem) {
+            return;
+        }
+        this.resizeObserver = new ResizeObserver(() => {
+            this.el.style.top = navbarElem.getBoundingClientRect().height;
+        });
+        this.resizeObserver.observe(this.el);
+    },
+
+    destroy: function () {
+        if (this.resizeObserver) {
+            this.resizeObserver.disconnect();
+        }
+        this._super();
     }
 });
diff --git a/runbot/templates/new/batch.xml b/runbot/templates/new/batch.xml
new file mode 100644
index 00000000..f5f68a01
--- /dev/null
+++ b/runbot/templates/new/batch.xml
@@ -0,0 +1,214 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<odoo>
+    <template id="runbot.batch_card">
+        <t t-set="klass">info</t>
+        <t t-if="batch.state=='skipped'" t-set="klass">killed</t>
+        <t t-if="batch.state=='done' and all(slot.build_id.global_result == 'ok' for slot in batch.slot_ids if slot.build_id)" t-set="klass">success</t>
+        <t t-if="batch.state=='done' and any(slot.build_id.global_result in ('ko', 'warn') for slot in batch.slot_ids)" t-set="klass">danger</t>
+        <div t-attf-class="o_runbot_batch_card card w-100 h-100">
+            <a t-attf-class="card-header px-2 d-flex justify-content-between alig-items-center text-bg-{{klass}}"
+                t-attf-href="/runbot/batch/#{batch.id}" title="View Batch"
+            >
+                <span class="lh-sm">Batch #<t t-out="batch.id"/></span>
+                <span t-attf-class="badge text-bg-{{'warning' if batch.has_warning else 'default'}}">
+                    <t t-out="batch._get_formated_age()"/>
+                    <i t-if="batch.has_warning" class="fa fa-exclamation-triangle"/>
+                </span>
+            </a>
+            <div class="o_runbot_batch_card_content d-flex flex-column justify-content-between h-100">
+                <div class="o_runbot_batch_card_slots card-body row g-1 p-1 flex-grow-0">
+                    <div t-if="batch.state == 'preparing'" class="col-12 btn-group btn-group-ssm">
+                        <span class="btn btn-default disabled" titled="Preparing">
+                            <i class="fa fa-cog fa-spin fa-fw"/> Preparing
+                        </span>
+                    </div>
+                    <t t-foreach="batch.slot_ids" t-as="slot">
+                        <t t-if="slot.build_id">
+                            <div class="o_runbot_batch_card_slot col-auto" t-if="((not slot.trigger_id.hide and trigger_display is None) or (trigger_display and slot.trigger_id.id in trigger_display)) or slot.build_id.global_result != 'ok'">
+                                <t t-call="runbot.slot_btn_group"/>
+                            </div>
+                        </t>
+                    </t>
+                </div>
+                <div class="o_runbot_batch_card_commits row g-0 card-footer p-1" t-if="more">
+                    <div t-foreach="batch.commit_link_ids.sorted(lambda cl: (cl.commit_id.repo_id.sequence, cl.commit_id.repo_id.id))" t-as="commit_link"
+                        class="col-12 text-truncate"
+                    >
+                        <t t-set="match_class" t-value="'info' if commit_link.match_type == 'new' else 'secondary'"/>
+                        <a
+                            title="View Commit on Github"
+                            t-att-href="'https://%s/commit/%s' % (commit_link.branch_id.remote_id.base_url, commit_link.commit_id.name)"
+                            t-attf-class="badge text-bg-{{match_class}}"
+                        >
+                            <i class="fa fa-github"/>
+                        </a>
+                        <a t-attf-href="/runbot/commit/#{commit_link.commit_id.id}" t-attf-class="badge text-bg-{{match_class}}">
+                            <i class="fa fa-fw fa-hashtag" t-if="commit_link.match_type == 'new'" title="This commit is a new head"/>
+                            <i class="fa fa-fw fa-link" t-if="commit_link.match_type == 'head'" title="This commit is an existing head from bundle branches"/>
+                            <i class="fa fa-fw fa-code-fork" t-if="commit_link.match_type == 'base_match'" title="This commit is matched from a base batch with matching merge_base"/>
+                            <i class="fa fa-fw fa-clock-o" t-if="commit_link.match_type == 'base_head'" title="This commit is the head of a base branch"/>
+                            <t t-out="commit_link.commit_id.dname"/>
+                        </a>
+                        <span class="font-monospace text-nowrap text-truncate overflow-hidden" t-att-title="commit_link.commit_id.subject" t-out="commit_link.commit_id.subject"/>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </template>
+
+    <template id="runbot.batch_commit_link_cell">
+        <t t-set="commit" t-value="commit_link.commit_id"/>
+        <div class="row">
+            <div>
+                <a t-attf-href="/runbot/commit/#{commit.id}">
+                    <i class="fa fa-fw fa-hashtag" t-if="commit_link.match_type == 'new'" title="This commit is a new head"/>
+                    <i class="fa fa-fw fa-link" t-if="commit_link.match_type == 'head'" title="This commit is an existing head from bundle branches"/>
+                    <i class="fa fa-fw fa-code-fork" t-if="commit_link.match_type == 'base_match'" title="This commit is matched from a base batch with matching merge_base"/>
+                    <i class="fa fa-fw fa-clock-o" t-if="commit_link.match_type == 'base_head'" title="This commit is the head of a base branch"/>
+                    <span class="label" t-out="commit.dname"/>
+                </a>
+                <a t-att-href="'https://%s/commit/%s' % (commit_link.branch_id.remote_id.base_url, commit_link.commit_id.name)" title="View Commit on Github"><i class="fa fa-github"/></a>
+                <small>
+                    <t t-if="commit_link.match_type and commit_link.match_type.startswith('base')">
+                        from base: <t t-out="commit_link.branch_id.name"/>
+                    </t>
+                    <t t-else="">
+                        found in branch <t t-out="commit_link.branch_id.name"/>
+                        <t t-if="batch.state != 'preparing'">
+                            <span t-out="'+%s' % commit_link.diff_add" class="text-success"/>
+                            <span t-out="'-%s' % commit_link.diff_remove" class="text-danger"/>
+                            <span class="text-info">
+                                (
+                                <t t-out="commit_link.file_changed"/>
+                                <i class="fa fa-file"/>
+                                )
+                                <span>(
+                                    <span t-out="'%s ahead' % commit_link.base_ahead" class="text-success"/>
+                                    ,
+                                    <span t-out="'%s behind' % commit_link.base_behind" class="text-danger"/>
+                                )</span>
+                            </span>
+                        </t>
+                    </t>
+                </small>
+            </div>
+            <small class="d-block">Base head: <t t-out="commit_link.base_commit_id.name"/></small>
+            <small class="d-block">Merge head: <t t-out="commit_link.merge_base_commit_id.name"/></small>
+            <b t-if="commit.rebase_on_id">Automatic rebase on <t t-out="commit.rebase_on_id.name"/><br/></b>
+            <t t-if="more or not (commit_link.match_type and commit_link.match_type.startswith('base'))">
+                <span class="d-block">
+                    Subject: <t t-out="commit.subject"/>
+                </span>
+                <span class="d-block">
+                    Author: <t t-out="commit.author"/> (<t t-out="commit.author_email"/>)
+                </span>
+                <span class="d-block" t-if="commit.author != commit.committer">
+                    Committer: <t t-out="commit.committer"/> (<t t-out="commit.committer_email"/>)
+                </span>
+                <span class="d-block">
+                    Commit date: <t t-out="commit.date"/>
+                </span>
+            </t>
+        </div>
+    </template>
+
+    <template id="runbot.batch_toolbar_middle_section">
+        <div class="btn-group btn-group-sm" role="group" groups="runbot.group_runbot_advanced_user">
+            <a t-attf-href="/web/#id={{batch.id}}&amp;view_type=form&amp;model=runbot.batch&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}" class="btn btn-default" target="new" title="View Batch in Backend">
+                <i class="fa fa-list"/>
+            </a>
+        </div>
+    </template>
+
+    <template id="runbot.batch_new">
+        <t t-call="runbot.layout_new">
+            <div class="o_runbot_batch row">
+                <div class="o_runbot_batch_details col-12 col-lg-6">
+                    <t t-set="batch_class" t-value="'bg-info-subtle' if batch.state=='preparing' else 'bg-success-subtle' if not any(log.level != 'INFO' for log in batch.log_ids) else 'bg-warning-subtle'"/>
+                    <div class="card mb-2">
+                        <div class="card-header px-2 py-1">Batch #<t t-out="batch.id"/></div>
+                        <div class="o_runbot_grid o_runbot_grid_2">
+                            <div>Bundle</div>
+                            <div>
+                                <a t-out="batch.bundle_id.name" t-attf-href="/runbot/bundle/{{batch.bundle_id.id}}"/>
+                            </div>
+                            <t t-if="batch.category_id.id != default_category">
+                                <div>Category</div>
+                                <div t-out="batch.category_id.name"></div>
+                            </t>
+                            <div>Version</div>
+                            <div t-out="batch.slot_ids[0].params_id.version_id.name if batch.slot_ids else batch.bundle_id.version_id.name"/>
+                            <div>Create date</div>
+                            <div t-out="batch.create_date"/>
+                            <t t-if="more">
+                                <div>Last update</div>
+                                <div>
+                                    <t t-out="batch.last_update"/>
+                                    <span class="badge text-bg-info pull-right" t-out="s2human_long(batch.last_update - batch.create_date)"/>
+                                </div>
+                            </t>
+                            <t t-if="more and batch.reference_batch_ids">
+                                <div>Version reference batches (for upgrade)</div>
+                                <div>
+                                    <t t-foreach="batch.reference_batch_ids" t-as="reference_batch"/>
+                                    <div><a t-attf-href="/runbot/batch/{{reference_batch.id}}"><t t-out="reference_batch.bundle_id.version_id.name"/> (<t t-out="reference_batch.id"/>)</a></div>
+                                </div>
+                            </t>
+
+                            <t t-set="commit_links" t-value="batch.commit_link_ids.sorted(key=lambda lc: (lc.commit_id.repo_id.sequence, lc.commit_id.repo_id.id))"/>
+                            <div t-att-class="batch_class">Commits</div>
+                            <div class="p-0">
+                                <ul class="list-group list-group-flush">
+                                    <li t-foreach="commit_links" t-as="commit_link" t-attf-class="list-group-item p-1 {{batch_class}}">
+                                        <t t-call="runbot.batch_commit_link_cell"/>
+                                    </li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="o_runbot_batch_slots col-12 col-lg-6">
+                    <div class="card mb-2">
+                        <div class="card-header px-2 py-1">Builds</div>
+                        <div class="o_runbot_grid o_runbot_grid_2">
+                            <div>Automatic</div>
+                            <div>
+                                <div class="row g-1">
+                                    <t t-foreach="batch.slot_ids.filtered(lambda s: not s.trigger_id.manual)" t-as="slot" t-call="runbot.slot_btn_group"/>
+                                </div>
+                            </div>
+                            <div>Manual</div>
+                            <div>
+                                <div class="row g-1">
+                                    <t t-foreach="batch.slot_ids.filtered(lambda s: s.trigger_id.manual)" t-as="slot">
+                                        <t t-if="slot.build_id or (not slot.trigger_id.team_ids) or (user_id in slot.trigger_id.team_ids.user_ids)">
+                                            <t t-call="runbot.slot_btn_group"/>
+                                        </t>
+                                    </t>
+                                </div>
+                            </div>
+                            <div>Old builds</div>
+                            <div>
+                                <div class="row g-1 text-decoration-line-through">
+                                    <t t-foreach="batch.with_context(active_test=False).slot_ids.filtered(lambda s: not s.active)" t-as="slot">
+                                        <t t-call="runbot.slot_btn_group"/>
+                                    </t>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="o_runbot_batch_logs col-12">
+                    <t t-foreach="batch.log_ids" t-as="log">
+                        <t t-set="logclass" t-value="dict(ERROR='danger', WARNING='warning', INFO='info').get(log.level, 'warning')"/>
+                        <div t-attf-class="alert alert-{{logclass}}">
+                            <b t-out="log.level"/>
+                            --
+                            <t t-out="log._markdown()"/>
+                        </div>
+                    </t>
+                </div>
+            </div>
+        </t>
+    </template>
+</odoo>
diff --git a/runbot/templates/new/build.xml b/runbot/templates/new/build.xml
new file mode 100644
index 00000000..23fe8664
--- /dev/null
+++ b/runbot/templates/new/build.xml
@@ -0,0 +1,286 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<odoo>
+    <template id="runbot.build_buttons">
+        <a t-if="build.local_state == 'running' and build.database_ids" t-attf-href="/runbot/run/{{build.id}}" class="btn btn-info o_runbot_slot_btn_small" title="Sign in on this build" aria-label="Sign in on this build">
+            <i class="fa fa-sign-in"/>
+        </a>
+        <a t-if="build.static_run" t-att-href="build.static_run" class="btn btn-info o_runbot_slot_btn_small" title="View result" aria-label="View result">
+            <i class="fa fa-sign-in"/>
+        </a>
+        <a groups="base.group_user" t-if="build.local_state=='done' and (not build.parent_id.database_ids or user_id.has_group('runbot.group_runbot_advanced_user')) and build.requested_action != 'wake_up' and build.database_ids"
+            href="#" data-runbot="wakeup" t-att-data-runbot-build="build.id" class="btn btn-default o_runbot_slot_btn_small" title="Wake up this build" aria-label="Wake up this build">
+            <i class="fa fa-coffee"/>
+        </a>
+        <a t-attf-href="/runbot/build/{{build.id}}" class="btn btn-default o_runbot_slot_btn_small" title="Build details" aria-label="Build details">
+            <i class="fa fa-file-text-o"/>
+        </a>
+        <t t-call="runbot.build_menu">
+            <t t-set="bu" t-value="build"/>
+        </t>
+    </template>
+
+    <template id="runbot.build_toolbar_middle_section">
+        <div class="btn-group btn-group-sm">
+            <t t-call="runbot.build_buttons"/>
+        </div>
+    </template>
+
+    <template id="runbot.build_toolbar_end_section">
+      <div class="btn-group btn-group-sm">
+        <a t-att-href="prev_ko.build_url" role="button" t-attf-title="Previous ko {{prev_ko.display_name}}"
+            t-attf-class="{{'' if prev_ko else 'disabled '}}btn btn-default fa fa-angle-double-left"></a>
+        <a t-att-href="prev_bu.build_url" role="button" t-attf-title="Previous {{prev_bu.display_name}}"
+            t-attf-class="{{'' if prev_bu else 'disabled '}}btn btn-default fa fa-chevron-left"></a>
+        <a t-att-href="next_bu.build_url" role="button" t-attf-title="Next {{next_bu.display_name}}"
+            t-attf-class="{{'' if next_bu else 'disabled '}}btn btn-default fa fa-chevron-right"></a>
+        <a t-att-href="next_ko.build_url" role="button" t-attf-title="Next ko {{next_ko.display_name}}"
+            t-attf-class="{{'' if next_ko else 'disabled '}}btn btn-default fa fa-angle-double-right"></a>
+      </div>
+    </template>
+
+    <template id="runbot.build_new">
+        <t t-call="runbot.layout_new">
+            <div class="o_runbot_build row gy-2">
+                <t t-set="rowclass" t-value="build._get_view_class()"/>
+                <div t-attf-class="o_runbot_build_information col-12 col-md-{{'6' if build.children_ids else '12'}}">
+                    <div t-attf-class="card h-100">
+                        <div class="card-header px-2 py-1">
+                            Build
+                        </div>
+                        <div t-attf-class="card-body bg-{{rowclass}}-subtle p-2 overflow-auto text-nowrap">
+                        <!-- Batch/bundles links-->
+                        <div t-if="len(bundles) > 1">
+                            This build is referenced in <t t-out="len(bundles)"/> bundles
+                            <ul>
+                                <li t-foreach="bundles" t-as="bundle" ><a t-out="bundle.name" t-attf-href="/runbot/bundle/{{bundle.id}}"/></li>
+                            </ul>
+                        </div>
+                        <t t-if="len(batches) > 1">
+                            <div><b>First apparition:</b> <a t-out="batches[0].bundle_id.name" t-att-href="batches[0]._url()"/><br/></div>
+                            <div><b>Last apparition:</b> <a t-out="batches[-1].bundle_id.name" t-att-href="batches[-1]._url()"/><br/></div>
+                        </t>
+                        <!-- Parent -->
+                        <div t-if="build.parent_id and build.orphan_result">
+                            <i class="fa fa-chain-broken" title="Build result ignored for parent" />
+                            &amp;nbsp;Orphaned build, the result does not affect parent build result
+                        </div>
+
+                        <t t-if="build.description">
+                            <b>Description:</b>
+                            <t t-out="build.md_description"/>
+                            <br/>
+                        </t>
+
+                        <!-- Commits -->
+                        <t t-foreach="build.params_id.sudo().commit_link_ids" t-as="build_commit">
+                            <div>
+                                <b>Commit:</b>
+                                <a t-attf-href="/runbot/commit/{{build_commit.commit_id.id}}">
+                                <t t-out="build_commit.commit_id.dname"/>
+                                </a>
+                                &amp;nbsp;
+                                <a t-att-href="'https://%s/commit/%s' % (build_commit.branch_id.remote_id.base_url, build_commit.commit_id.name)" title="View Commit on Github"><i class="fa fa-github"/></a>
+                            </div>
+                            <div t-if="build_commit.match_type in ('default', 'pr_target', 'prefix')">
+                                <div>from base branch</div>
+                            </div>
+                            <div t-else="" class="ms-3">
+                                <div><b>Subject:</b> <span class="font-monospace" t-out="build_commit.commit_id.subject"/></div>
+                                <div><b>Author:</b> <t t-out="build_commit.commit_id.author"/></div>
+                                <div><b>Committer:</b> <t t-out="build_commit.commit_id.committer"/></div>
+                            </div>
+                        </t>
+                        <div><b>Version:</b> <t t-out="build.params_id.version_id.name"/></div>
+                        <div><b>Config:</b> <t t-out="build.params_id.config_id.name"/></div>
+                        <t t-if="more">
+                            <div><b>Trigger:</b> <t t-out="build.params_id.trigger_id.name"/></div>
+                            <div><b>Config data:</b> <span class="font-monospace" t-out="build.params_id.config_data.dict"/></div>
+                            <div><b>Modules:</b> <t t-out="build.params_id.modules"/></div>
+                            <div><b>Extra params:</b> <span class="font-monospace" t-out="build.params_id.extra_params"/></div>
+                            <div t-if="len(build.params_id.builds_reference_ids) > 1">
+                                <b>Reference builds:</b>
+                                <span t-foreach="build.params_id.builds_reference_ids" t-as="reference" t-out="reference.id"/>
+                            </div>
+                            <div t-if="len(build.params_id.build_ids) > 1">
+                                <b>Similar builds:</b>
+                                <t t-foreach="build.params_id.build_ids" t-as="simbuild">
+                                    <a t-if="simbuild.id != build.id" t-attf-href="/runbot/build/#{simbuild.id}">
+                                    <span
+                                        t-attf-class="badge text-bg-{{simbuild._get_color_class()}}"
+                                        t-out="simbuild.id"/>
+                                    </a>
+                                </t>
+                            </div>
+                            <div><b>Host:</b> <t t-out="build.host"/></div>
+                        </t>
+                        <div>
+                            <b title="Execution time of this build, without child time">
+                            Build time:
+                            </b>
+                            <t t-att-tile='build.build_time' t-out="s2human(build.build_time)"/>
+                            <i t-if='more'>(<t t-out="build.build_time"/>s)</i>
+                        </div>
+                        <div>
+                            <b title='Time from creation to finish (queue time + completion time)'>
+                            Wait time:
+                            </b>
+                            <t t-att-tile='build.wait_time' t-out="s2human(build.wait_time)"/>
+                            <i t-if='more'>(<t t-out="build.wait_time"/>s)</i>
+                        </div>
+                        <div>
+                            <b title='Total time '>
+                            Load time:
+                            </b>
+                            <t t-att-tile='build.load_time' t-out="s2human(build.load_time)"/>
+                            <i t-if='more'>(<t t-out="build.load_time"/>s)</i>
+                        </div>
+                        <div t-if="build.stat_ids">
+                            <b>Stats: <a t-attf-href="/runbot/build/stats/{{build.id}}">Build <t t-out="build.id"/></a></b>
+                        </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="o_runbot_build_child_information col-12 col-md-6" t-if="build.children_ids">
+                    <div class="card">
+                        <div t-attf-class="card-header px-2 py-1">
+                            Children
+                        </div>
+                        <ul class="list-group list-group-flush">
+                            <li t-foreach="build.children_ids" t-as="child"
+                                t-attf-class="list-group-item px-2 py-1 bg-{{child._get_view_class()}}{{' text-decoration-line-through' if child.orphan_result else ''}}">
+                                <div class="btn-group btn-group-ssm d-flex flex-grow-1">
+                                    <a t-attf-href="/runbot/{{'batch/%s/' % from_batch.id if from_batch else ''}}build/{{child.id}}"
+                                        t-attf-class="btn btn-default flex-grow-1 text-start text-truncate bg-{{child._get_view_class()}}-subtle">
+                                        <div class="d-flex flex-row align-items-center gap-2">
+                                            <div>
+                                                Build <t t-out="child.id"/>
+                                            </div>
+                                            <div>
+                                                <div>
+                                                    <t t-if="child.description" t-out="child.md_description"/>
+                                                    <t t-else="">
+                                                        with config <t t-out="child.params_id.config_id.name"/>
+                                                    </t>
+                                                    <i t-if="child.orphan_result" class="fa fa-chain-broken" title="Build result ignored for parent"/>
+                                                </div>
+                                                <div t-if="child.job">
+                                                    <small>Running step: <t t-out="child.job"/></small>
+                                                </div>
+                                            </div>
+                                            <div t-if="child.global_state in ('testing', 'waiting')">
+                                                <i class="fa fa-spinner fa-spin"/>
+                                                <t t-out="child.global_state"/>
+                                            </div>
+                                        </div>
+                                    </a>
+                                    <t t-call="runbot.build_buttons">
+                                        <t t-set="build" t-value="child"/>
+                                    </t>
+                                </div>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <div class="o_runbot_logs row">
+              <div class="o_runbot_log_grid gx-0">
+                <div class="o_runbot_log_grid_header o_runbot_log_grid_date">Date</div>
+                <div class="o_runbot_log_grid_header">Level</div>
+                <div class="o_runbot_log_grid_header">Type</div>
+                <div class="o_runbot_log_grid_header o_runbot_log_grid_message">Message</div>
+                <t t-set="commit_link_per_name" t-value="{commit_link.commit_id.repo_id.name:commit_link for commit_link in build.params_id.commit_link_ids}"/>
+                <t t-foreach="build.sudo().log_ids" t-as="l">
+                  <div t-if="l.level == 'SEPARATOR'" class="separator"/>
+                  <div class="o_runbot_log_grid_date text-truncate">
+                    <span t-attf-id="log_line_{{l.id}}" class="d-inline-block" style="scroll-margin-top: 120px;" t-out="l.create_date.strftime('%Y-%m-%d %H:%M:%S')"/>
+                  </div>
+                  <div class="fw-bold" t-out="l.level if l.type not in ('link', 'markdown') and l.level != 'SEPARATOR' else ''"/>
+                  <div t-out="l.type if l.type not in ('link', 'markdown') and l.level != 'SEPARATOR' else ''"/>
+                  <div class="o_runbot_log_grid_message">
+                    <!-- TODO: check logic exact logic -->
+                    <t t-set="subbuild" t-value="build.children_ids &amp; build.browse(int(l.path)) if l.type == 'subbuild' else build.browse()"/>
+                    <!-- <t t-set="subbuild" t-value="(([child for child in build.children_ids if child.id == int(l.path)] if l.type == 'subbuild' else False) or [build.browse()])[0]"/> -->
+                    <t t-set="logclass" t-value="dict(CRITICAL='danger', ERROR='danger', WARNING='warning', OK='success', SEPARATOR='separator').get(l.level)"/>
+                    <t t-set="message_class" t-value="subbuild and subbuild._get_view_class() or ''"/>
+                    <div t-attf-class="bg-{{message_class or logclass}}-subtle p-1">
+                      
+                      <div class="o_runbot_log_message_toolbox btn-group btn-group-ssm" role="group" t-if="l.level in ('CRITICAL', 'ERROR', 'WARNING') and None">
+                        <t t-set="error_content" t-value="l.error_content_id"/>
+                        <t t-set="error" t-value="error_content.error_id"/>
+                        <a t-if="error" class="btn btn-default" t-attf-href="/web#id={{error.id}}&amp;view_type=form&amp;model=runbot.build.error&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}" target="new">
+                          This error is already <em t-attf-title="{{'Was detected by runbot in nightly builds.' if error.active else 'Either the error is not properly fixed or the branch does not contain the fix.'}}"><t t-out="'known' if error.active else 'fixed'"/></em>
+                          <span groups="runbot.group_runbot_admin" t-if="error.responsible or error.responsible.id == uid">(<i t-out="error.responsible.name"/>)</span>
+                        </a>
+                        <a t-if="error" t-attf-class="btn btn-default bg-{{'info' if error.active else 'success'}}-subtle fa fa-list"
+                          t-attf-href="/web#id={{error.id}}&amp;view_type=form&amp;model=runbot.build.error&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}"
+                          title="View in Backend" target="new"
+                        />
+                        <a t-if="not error" groups="runbot.group_runbot_admin" t-attf-href="/runbot/parse_log/{{l.id}}" class="btn btn-default fa fa-magic sm"
+                          title="Parse this log line to follow this error."/>
+                        <a class="btn btn-default fa fa-link o_runbot_copy_link" t-attf-href="#log_line_{{l.id}}" title="Copy link to line"/>
+                      </div>
+                      <t t-if="l.type not in ('runbot', 'link', 'markdown')">
+                        <t t-if="l.type == 'subbuild'">
+                          <a t-attf-href="/runbot/build/{{l.path}}">
+                            Build #
+                            <t t-out="l.path"/>
+                          </a>
+                        </t>
+                        <t t-else="">
+                          <t t-set="repo_name" t-value="l.path.replace('/data/build/', '').split('/')[0] "/>
+                          <t t-set="href" t-value=""/>
+                          <t t-if="repo_name in commit_link_per_name">
+                            <t t-set="repo_base_url" t-value="commit_link_per_name[repo_name].branch_id.remote_id.base_url if repo_name in commit_link_per_name else ''"/>
+                            <t t-set="commit_hash" t-value="commit_link_per_name[repo_name].commit_id.name if repo_name in commit_link_per_name else ''"/>
+                            <t t-set="path" t-value="l.path.replace('/data/build/%s/' % repo_name, '')"/>
+                            <t t-set="href" t-value="'https://%s/blob/%s/%s#L%s' % (repo_base_url, commit_hash, path, l.line)"/>
+                          </t>
+                          <a t-att-href="href" t-attf-title="Func: {{l.func}}"><t t-out="l.name"/>:<t t-out="l.line"/></a>
+                        </t>
+                      </t>
+                      <!-- DEPRECATED: Will be removed once no ir.logging is concerned. -->
+                      <span class="log_message" t-if="l.type == 'link' and len(l.message.split('$$')) == 3">
+                        <t t-set="message" t-value="l.message.split('$$')"/>
+                        <t t-if="message[1].startswith('fa-')">
+                          <t t-out="message[0]"/>
+                          <a t-attf-href="{{l.path}}">
+                            <i t-attf-class="fa {{message[1]}}"/>
+                          </a>
+                          <t t-out="message[2]"/>
+                        </t>
+                        <t t-else="">
+                          <t t-out="message[0]"/>
+                          <a t-attf-href="{{l.path}}">
+                            <t t-out="message[1]"/>
+                          </a>
+                          <t t-out="message[2]"/>
+                        </t>
+                      </span>
+                      <span class="log_message" t-elif="l.type == 'markdown'" t-out="l._markdown()"/>
+                      <span class="log_message" t-else="">
+                        <t t-if="'\n' not in l.message" t-out="l.message"/>
+                        <pre t-if="'\n' in l.message" style="margin:0;padding:0; border: none;"><t t-out="l.message"/></pre>
+                      </span>
+                      <div class="o_runbot_log_message_toolbox btn-group btn-group-ssm" role="group" t-if="l.level in ('CRITICAL', 'ERROR', 'WARNING')">
+                        <t t-set="error_content" t-value="l.error_content_id"/>
+                        <t t-set="error" t-value="error_content.error_id"/>
+                        <a t-if="error" class="btn btn-default" t-attf-href="/web#id={{error.id}}&amp;view_type=form&amp;model=runbot.build.error&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}" target="new">
+                          This error is already <em t-attf-title="{{'Was detected by runbot in nightly builds.' if error.active else 'Either the error is not properly fixed or the branch does not contain the fix.'}}"><t t-out="'known' if error.active else 'fixed'"/></em>
+                          <span groups="runbot.group_runbot_admin" t-if="error.responsible or error.responsible.id == uid">(<i t-out="error.responsible.name"/>)</span>
+                        </a>
+                        <a t-if="error" t-attf-class="btn btn-default bg-{{'info' if error.active else 'success'}}-subtle fa fa-list"
+                          t-attf-href="/web#id={{error.id}}&amp;view_type=form&amp;model=runbot.build.error&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}"
+                          title="View in Backend" target="new"
+                        />
+                        <a t-if="not error" groups="runbot.group_runbot_admin" t-attf-href="/runbot/parse_log/{{l.id}}" class="btn btn-default fa fa-magic sm"
+                          title="Parse this log line to follow this error."/>
+                        <a class="btn btn-default fa fa-link o_runbot_copy_link" t-attf-href="#log_line_{{l.id}}" title="Copy link to line"/>
+                      </div>
+                    </div>
+                  </div>
+                </t>
+              </div>
+            </div>
+        </t>
+    </template>
+</odoo>
diff --git a/runbot/templates/new/bundle.xml b/runbot/templates/new/bundle.xml
new file mode 100644
index 00000000..834465a0
--- /dev/null
+++ b/runbot/templates/new/bundle.xml
@@ -0,0 +1,138 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<odoo>
+    <!-- Homepage and bundles search -->
+    <template id="runbot.bundles_new">
+        <t t-call="runbot.layout_new">
+            <div class="o_runbot_bundle_row row" t-foreach="bundles" t-as="bundle" t-if="bundle.last_batchs">
+                <!-- TODO: missing style -->
+                <div class="o_runbot_bundle_info col-12 col-md-auto me-1 mb-2">
+                    <div class="text-truncate">
+                        <i t-if="bundle.sticky" class="o_runbot_sticky_star fa fa-star"/>
+                        <a t-attf-href="/runbot/bundle/#{bundle.id}" t-attf-title="View Bundle {{bundle.name}}" class="fw-bold" t-out="bundle.name"/>
+                    </div>
+                    <div class="btn-toolbar" role="toolbar">
+                        <!-- Fetch last batch for each category -->
+                        <t t-set="categories_and_batch"
+                            t-value="[(category, bundle.with_context(category_id=category.id).last_done_batch) for category in categories if category.id != active_category_id]"
+                        />
+                        <t t-set="categories_and_batch" t-value="[tpl for tpl in categories_and_batch if tpl[1]]"/>
+                        <div class="btn-group btn-group-ssm" role="group" t-if="categories_and_batch">
+                            <t t-foreach="categories_and_batch" t-as="category_and_batch">
+                                <t t-if="category_and_batch[0].view_id" t-call="{{category_and_batch[0].view_id.sudo().key}}">
+                                    <t t-set="category" t-value="category_and_batch[0]"/>
+                                    <t t-set="last_category_batch" t-value="category_and_batch[1]"/>
+                                </t>
+                                <a t-else=""
+                                    t-attf-title="View last {{category_and_batch[0].name}} batch"
+                                    t-attf-href="/runbot/batch/{{category_and_batch[1].id}}"
+                                    t-attf-class="btn btn-default fa fa-{{category_and_batch[0].icon}}"
+                                />
+                            </t>
+                        </div>
+                        <div class="btn-group" role="group">
+                            <t t-if="not bundle.sticky" t-call="runbot.branch_copy_button"/>
+                            <!-- TODO: check branch_github_menu -->
+                            <t t-call="runbot.branch_github_menu"/>
+                        </div>
+                    </div>
+                    <div t-if="bundle.host_id">
+                        <span class="badge text-bg-info" t-out="bundle.host_id.name"/>
+                    </div>
+                </div>
+                <div class="o_runbot_bundle_batch_row col">
+                    <div class="row g-2">
+                        <t t-foreach="enumerate(bundle.last_batchs)" t-as="e_batch">
+                            <t t-set="index" t-value="e_batch[0]"/>
+                            <div t-att-class="'col-12 col-sm-6 col-xl-3' if index &lt; 2 else 'col-xl-3 d-none d-xl-block'">
+                                <t t-call="runbot.batch_card">
+                                    <t t-set="batch" t-value="e_batch[1]"/>
+                                </t>
+                            </div>
+                        </t>
+                    </div>
+                </div>
+            </div>
+        </t>
+    </template>
+
+    <!-- Bundle "form" view -->
+    <template id="runbot.bundle_toolbar_middle_section">
+        <div class="btn-group btn-group-sm" role="group">
+            <a groups="runbot.group_runbot_advanced_user" t-attf-href="/web/#id={{bundle.id}}&amp;view_type=form&amp;model=runbot.bundle&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}" class="btn btn-default" target="new" title="View in Backend">
+                <i class="fa fa-list"/>
+            </a>
+            <a groups="runbot.group_runbot_advanced_user" class="btn btn-default" t-attf-href="/runbot/bundle/{{bundle.id}}/force" title="Force A New Batch">
+                <i class="fa fa-refresh"/>
+            </a>
+            <a t-if="bundle.env.user.has_group('runbot.group_runbot_advanced_user') or (bundle.env.user.has_group('runbot.group_user') and ':' in bundle.name)" class="btn btn-default" t-attf-href="/runbot/bundle/{{bundle.id}}/force/1" title="Force A New Batch with automatic rebase">
+                <i class="fa fa-fast-forward"/>
+            </a>
+            <t t-call="runbot.branch_copy_button">
+                <t t-set="btn_size" t-value="'btn'"/>
+            </t>
+            <t t-call="runbot.bundle_stats_dropdown"/>
+        </div>
+    </template>
+
+    <template id="runbot.bundle_new">
+        <t t-call="runbot.layout_new">
+            <div class="o_runbot_bundle row p-2">
+                <div class="col-12">
+                    <div class="container-lg p-0 card o_runbot_bundle_meta">
+                        <div class="card-header fw-medium"><t t-out="bundle.name"/> <i t-if="bundle.sticky" class="fa fa-star" style="color: #f0ad4e" /></div>
+                        <div class="o_runbot_grid o_runbot_grid_2">
+                            <t groups="base.group_user" t-if="not bundle.sticky and not bundle.is_base">
+                                <t t-if="bundle.no_build">
+                                    <div class="text-danger">Build disabled</div>
+                                    <div>
+                                        <a class="btn btn-primary btn-ssm"
+                                            t-attf-href="/runbot/bundle/toggle_no_build/{{bundle.id}}/0">
+                                        Enable builds
+                                        </a>
+                                    </div>
+                                </t>
+                                <t t-else="">
+                                    <div>Build enabled</div>
+                                    <div>
+                                        <a class="btn btn-secondary btn-ssm"
+                                            t-attf-href="/runbot/bundle/toggle_no_build/{{bundle.id}}/1">
+                                        Disable builds
+                                        </a>
+                                    </div>
+                                </t>
+                            </t>
+                            <div>Version</div>
+                            <div t-out="bundle.version_id.name"/>
+                            <div>Branches</div>
+                            <div class="row gx-0 gy-1">
+                                <t t-foreach="bundle._branch_groups().items()" t-as="group">
+                                    <div t-foreach="group[1]" t-as="branch" class="btn-group btn-group-ssm" role="group">
+                                        <a t-att-href="branch.branch_url" class="o_runbot_slot_btn_small btn btn-default text-start" title="View Branch on Github"><i class="fa fa-github"/></a>
+                                        <a groups="runbot.group_runbot_admin" class="o_runbot_slot_btn_small btn btn-default fa fa-list text-start" t-attf-href="/web/#id={{branch.id}}&amp;view_type=form&amp;model=runbot.branch" target="new" title="View Branch in Backend"/>
+                                        <a href="#" t-out="branch.remote_id.short_name" class="btn btn-default disabled text-start flex-grow-1"/>
+                                        <a t-attf-href="/runbot/branch/{{branch.id}}" class="btn btn-default text-start flex-grow-0" title="View Branch Details"><span t-att-class="'' if branch.alive else 'line-through'" t-out="branch.name"/> <i t-if="not branch.alive" title="deleted/closed" class="fa fa-ban text-danger"/></a>
+                                        <t t-if="not any (b.is_pr and b.alive for b in group[1]) and not branch.is_pr">
+                                            <a t-attf-href="https://{{group[0].main_remote_id.base_url}}/compare/{{bundle.version_id.name}}...{{branch.remote_id.owner}}:{{branch.name}}?expand=1" class="btn btn-default text-start flex-grow-0" title="Create pr"><i class="fa fa-code-fork"/> Create pr</a>
+                                        </t>
+                                    </div>
+                                </t>
+                            </div>
+                            <t t-if="more">
+                                <div>Project</div>
+                                <div t-out="bundle.project_id.name"/>
+                                <div>New build enabled</div>
+                                <div t-attf-class="fa fa-{{'times' if bundle.no_build else 'check'}}"/>
+                                <div>Modules</div>
+                                <div t-out="bundle.modules or '/'"/>
+                            </t>
+                        </div>
+                    </div>
+                </div>
+                <div t-foreach="bundle._consistency_warning()" t-as="warning" t-out="warning[1]" t-attf-class="col-12 alert alert-{{warning[0]}}"/>
+                <div class="col-12" t-foreach="batchs" t-as="batch">
+                    <t t-call="runbot.batch_card"/>
+                </div>
+            </div>
+        </t>
+    </template>
+</odoo>
diff --git a/runbot/templates/new/commit.xml b/runbot/templates/new/commit.xml
new file mode 100644
index 00000000..ecb4bbf8
--- /dev/null
+++ b/runbot/templates/new/commit.xml
@@ -0,0 +1,121 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<odoo>
+  <template id="runbot.commit_status_state_cell">
+    <div>
+      <t t-if="state == 'pending'">
+        <i class="fa fa-circle text-warning"/> <t t-out="state"/>
+      </t>
+      <t t-if="state == 'success'">
+        <i class="fa fa-check text-success"/> <t t-out="state"/>
+      </t>
+      <t t-if="state in ('failure', 'error')">
+        <i class="fa fa-times text-danger"/> <t t-out="state"/>
+      </t>
+    </div>
+  </template>
+
+  <template id="runbot.commit_new">
+    <t t-call="runbot.layout_new">
+      <div class="o_runbot_commit row g-2">
+        <!-- Commit base information -->
+        <div class="col-lg-6">
+          <div class="card">
+            <div class="card-header px-2 py-1">Commit</div>
+            <div class="o_runbot_grid o_runbot_grid_2 o_runbot_grid_striped">
+              <div>Name</div>
+              <div>
+                <t t-out="commit.name"/>
+                <div class="btn-group" role="group">
+                  <a t-att-href="'' if not reflogs else 'https://%s/commit/%s' % (reflogs[0].branch_id.remote_id.base_url, commit.name)" class="btn btn-sm text-start" title="View Commit on Github"><i class="fa fa-github"/></a>
+                  <a groups="runbot.group_runbot_admin" class="btn btn-sm fa fa-list text-start" t-attf-href="/web/#id={{commit.id}}&amp;view_type=form&amp;model=runbot.commit" target="new" title="View Commit in Backend"/>
+                </div>
+              </div>
+              <div>Tree hash</div>
+              <div t-out="commit.tree_hash"/>
+              <div>Repo</div>
+              <div t-out="commit.repo_id.name"/>
+              <div>Subject</div>
+              <div t-out="commit.subject"/>
+              <div>Date</div>
+              <div t-out="commit.date"/>
+              <div>Author</div>
+              <div>
+                <t t-out="commit.author"/>
+                <small t-out="commit.author_email"/>
+              </div>
+              <t t-if="commit.author != commit.committer">
+                <div>Committer</div>
+                <div>
+                  <t t-out="commit.committer"/>
+                  <small t-out="commit.committer_email"/>
+                </div>
+              </t>
+            </div>
+          </div>
+        </div>
+        <!-- Status -->
+        <div class="col-lg-6">
+          <div class="card">
+            <div class="card-header px-2 py-1">Last Status</div>
+            <div class="o_runbot_grid o_runbot_grid_5 o_runbot_commit_status_grid">
+              <t t-foreach="last_status_by_context" t-as="context">
+                <t t-set="status" t-value="last_status_by_context[context]"/>
+                <div t-out="status.sent_date and status.sent_date.strftime('%Y-%m-%d %H:%M:%S') or '—'"/>
+                <div t-out="context"/>
+                <t t-call="runbot.commit_status_state_cell">
+                  <t t-set="state" t-value="status.state"/>
+                </t>
+                <div>
+                  <a t-att-href="status.target_url">
+                    Build <t t-if="status.target_url" t-out="status.target_url.split('/')[-1]"/>
+                  </a>
+                </div>
+                <div>
+                  <div class="btn-group btn-group-ssm" role="group">
+                    <a groups="base.group_user" class="btn btn-default" t-attf-href="/runbot/commit/resent/{{status.id}}" title="Resend github status">
+                      <i class="fa fa-repeat"/>
+                    </a>
+                  </div>
+                </div>
+              </t>
+            </div>
+          </div>
+        </div>
+        <div class="col-lg-6">
+          <div class="card">
+            <div class="card-header px-2 py-1">Branch presence history</div>
+            <div class="o_runbot_grid o_runbot_grid_3 o_runbot_grid_auto">
+              <t t-foreach="reflogs" t-as="reflog">
+                <div t-out="reflog.date"/>
+                <div t-out="reflog.branch_id.remote_id.short_name"/>
+                <div>
+                  <a t-attf-href="/runbot/branch/{{reflog.branch_id.id}}" t-out="reflog.branch_id.name" title="View Branch Details"/>
+                </div>
+              </t>
+            </div>
+          </div>
+        </div>
+        <div class="col-lg-6">
+          <div class="card">
+            <div class="card-header px-2 py-1">Status history</div>
+            <div class="o_runbot_grid o_runbot_grid_4 o_runbot_commit_status_history_grid">
+              <t t-foreach="status_list" t-as="status">
+                <div t-out="status.sent_date and status.sent_date.strftime('%Y-%m-%d %H:%M:%S') or '—'"/>
+                <div t-out="status.context"/>
+                <t t-call="runbot.commit_status_state_cell">
+                  <t t-set="state" t-value="status.state"/>
+                </t>
+                <div>
+                  <a t-attf-href="/runbot/build/{{status.build_id.id}}">
+                    build
+                    <t t-out="status.build_id.id" />
+                  </a>
+                </div>
+              </t>
+            </div>
+          </div>
+        </div>
+      </div>
+    </t>
+  </template>
+</odoo>
diff --git a/runbot/templates/new/page.xml b/runbot/templates/new/page.xml
new file mode 100644
index 00000000..1fa2fa34
--- /dev/null
+++ b/runbot/templates/new/page.xml
@@ -0,0 +1,301 @@
+<?xml version="1.0" encoding="utf-8"?>
+<odoo>
+
+  <!-- TODO: figure out proper keepquery logic -->
+
+  <!-- Basic page layout, this is just assets -->
+  <template id="runbot.base_page_new">
+    <html>
+      <title t-out="title or 'Runbot'" />
+
+      <meta name="runbot-project-id" t-att-content="project.id" />
+
+      <t t-call-assets="runbot.assets_frontend" />
+
+      <t t-if="refresh">
+        <!-- TODO: replace this with javascript code -->
+        <meta http-equiv="refresh" t-att-content="refresh" />
+      </t>
+
+      <t t-if="not page_info_state or page_info_state == 'ok' or page_info_state not in ('warn', 'ko', 'skipped', 'killed', 'manually_killed')">
+        <link rel="icon" type="image/png" href="/runbot/static/src/img/icon_ok.png" />
+        <link rel="icon" type="image/svg+xml" href="/runbot/static/src/img/icon_ok.svg" />
+      </t>
+      <t t-elif="page_info_state == 'ko'">
+        <link rel="icon" type="image/png" href="/runbot/static/src/img/icon_ko.png" />
+        <link rel="icon" type="image/svg+xml" href="/runbot/static/src/img/icon_ko.svg" />
+      </t>
+      <t t-elif="page_info_state == 'warn'">
+        <link rel="icon" type="image/png" href="/runbot/static/src/img/icon_warn.png" />
+        <link rel="icon" type="image/svg+xml" href="/runbot/static/src/img/icon_warn.svg" />
+      </t>
+      <t t-elif="page_info_state == 'skipped'">
+        <link rel="icon" type="image/png" href="/runbot/static/src/img/icon_skipped.png" />
+        <link rel="icon" type="image/svg+xml" href="/runbot/static/src/img/icon_skipped.svg" />
+      </t>
+      <t t-elif="page_info_state == 'killed' or page_info_state == 'manually_killed'">
+        <link rel="icon" type="image/png" href="/runbot/static/src/img/icon_killed.png" />
+        <link rel="icon" type="image/svg+xml" href="/runbot/static/src/img/icon_killed.svg" />
+      </t>
+
+    </html>
+    <body>
+      <t t-out="0" />
+    </body>
+  </template>
+
+  <template id="runbot.layout_navbar">
+    <!-- 
+      Context used;
+      class Navbar(TypedDict):
+          project: self.env['runbot.project']
+          projects: Optional[self.env['runbot.project']]
+          qu: QueryURL object
+          nb_assigned_errors: int
+          nb_team_errors: int
+          nb_build_errors: int
+          has_pr: Optional[bool]
+    -->
+    <nav class="navbar navbar-expand-sm sticky-top shadow-sm bg-body-tertiary">
+      <div class="container-fluid">
+        <div class="navbar-brand">
+          <a class="text-reset text-decoration-none text-initial" t-out="project.name"
+            t-att-href="qu('/runbot/%s' % slug(project))" />
+          <span t-if="projects and len(projects) > 1"
+            class="dropdown-toggle dropdown-toggle-caret d-none d-sm-inline" role="button"
+            data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false" />
+          <ul t-if="projects and len(projects) > 1" class="dropdown-menu">
+            <li>
+              <h6 class="dropdown-header">Change Project</h6>
+            </li>
+            <li>
+              <a class="dropdown-item active" t-out="project.name"
+                t-att-href="qu('/runbot/%s' % slug(project))" />
+            </li>
+            <li>
+              <hr class="dropdown-divider" />
+            </li>
+            <t t-foreach="projects" t-as="_project">
+              <li t-if="project.id != _project.id">
+                <a class="dropdown-item" t-att-href="qu('/runbot/%s' % slug(_project))"
+                  t-out="_project.name" />
+              </li>
+            </t>
+          </ul>
+        </div>
+        <button
+          class="navbar-toggler"
+          type="button"
+          data-bs-toggle="offcanvas"
+          data-bs-target="#navbarOffCanvas"
+          aria-label="Toggle navigation"
+        >
+          <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="offcanvas offcanvas-end" tabindex="-1" id="navbarOffCanvas">
+          <div class="offcanvas-header">
+            <h5 class="offcanvas-title" t-out="project.name" />
+            <button
+              type="button"
+              class="btn-close"
+              data-bs-dismiss="offcanvas"
+              aria-label="Close"
+            />
+          </div>
+          <div class="offcanvas-body">
+            <ul class="navbar-nav justify-content-end flex-grow-1 pe-3">
+              <li class="nav-item d-sm-none">
+                <a class="nav-link active" aria-current="page"
+                  t-att-href="qu('/runbot/%s' % slug(project))" t-out="project.name" />
+              </li>
+              <t t-foreach="projects" t-as="_project">
+                <li t-if="project.id != _project.id" class="nav-item d-sm-none">
+                  <a class="nav-link" t-att-href="qu('/runbot/%s' % slug(_project))"
+                    t-out="_project.name" />
+                </li>
+              </t>
+              <!-- TODO: js code to open preferences -->
+              <li class="nav-item divider" />
+              <li class="nav-item dropdown o_runbot_preferences">
+                <a class="nav-link" href="#" data-bs-toggle="dropdown" data-bs-auto-close="outside">
+                  <i class="fa fa-gear" />
+                </a>
+                <div class="dropdown-menu" role="menu">
+                  <div class="form-check form-switch m-2"
+                    title="Displays more information (requires reload)">
+                    <label class="form-check-label" for="navbarMoreInfo">More info</label>
+                    <input class="form-check-input o_runbot_more_info" id="navbarMoreInfo"
+                      t-att-checked="more" type="checkbox" />
+                  </div>
+                  <div class="dropdown-divider" />
+                  <div class="form-floating m-2">
+                    <select class="form-select o_runbot_theme_switcher" id="navbarThemeSelector"
+                      aria-label="Change Theme">
+                      <option value="light">Light</option>
+                      <option value="dark">Dark</option>
+                      <option value="legacy">Legacy</option>
+                      <option value="red404">Red404</option>
+                    </select>
+                    <label for="navbarThemeSelector">Theme</label>
+                  </div>
+                  <div class="dropdown-divider" groups="base.group_user" />
+                  <a class="dropdown-item o_runbot_manage_filters" role="menuitem" href="#"
+                    groups="base.group_user">
+                    Manage filters
+                  </a>
+                </div>
+              </li>
+              <li class="nav-item divider" />
+              <t t-if="not user_id._is_public()">
+                <li class="nav-item" t-if="nb_assigned_errors">
+                  <a href="/runbot/errors" class="nav-link text-danger"
+                    t-attf-title="You have {{nb_assigned_errors}} random bug assigned">
+                    <i class="fa fa-bug" />
+                    <t t-out="nb_assigned_errors" />
+                    <span class="text-warning" t-if="nb_team_errors"
+                      t-out="'+ ' + str(nb_team_errors)" />
+                  </a>
+                </li>
+                <li class="nav-item" t-elif="nb_team_errors">
+                  <a href="/runbot/errors" class="nav-link text-warning"
+                    t-attf-title="Your team has {{nb_team_errors}} random bug assigned">
+                    <i class="fa fa-bug" />
+                    <t t-out="nb_team_errors" />
+                  </a>
+                </li>
+                <li class="nav-item" t-elif="nb_build_errors">
+                  <a href="/runbot/errors" class="nav-link" title="Random Bugs">
+                    <i class="fa fa-bug" />
+                  </a>
+                </li>
+                <li class="nav-item dropdown" t-ignore="true">
+                  <a href="#" class="o_runbot_navbar_username nav-link fw-bold text-truncate"
+                    data-bs-toggle="dropdown" t-out="user_id.name" />
+                  <div class="dropdown-menu dropdown-menu-end" role="menu">
+                    <a class="dropdown-item" id="o_logout" role="menuitem"
+                      t-attf-href="/web/session/logout?redirect=/">Logout</a>
+                    <a class="dropdown-item" role="menuitem" t-attf-href="/web">Web</a>
+                    <div t-if="user_id.runbot_team_ids" class="dropdown-divider" />
+                    <div t-if="user_id.runbot_team_ids" class="dropdown-header">Teams</div>
+                    <a t-foreach="user_id.runbot_team_ids" t-as="team" class="dropdown-item"
+                      role="menuitem" t-attf-href="/runbot/teams/{{team.id}}">
+                      <t t-out="team.name.capitalize()" />
+                    </a>
+                  </div>
+                </li>
+              </t>
+              <li class="nav-item" t-else="" t-ignore="true">
+                <a class="nav-link fw-bold"
+                  t-attf-href="/web/login?redirect={{request.httprequest.path}}">Login</a>
+              </li>
+            </ul>
+            <form class="mt-3 mb-0 mt-sm-0 d-flex" t-attf-action="/runbot/{{slug(project)}}">
+              <div class="input-group me-2 flex-grow-1">
+                <input class="form-control" type="search" name="search" placeholder="Search"
+                  aria-label="Search" t-att-value="search"/>
+              </div>
+              <div class="btn-group">
+                <div class="input-group-text o_runbot_btn_haspr btn btn-outline-primary p-0"
+                  type="button" tabindex="0">
+                  <input type="checkbox" tabindex="0" id="searchHasPr" name="has_pr" class="d-none"
+                    t-att-checked="bool(request.params.get('has_pr'))"/>
+                  <label for="searchHasPr" class="py-2 px-3 w-100 h-100 align-content-center"
+                    role="button">
+                    <i class="fa fa-github"></i>
+                  </label>
+                </div>
+                <button class="btn btn-outline-success" type="submit">Search</button>
+              </div>
+            </form>
+          </div>
+        </div>
+      </div>
+    </nav>
+  </template>
+
+  <template id="runbot.layout_toolbar_start_section">
+    <div t-if="toolbar.get('breadcrumbs') and len(toolbar.get('breadcrumbs')) > 1"
+      class="o_runbot_toolbar_breadcrumbs d-flex">
+      <t t-set="breadcrumbs" t-value="toolbar.get('breadcrumbs')" />
+      <ol class="breadcrumb flex-nowrap text-nowrap lh-sm">
+        <li
+          t-foreach="breadcrumbs" t-as="breadcrumb"
+          t-attf-class="breadcrumb-item d-inline-flex{{' active' if breadcrumb == breadcrumbs[-1] else None}}"
+          t-att-aria-current="'page' if breadcrumb == breadcrumbs[-1] else None"
+        >
+          <a t-if="breadcrumb != breadcrumbs[-1]" t-att-href="breadcrumb.url"
+            t-out="breadcrumb.name" />
+          <t t-else="" t-out="breadcrumb.name" />
+        </li>
+      </ol>
+    </div>
+  </template>
+
+  <template id="runbot.layout_toolbar_middle_section">
+    <div t-if="toolbar.get('message')" class="alert alert-warning m-0" role="alert"
+      t-out="toolbar.get('message')" />
+  </template>
+
+  <template id="runbot.layout_toolbar_end_section">
+    <a t-if="toolbar.get('pending_count')" href="/runbot/load_info" class="text-decoration-none">
+      <span t-attf-class="badge text-bg-{{toolbar.get('pending_level')}}"> Pending: <t
+          t-out="toolbar.get('pending_count')" />
+                <span t-if="toolbar.get('pending_assigned_count')"
+          title="Assigned build (reserved host)"> (<t t-out="toolbar.get('pending_assigned_count')" />
+        )
+                </span>
+      </span>
+    </a>
+    <a href="/runbot/load_info" t-if="toolbar.get('hosts_data') is not None"
+      class="slots_infos text-decoration-none">
+      <t t-set="testing" t-value="toolbar.get('hosts_data')._total_testing()" />
+      <t t-set="workers" t-value="toolbar.get('hosts_data')._total_workers()" />
+      <t t-set="klass">success</t>
+      <t t-if="not workers" t-set="klass">danger</t>
+      <t t-else="">
+        <t t-if="int(testing)/workers > 0" t-set="klass">info</t>
+        <t t-if="int(testing)/workers > 0.75" t-set="klass">warning</t>
+        <t t-if="int(testing)/workers >= 1" t-set="klass">danger</t>
+      </t>
+      <span t-attf-class="badge text-bg-{{klass}}"> Testing: <t t-out="testing" /> / <t
+          t-out="workers" />
+      </span>
+    </a>
+  </template>
+
+  <template id="runbot.layout_toolbar">
+    <div t-if="toolbar"
+      t-att-class="'o_runbot_toolbar row bg-body' + (' position-sticky z-1' if toolbar.get('sticky', True) else '')">
+      <div
+        class="d-flex flex-wrap flex-md-nowrap justify-content-between align-items-center gap-md-3">
+        <!-- Toolbar is made of left middle and right part -->
+        <div class="d-flex d-empty-none order-0" style="flex: 1;">
+          <t t-call="{{toolbar.get('start_template', 'runbot.layout_toolbar_start_section')}}" />
+        </div>
+        <div class="d-flex d-empty-none justify-content-start justify-content-md-around order-2 order-md-1 w-100 w-md-auto mw-100">
+          <t t-call="{{toolbar.get('middle_template', 'runbot.layout_toolbar_middle_section')}}" />
+        </div>
+        <div class="d-flex d-empty-none justify-content-end order-1 order-md-2 flex-grow-1 gap-1"
+          style="flex: 1;">
+          <t t-call="{{toolbar.get('end_template', 'runbot.layout_toolbar_end_section')}}" />
+        </div>
+      </div>
+    </div>
+  </template>
+
+  <template id="runbot.layout_new">
+    <t t-call="runbot.base_page_new">
+      <t t-call="{{layout_nav_template or 'runbot.layout_navbar'}}" />
+      <div class="container-fluid o_runbot_main_container d-flex flex-column">
+        <t t-call="{{layout_nav_toolbar or 'runbot.layout_toolbar'}}" />
+        <t t-out="0" />
+      </div>
+    </t>
+  </template>
+
+  <template id="runbot.pager">
+    <t t-call="portal.pager">
+      <t t-set="classname" t-value="'pagination-sm'"/>
+    </t>
+  </template>
+</odoo>
diff --git a/runbot/templates/new/slot.xml b/runbot/templates/new/slot.xml
new file mode 100644
index 00000000..dfa77350
--- /dev/null
+++ b/runbot/templates/new/slot.xml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<odoo>
+    <template id="runbot.slot_btn_group">
+        <t t-set="bu" t-value="slot.build_id"/>
+        <t t-set="color" t-value="bu._get_color_class()"/>
+        <div class="o_runbot_slot_btn_group btn-group btn-group-ssm">
+            <button t-attf-class="o_runbot_slot_btn_small btn btn-{{color}} disabled fa fa-{{slot._fa_link_type()}}" t-att-title="slot.link_type"/>
+            <a t-att-href="'/runbot/batch/%s/build/%s' % (slot.batch_id.id, bu.id) if bu else None"
+                t-attf-class="btn btn-default text-start text-nowrap text-truncate flex-grow-1{{' disabled' if not bu else ''}}"
+                t-out="slot.trigger_id.name"
+            />
+            <a t-if="slot.trigger_id.report_view_id" title="View last trigger report" t-attf-href="/runbot/trigger/report/{{slot.trigger_id.id}}" class="o_runbot_slot_btn_small fa fa-eye btn btn-info"/>
+            <a t-if="bu.local_state == 'running' and bu.database_ids" t-attf-href="/runbot/run/{{bu.id}}" class="o_runbot_slot_btn_small fa fa-sign-in btn btn-info"/>
+            <a t-if="bu.static_run" t-att-href="bu.static_run" class="o_runbot_slot_btn_small fa fa-sign-in btn btn-info"/>
+            <t t-if="bu" t-call="runbot.build_menu"/>
+            <a t-if="not bu" groups="base.group_user" class="o_runbot_slot_btn_small btn btn-default" title="Create build" t-attf-href="/runbot/batch/slot/{{slot.id}}/build">
+                <i class="fa fa-play fa-fw"/>
+            </a>
+        </div>
+    </template>
+</odoo>
diff --git a/runbot/templates/utils.xml b/runbot/templates/utils.xml
index bb12973d..85219607 100644
--- a/runbot/templates/utils.xml
+++ b/runbot/templates/utils.xml
@@ -289,98 +289,102 @@
         </template>
 
         <template id="runbot.build_menu">
-            <button t-attf-class="btn btn-default dropdown-toggle" data-bs-toggle="dropdown" title="Build options" aria-label="Build options" aria-expanded="false">
+            <button t-attf-class="o_runbot_build_menu btn btn-default dropdown-toggle" data-bs-toggle="dropdown" title="Build options" aria-label="Build options" aria-expanded="false">
                 <i t-attf-class="fa  {{'fa-spinner' if bu.global_state == 'pending' else 'fa-cog'}} {{'' if bu.global_state in ('done', 'running') else 'fa-spin'}} fa-fw"/>
                 <span class="caret"/>
-            </button>
-            <div class="dropdown-menu dropdown-menu-end" role="menu">
-                <a t-if="bu.global_result=='skipped'" groups="runbot.group_runbot_admin" class="dropdown-item" href="#" data-runbot="rebuild" t-att-data-runbot-build="bu['id']">
-                    <i class="fa fa-level-up"/>
-                    Force Build
-                </a>
-                <t t-if="bu.local_state=='running'">
-                    <t t-foreach="bu.database_ids[1:].sorted('name')" t-as="db">
-                        <a class="dropdown-item" t-attf-href="/runbot/run/{{bu.id}}/{{db.db_suffix}}">
+                <div class="dropdown-menu dropdown-menu-end" role="menu">
+                    <a t-if="bu.global_result=='skipped'" groups="runbot.group_runbot_admin" class="dropdown-item" href="#" data-runbot="rebuild" t-att-data-runbot-build="bu['id']">
+                        <i class="fa fa-level-up"/>
+                        Force Build
+                    </a>
+                    <t t-if="bu.local_state=='running'">
+                        <t t-foreach="bu.database_ids[1:].sorted('name')" t-as="db">
+                            <a class="dropdown-item" t-attf-href="/runbot/run/{{bu.id}}/{{db.db_suffix}}">
+                                <i class="fa fa-sign-in"/>
+                                Connect <t t-out="db.db_suffix"></t>
+                            </a>
+                        </t>
+                        <a class="dropdown-item" t-attf-href="http://{{bu.domain}}/web/database/selector">
                             <i class="fa fa-sign-in"/>
-                            Connect <t t-out="db.db_suffix"></t>
+                            Database selector
                         </a>
                     </t>
-                    <a class="dropdown-item" t-attf-href="http://{{bu.domain}}/web/database/selector">
-                        <i class="fa fa-sign-in"/>
-                        Database selector
+                    <a class="dropdown-item" t-if="bu.global_state in ['done','running'] or bu.requested_action == 'deathrow'" groups="base.group_user" href="#" data-runbot="rebuild" t-att-data-runbot-build="bu['id']" title="Retry this build, usefull for false positive">
+                        <i class="fa fa-refresh"/>
+                        Rebuild
                     </a>
-                </t>
-                <a class="dropdown-item" t-if="bu.global_state in ['done','running'] or bu.requested_action == 'deathrow'" groups="base.group_user" href="#" data-runbot="rebuild" t-att-data-runbot-build="bu['id']" title="Retry this build, usefull for false positive">
-                    <i class="fa fa-refresh"/>
-                    Rebuild
-                </a>
-                <t t-if="bu.global_state != 'done'">
-                    <t t-if="bu.requested_action != 'deathrow'">
-                        <a groups="base.group_user" href="#" data-runbot="kill" class="dropdown-item" t-att-data-runbot-build="bu['id']">
-                            <i class="fa fa-crosshairs"/>
-                            Kill
+                    <t t-if="bu.global_state != 'done'">
+                        <t t-if="bu.requested_action != 'deathrow'">
+                            <a groups="base.group_user" href="#" data-runbot="kill" class="dropdown-item" t-att-data-runbot-build="bu['id']">
+                                <i class="fa fa-crosshairs"/>
+                                Kill
+                            </a>
+                        </t>
+                        <t t-else="">
+                            <a groups="base.group_user" class="dropdown-item disabled">
+                                <i class="fa fa-spinner fa-spin"/>
+                                Killing
+                                <i class="fa fa-crosshairs"/>
+                            </a>
+                        </t>
+                    </t>
+                    <t t-if="bu.global_state == 'done'">
+                        <t t-if="bu.requested_action != 'wake_up' and bu.database_ids">
+                            <a groups="base.group_user" class="dropdown-item" href="#" data-runbot="wakeup" t-att-data-runbot-build="bu['id']">
+                                <i class="fa fa-coffee"/>
+                                Wake up
+                            </a>
+                        </t>
+                        <t t-if="bu.requested_action == 'wake_up'">
+                            <a groups="base.group_user" class="dropdown-item disabled">
+                                <i class="fa fa-spinner fa-spin"/>
+                                Waking up
+                                <i class="fa fa-crosshairs"/>
+                            </a>
+                        </t>
+                    </t>
+                    <div t-if="bu.global_state not in ('testing', 'waiting', 'pending') and bu.log_list" groups="base.group_user" class="dropdown-divider"/>
+                    <t t-set="log_url" t-value="'http://%s' % bu.host if bu.host != fqdn else ''"/>
+                    <t t-if="bu.host" t-foreach="bu.log_list.split(',') if bu.log_list else []" t-as="log_name">
+                        <a class="dropdown-item" t-attf-href="{{log_url}}/runbot/static/build/#{bu.dest}/logs/#{log_name}.txt">
+                            <i class="fa fa-file-text-o"/>
+                            Full
+                            <t t-out="log_name"/>
+                            logs
                         </a>
                     </t>
-                    <t t-else="">
-                        <a groups="base.group_user" class="dropdown-item disabled">
-                            <i class="fa fa-spinner fa-spin"/>
-                            Killing
-                            <i class="fa fa-crosshairs"/>
+                    <div class="dropdown-divider" groups="runbot.group_runbot_admin,runbot.group_build_config_user"/>
+                    <t groups="runbot.group_runbot_admin">
+                        <a class="dropdown-item" t-attf-href="/runbot/build/search?config_id={{bu.params_id.config_id.id}}&amp;trigger_id={{bu.params_id.trigger_id.id}}&amp;version_id={{bu.params_id.version_id.id}}&amp;create_batch_id.bundle_id={{bu.params_id.create_batch_id.bundle_id.id}}&amp;description={{bu.description or ''}}">
+                            <i class="fa fa-search"/>
+                            Find similar builds
+                        </a>
+                        <a class="dropdown-item" t-attf-href="/web/#id={{bu['id']}}&amp;view_type=form&amp;model=runbot.build&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}" target="new">
+                            <i class="fa fa-list"/>
+                            View in backend
                         </a>
                     </t>
-                </t>
-                <t t-if="bu.global_state == 'done'">
-                    <t t-if="bu.requested_action != 'wake_up' and bu.database_ids">
-                        <a groups="base.group_user" class="dropdown-item" href="#" data-runbot="wakeup" t-att-data-runbot-build="bu['id']">
-                            <i class="fa fa-coffee"/>
-                            Wake up
-                        </a>
-                    </t>
-                    <t t-if="bu.requested_action == 'wake_up'">
-                        <a groups="base.group_user" class="dropdown-item disabled">
-                            <i class="fa fa-spinner fa-spin"/>
-                            Waking up
-                            <i class="fa fa-crosshairs"/>
-                        </a>
-                    </t>
-                </t>
-                <div t-if="bu.global_state not in ('testing', 'waiting', 'pending')" groups="base.group_user" class="dropdown-divider"/>
-                <t t-set="log_url" t-value="'http://%s' % bu.host if bu.host != fqdn else ''"/>
-                <t t-if="bu.host" t-foreach="bu.log_list.split(',') if bu.log_list else []" t-as="log_name">
-                    <a class="dropdown-item" t-attf-href="{{log_url}}/runbot/static/build/#{bu.dest}/logs/#{log_name}.txt">
-                        <i class="fa fa-file-text-o"/>
-                        Full
-                        <t t-out="log_name"/>
-                        logs
-                    </a>
-                </t>
-                <t groups="runbot.group_runbot_admin">
-                    <div class="dropdown-divider"/>
-                    <a class="dropdown-item" t-attf-href="/runbot/build/search?config_id={{bu.params_id.config_id.id}}&amp;trigger_id={{bu.params_id.trigger_id.id}}&amp;version_id={{bu.params_id.version_id.id}}&amp;create_batch_id.bundle_id={{bu.params_id.create_batch_id.bundle_id.id}}&amp;description={{bu.description or ''}}">
-                        <i class="fa fa-search"/>
-                        Find similar builds
-                    </a>
-                    <a class="dropdown-item" t-attf-href="/web/#id={{bu['id']}}&amp;view_type=form&amp;model=runbot.build&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}" target="new">
+                    <a groups="runbot.group_build_config_user" class="dropdown-item" t-attf-href="/web/#id={{bu.params_id.config_id.id}}&amp;view_type=form&amp;model=runbot.build.config&amp;menu_id={{env['ir.model.data']._xmlid_to_res_id('runbot.runbot_menu_root')}}" target="new">
                         <i class="fa fa-list"/>
-                        View in backend
+                        View config in backend
                     </a>
-                </t>
-            </div>
+                </div>
+            </button>
         </template>
 
         <template id="runbot.branch_github_menu">
-          <button t-attf-class="btn btn-default btn-ssm" data-bs-toggle="dropdown" title="Github links" aria-label="Github links" aria-expanded="false">
-            <i t-attf-class="fa fa-github {{'text-primary' if any(branch_id.is_pr and branch_id.alive for branch_id in bundle.branch_ids) else 'text-secondary' if all(not branch_id.alive for branch_id in bundle.branch_ids) else ''}}"/>
-            <span class="caret"/>
-          </button>
-          <div  class="dropdown-menu" role="menu">
-            <t t-foreach="bundle.branch_ids.sorted(key=lambda b: (not b.alive, b.remote_id.repo_id.sequence, b.remote_id.repo_id.id, b.is_pr, b.id))" t-as="branch">
-              <t t-set="link_title" t-value="'View %s %s on Github' % ('PR' if branch.is_pr else 'Branch', branch.name)"/>
-              <a t-att-href="branch.branch_url" class="dropdown-item" t-att-title="link_title">
-                <span class="fst-italic text-muted" t-out="branch.remote_id.short_name"/> <span t-att-class="'' if branch.alive else 'line-through'" t-out="branch.name"/> <i t-if="not branch.alive" title="deleted/closed" class="fa fa-ban text-danger"/>
-              </a>
-            </t>
-          </div>
+            <button t-attf-class="btn btn-default btn-ssm" data-bs-toggle="dropdown" title="Github links" aria-label="Github links" aria-expanded="false">
+                <i t-attf-class="fa fa-github {{'text-primary' if any(branch_id.is_pr and branch_id.alive for branch_id in bundle.branch_ids) else 'text-secondary' if all(not branch_id.alive for branch_id in bundle.branch_ids) else ''}}"/>
+                <span class="caret"/>
+                <div class="dropdown-menu" role="menu">
+                    <t t-foreach="bundle.branch_ids.sorted(key=lambda b: (not b.alive, b.remote_id.repo_id.sequence, b.remote_id.repo_id.id, b.is_pr, b.id))" t-as="branch">
+                    <t t-set="link_title" t-value="'View %s %s on Github' % ('PR' if branch.is_pr else 'Branch', branch.name)"/>
+                    <a t-att-href="branch.branch_url" class="dropdown-item" t-att-title="link_title">
+                        <span class="font-italic text-muted" t-out="branch.remote_id.short_name"/> <span t-att-class="'' if branch.alive else 'line-through'" t-out="branch.name"/> <i t-if="not branch.alive" title="deleted/closed" class="fa fa-ban text-danger"/>
+                    </a>
+                    </t>
+                </div>
+            </button>
         </template>
 
         <template id="runbot.branch_copy_button">
diff --git a/runbot/views/repo_views.xml b/runbot/views/repo_views.xml
index 74792600..91e677a2 100644
--- a/runbot/views/repo_views.xml
+++ b/runbot/views/repo_views.xml
@@ -291,4 +291,4 @@
     </record>
 
   </data>
-</odoo>
\ No newline at end of file
+</odoo>