refactor: create browse communities page

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

@@ -0,0 +1,34 @@
+{# -*- coding: utf-8 -*-
+
+This file is part of Invenio.
+Copyright (C) 2024 CERN.
+
+Invenio is free software; you can redistribute it and/or modify it
+under the terms of the MIT License; see LICENSE file for more details.
+#}
+
+{% extends "invenio_communities/details/base.html" %}
+
+{% set active_community_header_menu_item= 'browse' %}
+{% set api_endpoint = community["links"]["subcommunities"] %}
+{% set pid_value = community["slug"] %}
+
+{%- block javascript %}
+    {{ super() }}
+    {{ webpack['invenio-communities-browse.js'] }}
+{%- endblock %}
+
+{%- block page_body %}
+{{ super() }}
+<div id='invenio-browse-config' data-api-endpoint='{{ api_endpoint }}'
+    class="ui container communities-frontpage rel-mt-3 rel-mb-2">
+    <div class="flex">
+        <h2 class="ui header mb-0 align-self-center">{{ _('Subcommunities') }}</h2>
+        <a class="align-self-center rel-ml-1" href="{{url_for('invenio_communities.communities_subcommunities', pid_value=pid_value)}}">
+            {{ _('See all')}}
+        </a>
+    </div>
+    <div class="ui divider hidden"></div>
+    <div id="subcommunities"></div>
+</div>
+{%- endblock page_body %}

invenio_app_rdm/communities_ui/views/communities.py

@@ -11,6 +11,9 @@
 from flask import abort, g, redirect, request, url_for
 from invenio_communities.views.communities import (
     HEADER_PERMISSIONS,
+    MEMBERS_PERMISSIONS,
+    _get_roles_can_invite,
+    _get_roles_can_update,
     render_community_theme_template,
 )
 from invenio_communities.views.decorators import pass_community
@@ -106,6 +109,21 @@ def communities_home(pid_value, community, community_ui):
         )
 
 
+@pass_community(serialize=True)
+def communities_browse(pid_value, community, community_ui):
+    """Community browse page."""
+    permissions = community.has_permissions_to(MEMBERS_PERMISSIONS)
+
+    return render_community_theme_template(
+        "invenio_communities/details/browse/index.html",
+        theme=community_ui.get("theme", {}),
+        community=community_ui,
+        permissions=permissions,
+        roles_can_update=_get_roles_can_update(community.id),
+        roles_can_invite=_get_roles_can_invite(community.id),
+    )
+
+
 @pass_community(serialize=True)
 def community_static_page(pid_value, community, community_ui, **kwargs):
     """Community static page."""

invenio_app_rdm/communities_ui/views/ui.py

@@ -9,7 +9,7 @@
 # under the terms of the MIT License; see LICENSE file for more details.
 """Communities UI blueprints module."""
 
-from flask import Blueprint, current_app, render_template
+from flask import Blueprint, current_app, render_template, request
 from flask_login import current_user
 from invenio_communities.communities.resources.serializer import (
     UICommunityJSONSerializer,
@@ -20,7 +20,12 @@
 from invenio_records_resources.services.errors import PermissionDeniedError
 
 from ..searchapp import search_app_context
-from .communities import communities_detail, communities_home, community_static_page
+from .communities import (
+    communities_browse,
+    communities_detail,
+    communities_home,
+    community_static_page,
+)
 
 
 #
@@ -63,6 +68,16 @@ def record_permission_denied_error(error):
     return render_template(current_app.config["THEME_403_TEMPLATE"]), 403
 
 
+def _show_browse_page():
+    """Whether the browse page should be visible in the menu."""
+    community = request.community  # will also be conditioned on collections, etc
+    conf = current_app.config
+    return (
+        conf.get("COMMUNITIES_SHOW_BROWSE_MENU_ENTRY", False)
+        and community["children"]["allow"]
+    )
+
+
 def create_ui_blueprint(app):
     """Register blueprint routes on app."""
     routes = app.config["RDM_COMMUNITIES_ROUTES"]
@@ -85,6 +100,11 @@ def create_ui_blueprint(app):
         view_func=communities_home,
     )
 
+    blueprint.add_url_rule(
+        routes["community-browse"],
+        view_func=communities_browse,
+    )
+
     blueprint.add_url_rule(
         routes["community-static-page"],
         view_func=community_static_page,

invenio_app_rdm/config.py

@@ -1014,6 +1014,7 @@ def github_link_render(record):
 RDM_COMMUNITIES_ROUTES = {
     "community-detail": "/communities/<pid_value>/records",
     "community-home": "/communities/<pid_value>/",
+    "community-browse": "/communities/<pid_value>/browse",
     "community-static-page": "/communities/<pid_value>/pages/<path:page_slug>",
 }
 

invenio_app_rdm/ext.py

@@ -14,6 +14,8 @@
 from flask_menu import current_menu
 from invenio_i18n import lazy_gettext as _
 
+from .communities_ui.views.ui import _show_browse_page
+
 
 def _is_branded_community():
     """Function used to check if community is branded."""
@@ -114,6 +116,14 @@ def init_menu(app):
         expected_args=["pid_value"],
         **dict(icon="home", permissions="can_read"),
     )
+    communities.submenu("browse").register(
+        endpoint="invenio_communities.communities_browse",
+        text=_("Browse"),
+        order=15,
+        visible_when=_show_browse_page,
+        expected_args=["pid_value"],
+        **{"icon": "list", "permissions": "can_read"},
+    )
     communities.submenu("search").register(
         "invenio_app_rdm_communities.communities_detail",
         text=_("Records"),

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

@@ -0,0 +1,29 @@
+/*
+ * This file is part of Invenio.
+ * Copyright (C) 2016-2021 CERN.
+ * Copyright (C) 2023 Northwestern University.
+ *
+ * Invenio is free software; you can redistribute it and/or modify it
+ * under the terms of the MIT License; see LICENSE file for more details.
+ */
+
+import React from "react";
+import ReactDOM from "react-dom";
+import _get from "lodash/get";
+
+import { CommunitiesCardGroup } from "@js/invenio_communities/community";
+
+const subCommunitiesContainer = document.getElementById("subcommunities");
+const domContainer = document.getElementById("invenio-browse-config");
+const apiEndpoint = _get(domContainer.dataset, "apiEndpoint");
+
+if (subCommunitiesContainer) {
+  ReactDOM.render(
+    <CommunitiesCardGroup
+      fetchDataUrl={apiEndpoint}
+      emptyMessage="There are no child communities."
+      defaultLogo="/static/images/square-placeholder.png"
+    />,
+    subCommunitiesContainer
+  );
+}

invenio_app_rdm/theme/webpack.py

@@ -37,6 +37,7 @@
                 "invenio-records-administration": "./js/invenio_app_rdm/administration/records/index.js",
                 "invenio-drafts-administration": "./js/invenio_app_rdm/administration/drafts/index.js",
                 "invenio-domains-administration": "./js/invenio_app_rdm/administration/domains/index.js",
+                "invenio-communities-browse": "./js/invenio_app_rdm/subcommunity/browse.js",
             },
             dependencies={
                 "@babel/runtime": "^7.9.0",