From 33bf0cd70ee778cddb890f5089de997a0ae37959 Mon Sep 17 00:00:00 2001
From: Ramon Wenger <ramon.wenger@iterativ.ch>
Date: Tue, 6 Jul 2021 21:32:12 +0200
Subject: [PATCH] Hide module teacher actions when in read-only mode

---
 .../frontend/read-only-navigation.spec.js     | 52 +++++++++++++++++++
 .../components/modules/ModuleNavigation.vue   |  4 +-
 2 files changed, 55 insertions(+), 1 deletion(-)
 create mode 100644 client/cypress/integration/frontend/read-only-navigation.spec.js

diff --git a/client/cypress/integration/frontend/read-only-navigation.spec.js b/client/cypress/integration/frontend/read-only-navigation.spec.js
new file mode 100644
index 00000000..fc0a155b
--- /dev/null
+++ b/client/cypress/integration/frontend/read-only-navigation.spec.js
@@ -0,0 +1,52 @@
+import mocks from '../../fixtures/mocks';
+import minimalModule from '../../fixtures/module.minimal';
+
+const getOperations = ({readOnly}) => ({
+  MeQuery: {
+    me: {
+      onboardingVisited: true,
+      readOnly,
+      isTeacher: true
+    },
+  },
+  ModuleDetailsQuery: {
+    module: {
+      ...minimalModule
+    }
+  },
+});
+
+describe('Module Navigation - read only', () => {
+  beforeEach(() => {
+    cy.fakeLogin('nico.teacher', 'test');
+    cy.server();
+    cy.task('getSchema').then(schema => {
+      cy.mockGraphql({
+        schema,
+        mocks,
+      });
+    });
+    cy.viewport('macbook-15');
+  });
+
+  it('is not shown', () => {
+    cy.mockGraphqlOps({
+      operations: getOperations({readOnly: true}),
+    });
+
+    cy.visit('module/module-slug');
+
+    cy.getByDataCy('module-navigation').should('exist');
+    cy.getByDataCy('module-teacher-menu').should('not.exist');
+  });
+  it('is shown', () => {
+    cy.mockGraphqlOps({
+      operations: getOperations({readOnly: false}),
+    });
+
+    cy.visit('module/module-slug');
+
+    cy.getByDataCy('module-navigation').should('exist');
+    cy.getByDataCy('module-teacher-menu').should('exist');
+  });
+});
diff --git a/client/src/components/modules/ModuleNavigation.vue b/client/src/components/modules/ModuleNavigation.vue
index c1dbae30..5be75281 100644
--- a/client/src/components/modules/ModuleNavigation.vue
+++ b/client/src/components/modules/ModuleNavigation.vue
@@ -1,5 +1,6 @@
 <template>
   <nav
+    data-cy="module-navigation"
     class="module-navigation sub-navigation">
     <back-link
       :title="module.topic.title"
@@ -42,7 +43,8 @@
 
     <div
       class="module-navigation__toggle-menu"
-      v-if="canManageContent"
+      data-cy="module-teacher-menu"
+      v-if="canManageContent && !me.readOnly"
     >
       <snapshot-menu class="module-navigation__actions"/>
       <router-link