bug: add message to browse page when no subcoms

invenio_app_rdm/communities_ui/templates/semantic-ui/invenio_communities/details/browse/index.html

@@ -13,6 +13,7 @@
 {% set active_community_header_menu_item= 'browse' %}
 {% set subcommunities_endpoint = community["links"]["subcommunities"] %}
 {% set community_slug = community["slug"] %}
+{% set can_have_children = community["children"]["allow"] %}
 
 {%- block javascript %}
 {{ super() }}
@@ -34,16 +35,25 @@ <h1 class="ui medium header mb-0 align-self-center">{{ ctree.title }}</h1>
   </div>
 </div>
 {%- endfor -%}
-<div id='invenio-browse-config' data-api-endpoint='{{ subcommunities_endpoint }}'
-  class="ui container theme-font communities-frontpage rel-mt-3 rel-mb-2">
+<div class="ui container theme-font communities-frontpage rel-mt-3 rel-mb-2">
   <div class="flex">
     <h1 class="ui medium header mb-0 align-self-center">{{ config.get("APP_RDM_SUBCOMMUNITIES_LABEL", _("Subcommunities")) }}</h1>
+    {% if can_have_children %}
     <a class="align-self-center rel-ml-1"
-      href="{{url_for('invenio_communities.communities_subcommunities', pid_value=community_slug)}}">
-      {{ _('See all')}}
+        href="{{url_for('invenio_communities.communities_subcommunities', pid_value=community_slug)}}">
+        {{ _('See all')}}
     </a>
+    {% endif %}
   </div>
   <div class="ui divider mt-0"></div>
-  <div id="subcommunities-container"></div>
+  {% if can_have_children %}
+    <div id="subcommunities-container" data-api-endpoint='{{ subcommunities_endpoint }}'></div>
+  {% else %}
+    <div class="ui icon message"><i aria-hidden="true" class="info icon"></i>
+        <div class="content">
+            <div class="header">{{ _('This community has no subcommunities') }}</div>
+        </div>
+    </div>
+  {% endif %}
 </div>
 {%- endblock page_body %}

invenio_app_rdm/theme/assets/semantic-ui/js/invenio_app_rdm/subcommunity/browse.js

@@ -8,19 +8,19 @@
 
 import React from "react";
 import ReactDOM from "react-dom";
+import { i18next } from "@translations/invenio_app_rdm/i18next";
 import _get from "lodash/get";
 
 import { CommunitiesCardGroup } from "@js/invenio_communities/community";
 
 const subCommunitiesContainer = document.getElementById("subcommunities-container");
-const domContainer = document.getElementById("invenio-browse-config");
-const apiEndpoint = _get(domContainer.dataset, "apiEndpoint");
+const apiEndpoint = _get(subCommunitiesContainer.dataset, "apiEndpoint");
 
 if (subCommunitiesContainer) {
   ReactDOM.render(
     <CommunitiesCardGroup
       fetchDataUrl={`${apiEndpoint}?sort=oldest&page=1&size=5`}
-      emptyMessage="There are no child communities."
+      emptyMessage={i18next.t("This community has no subcommunities")}
       defaultLogo="/static/images/square-placeholder.png"
     />,
     subCommunitiesContainer