Use API permissions check instead of is_admin filter on project listing

readthedocs · Jul 17, 2024 · a737421 · a737421
1 parent 870c844
commit a737421
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 22 deletions.
diff --git a/readthedocsext/theme/static/readthedocsext/theme/js/site.js b/readthedocsext/theme/static/readthedocsext/theme/js/site.js
diff --git a/readthedocsext/theme/templates/projects/partials/project_list.html b/readthedocsext/theme/templates/projects/partials/project_list.html
@@ -32,39 +32,34 @@
 {% endblock list_placeholder_text_empty %}
 
 {% block list_item_start %}
-  <tr data-bind="using: ProjectListItemView({id: {{ object.id }}, url: '{% url "project-detail" object.pk %}'})">
+  <tr data-bind="using: ProjectListItemView({id: {{ object.id }}, url: '{% url "projects-detail" object.slug %}'})">
 {% endblock list_item_start %}
 
 {% block list_item_right_menu %}
-  <div class="ui small icon buttons">
+  <div class="ui small icon buttons" data-bind="event: {mouseover: fetch, focusin: fetch}">
     {% blocktrans trimmed with project=object.name asvar label_link %}
       View documentation for project {{ project }}
     {% endblocktrans %}
     <a class="ui {% if not object.has_good_build %} disabled{% endif %} button"
        data-content="{{ label_link }}"
        aria-label="{{ label_link }}"
-       data-bind="event: {mouseover: fetch, focusin: fetch}, attr: {href: url_docs}"
+       data-bind="attr: {href: url_docs}"
        tabindex="{% if object.has_good_build %}0{% else %}-1{% endif %}">
       <i class="fa-duotone fa-book icon"></i>
     </a>
 
-    {% if request.user|is_admin:object %}
-      <button class="ui dropdown button">
-        <i class="fa-solid fa-ellipsis icon"></i>
-        <div class="menu">
-          <div class="header">{% trans "Admin" %}</div>
-          <a class="item" href="{% url "projects_edit" object.slug %}">
-            <i class="fa-duotone fa-wrench icon"></i>
-            {% trans "Configure project" %}
-          </a>
-        </div>
-      </button>
-    {% else %}
-      <button class="ui disabled dropdown button">
-        <i class="fa-solid fa-ellipsis icon"></i>
-      </button>
-    {% endif %}
-
+    <button class="ui dropdown button">
+      <i class="fa-solid fa-ellipsis icon"></i>
+      <div class="menu">
+        <div class="header">{% trans "Admin" %}</div>
+        <a class="disabled item"
+           href="{% url "projects_edit" object.slug %}"
+           data-bind="css: { disabled: !is_admin() }">
+          <i class="fa-duotone fa-wrench icon"></i>
+          {% trans "Configure project" %}
+        </a>
+      </div>
+    </button>
   </div>
 {% endblock list_item_right_menu %}
 

diff --git a/src/js/project/index.js b/src/js/project/index.js
@@ -26,14 +26,21 @@ export class ProjectListItemView extends APIListItemView {
   constructor(project) {
     super(project);
 
+    // Add expansion to API URL
+    this.url = this.url + "?expand=permissions";
+
     /** Asynchronously load documentation URL as rendering this URL for each
      * project slows the dashboard down considerably. Instead, this is only
      * fetched when it is needed.
      * @observable {string} Documentation URL for the project */
     this.url_docs = ko.observable();
+    /* @observable {Boolean} Does the user have admin permissions on this? */
+    this.is_admin = ko.observable(false);
+
     // Subscribe to the data loaded via :class:`APIListItemView`
     this.data.subscribe((data) => {
-      this.url_docs(data.canonical_url);
+      this.url_docs(data.urls.documentation);
+      this.is_admin(data.permissions.admin);
     });
   }
 }