Generate Bootstrap5 HTML if LWC >= 3.9

lizmap/plugin.py

@@ -3014,7 +3014,10 @@ def maptip_from_form(self):
 
  root = config.invisibleRootContainer()
  relation_manager = self.project.relationManager()
- html_content = Tooltip.create_popup_node_item_from_form(layer, root, 0, [], '', relation_manager)
+ html_content = Tooltip.create_popup_node_item_from_form(
+ layer, root, 0, [], '', relation_manager,
+ bootstrap_5=self.current_lwc_version() >= LwcVersions.Lizmap_3_9,
+ )
  html_content = Tooltip.create_popup(html_content)
  html_content += Tooltip.css()
  self._set_maptip(layer, html_content)

lizmap/tooltip.py

@@ -60,6 +60,7 @@ def create_popup_node_item_from_form(
  headers: list,
  html: str,
  relation_manager: QgsRelationManager,
+ bootstrap_5: bool = False,
  ) -> str:
  regex = re.compile(r"[^a-zA-Z0-9_]", re.IGNORECASE)
  a = ''
@@ -173,9 +174,22 @@ def create_popup_node_item_from_form(
  if visibility and not active:
  active = visibility
  h += '\n' + SPACES
- h += (
- '<li class="nav-item"><button class="nav-link {}" data-bs-toggle="tab" data-bs-target="#popup_dd_[% $id %]_{}">{}</button></li>'
- ).format(active, regex.sub('_', node.name()), node.name())
+ id_tab = regex.sub('_', node.name())
+ if bootstrap_5:
+ h += (
+ f'<li class="nav-item">'
+ f'<button class="nav-link {active}" data-bs-toggle="tab" '
+ f'data-bs-target="#popup_dd_[% $id %]_{id_tab}">'
+ f'{node.name()}'
+ f'</button>'
+ f'</li>'
+ )
+ else:
+ h += (
+ f'<li class="{active}">'
+ f'<a href="#popup_dd_[% $id %]_{id_tab}" data-toggle="tab">{node.name()}</a>'
+ f'</li>'
+ )
  headers.append(h)
 
  if lvl > 1:
@@ -190,7 +204,8 @@ def create_popup_node_item_from_form(
 
  level += 1
  for n in node.children():
- h = Tooltip.create_popup_node_item_from_form(layer, n, level, headers, html, relation_manager)
+ h = Tooltip.create_popup_node_item_from_form(
+ layer, n, level, headers, html, relation_manager, bootstrap_5)
  # If it is not root children, add html
  if lvl > 0:
  a += h