Make project and portfolio read only when selected class inactive

client/cypress/integration/frontend/read-only/portfolio.spec.js

@@ -1,7 +1,7 @@
 import {getMinimalMe} from '../../../support/helpers';
 
-const getOperations = ({readOnly = false}) => ({
+const getOperations = ({readOnly = false, classReadOnly = false}) => ({
-  MeQuery: getMinimalMe({readOnly}),
+  MeQuery: getMinimalMe({readOnly, classReadOnly}),
   ProjectsQuery: {
     projects: {
       edges: [
@@ -33,9 +33,17 @@ describe('Read Only Portfolio', () => {
     cy.getByDataCy('project-widget').should('have.length', 1);
     cy.getByDataCy('project-widget-actions').should('exist');
   });
-  it('Can not create and edit project', () => {
+  it('Can not create and edit project when license invalid', () => {
     cy.mockGraphqlOps({operations: getOperations({readOnly: true})});
 
+    cy.visit('/portfolio');
+    cy.getByDataCy('add-project-button').should('not.exist');
+    cy.getByDataCy('project-widget').should('have.length', 1);
+    cy.getByDataCy('project-widget-actions').should('not.exist');
+  });
+  it('Can not create and edit project when class inactive', () => {
+    cy.mockGraphqlOps({operations: getOperations({readOnly: false, classReadOnly: true})});
+
     cy.visit('/portfolio');
     cy.getByDataCy('add-project-button').should('not.exist');
     cy.getByDataCy('project-widget').should('have.length', 1);

client/cypress/integration/frontend/read-only/project.spec.js

@@ -1,7 +1,7 @@
 import {getMinimalMe} from '../../../support/helpers';
 
-const getOperations = ({readOnly = false}) => ({
+const getOperations = ({readOnly = false, classReadOnly = false}) => ({
-  MeQuery: getMinimalMe({readOnly}),
+  MeQuery: getMinimalMe({readOnly, classReadOnly}),
   ProjectQuery: {
     project: {
       id: 'projectId',
@@ -21,8 +21,8 @@ const getOperations = ({readOnly = false}) => ({
   },
 });
 
-const testProject = (readOnly, shouldActionsExist) => {
+const testProject = (readOnly, shouldActionsExist, classReadOnly = false) => {
-  cy.mockGraphqlOps({operations: getOperations({readOnly})});
+  cy.mockGraphqlOps({operations: getOperations({readOnly, classReadOnly})});
 
   const exist = shouldActionsExist ? 'exist' : 'not.exist';
 
@@ -42,7 +42,10 @@ describe('Read Only Project', () => {
   it('Can create and edit project entry', () => {
     testProject(false, true);
   });
-  it('Can not create and edit project entry', () => {
+  it('Can not create and edit project entry when license expired', () => {
     testProject(true, false);
   });
+  it('Can not create and edit project entry when class inactive', () => {
+    testProject(false, false, true);
+  });
 });

client/src/pages/portfolio/portfolio.vue

@@ -3,13 +3,13 @@
     <div class="portfolio">
       <add-project
         class="portfolio__add-project"
-        v-if="!me.readOnly"/>
+        v-if="!me.readOnly && !me.selectedClass.readOnly"/>
 
       <project-widget
         v-bind="project"
         :user-id="userId"
         :key="project.id"
-        :read-only="me.readOnly"
+        :read-only="me.readOnly || me.selectedClass.readOnly"
         class="portfolio__project"
         v-for="project in projects"
       />

client/src/pages/portfolio/project.vue

@@ -22,7 +22,7 @@
       <div class="project__meta">
         <project-actions
           :id="project.id"
-          v-if="!me.readOnly"/>
+          v-if="!me.readOnly && !me.selectedClass.readOnly"/>
         <owner-widget :owner="project.student"/>
         <entry-count-widget :entry-count="projectEntryCount"/>
       </div>
@@ -33,11 +33,11 @@
         :project="project.id"
         class="project__add-entry"
         data-cy="add-project-entry"
-        v-if="isOwner && !me.readOnly"/>
+        v-if="isOwner && !me.readOnly && !me.selectedClass.readOnly"/>
       <project-entry
         v-bind="entry"
         :key="index"
-        :read-only="me.readOnly"
+        :read-only="me.readOnly || me.selectedClass.readOnly"
         v-for="(entry, index) in project.entries"/>
     </div>
   </div>