Add test and fix a bug for project share button

client/cypress/fixtures/mocks.js

@@ -108,5 +108,5 @@ export default {
   RoomEntryNode: () => ({
     title: 'A Room Entry',
     contents: [],
-  }),
+  })
 };

client/cypress/integration/frontend/portfolio/project-page.spec.js

@@ -3,6 +3,32 @@ import {PROJECT_ENTRY_TEMPLATE} from '../../../../src/consts/strings.consts';
 describe('Project Page', () => {
   const created = '2021-06-01T11:49:00+00:00';
   const createdLater = '2021-06-01T12:49:00+00:00';
+  let final = false;
+
+  const project = {
+    id: 'UHJvamVjdE5vZGU6MzY=',
+    title: 'Groot',
+    appearance: 'yellow',
+    description: 'I am Groot',
+    slug: 'groot',
+    objectives: 'Be Groot\nBe awesome',
+    final: false,
+    student: {
+      firstName: 'Rachel',
+      lastName: 'Green',
+      id: 'VXNlck5vZGU6NQ==',
+      avatarUrl: '',
+    },
+    entriesCount: 1,
+    entries: [
+      {
+        id: 'UHJvamVjdEVudHJ5Tm9kZTo2NQ==',
+        description: 'Aktivität:\nKill Thanos\n\n\nReflexion:\nHe sucks\n\n\nNächste Schritte:\nGo for the head',
+        documentUrl: '',
+        created,
+      },
+    ],
+  };
 
   const operations = {
     MeQuery: {
@@ -32,30 +58,7 @@ describe('Project Page', () => {
       ],
     },
     ProjectQuery: {
-      project: {
-        id: 'UHJvamVjdE5vZGU6MzY=',
-        title: 'Groot',
-        appearance: 'yellow',
-        description: 'I am Groot',
-        slug: 'groot',
-        objectives: 'Be Groot\nBe awesome',
-        final: false,
-        student: {
-          firstName: 'Rachel',
-          lastName: 'Green',
-          id: 'VXNlck5vZGU6NQ==',
-          avatarUrl: '',
-        },
-        entriesCount: 1,
-        entries: [
-          {
-            id: 'UHJvamVjdEVudHJ5Tm9kZTo2NQ==',
-            description: 'Aktivität:\nKill Thanos\n\n\nReflexion:\nHe sucks\n\n\nNächste Schritte:\nGo for the head',
-            documentUrl: '',
-            created,
-          },
-        ],
-      },
+      project,
     },
     AddProjectEntry: variables => ({
       addProjectEntry: {
@@ -77,6 +80,16 @@ describe('Project Page', () => {
         success: true,
       },
     },
+    UpdateProjectShareState: variables => {
+      final = !final;
+      return {
+        updateProjectSharedState: {
+          errors: null,
+          success: true,
+          shared: final,
+        },
+      };
+    },
   };
 
   beforeEach(() => {
@@ -103,6 +116,34 @@ describe('Project Page', () => {
     cy.getByDataCy('edit-project').should('exist');
   });
 
+  it('shares and unshares the project', () => {
+    const getOperationsForSharing = () => {
+      let projectForSharing = {
+        ...project,
+        final,
+      };
+      return {
+        ...operations,
+        ProjectQuery: {
+          project: projectForSharing,
+        },
+      };
+    };
+
+    cy.mockGraphqlOps({
+      operations: getOperationsForSharing,
+    });
+
+    cy.visit('/portfolio/groot');
+    const unsharedText = 'Mit Lehrperson teilen';
+    const sharedText = 'Nicht mehr teilen';
+    cy.getByDataCy('project-share-link').should('contain', unsharedText);
+    cy.getByDataCy('project-share-link').click();
+    cy.getByDataCy('project-share-link').should('contain', sharedText);
+    cy.getByDataCy('project-share-link').click();
+    cy.getByDataCy('project-share-link').should('contain', unsharedText);
+  });
+
   describe('Project Entry', () => {
     it('should create a new project entry', () => {
       cy.visit('/portfolio');
@@ -156,4 +197,5 @@ describe('Project Page', () => {
       cy.getByDataCy('project-entry-textarea').should('have.value', PROJECT_ENTRY_TEMPLATE);
     });
   });
-});
+})
+;

client/src/components/portfolio/ShareLink.vue

@@ -2,7 +2,7 @@
   <a class="share-icon">
     <share-icon class="share-icon__icon"/>
     <span class="share-icon__text">
-      <template v-if="final">Mit Lehrperson teilen</template>
+      <template v-if="!final">Mit Lehrperson teilen</template>
       <template v-else>Nicht mehr teilen</template>
     </span>
   </a>

client/src/graphql/client.js

@@ -1,4 +1,4 @@
-import {InMemoryCache, defaultDataIdFromObject} from 'apollo-cache-inmemory';
+import {defaultDataIdFromObject, InMemoryCache} from 'apollo-cache-inmemory';
 import {createHttpLink} from 'apollo-link-http';
 import {onError} from 'apollo-link-error';
 import {ApolloClient} from 'apollo-client';
@@ -13,18 +13,18 @@ const writeLocalCache = cache => {
     data: {
       scrollPosition: {
         __typename: 'ScrollPosition',
-        scrollTo: ''
+        scrollTo: '',
       },
       sidebar: {
         __typename: 'Sidebar',
         profile: false,
-        navigation: false
+        navigation: false,
       },
       helloEmail: {
         __typename: 'HelloEmail',
-        email: ''
+        email: '',
       },
-    }
+    },
   });
 };
 
@@ -35,8 +35,8 @@ export default function (uri, networkErrorCallback) {
     credentials: 'include',
     fetch: fetch,
     headers: {
-      'X-CSRFToken': document.cookie.replace(/(?:(?:^|.*;\s*)csrftoken\s*=\s*([^;]*).*$)|^.*$/, '$1')
-    }
+      'X-CSRFToken': document.cookie.replace(/(?:(?:^|.*;\s*)csrftoken\s*=\s*([^;]*).*$)|^.*$/, '$1'),
+    },
   });
 
   const consoleLink = new ApolloLink((operation, forward) => {
@@ -71,8 +71,8 @@ export default function (uri, networkErrorCallback) {
     if (graphQLErrors) {
       graphQLErrors.forEach(({message, locations, path}) =>
         console.log(
-          `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`
-        )
+          `[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`,
+        ),
       );
     }
 
@@ -106,8 +106,16 @@ export default function (uri, networkErrorCallback) {
         objective: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ObjectiveNode', id: args.id}),
         objectiveGroup: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ObjectiveGroupNode', id: args.id}),
         projectEntry: (_, args, {getCacheKey}) => getCacheKey({__typename: 'ProjectEntryNode', id: args.id}),
-      }
-    }
+        project: (_, args, {getCacheKey}) => {
+          console.log(args);
+          if (args.slug) {
+            return getCacheKey({__typename: 'ProjectNode', id: args.slug});
+          } else {
+            return getCacheKey({__typename: 'ProjectNode', id: args.id});
+          }
+        },
+      },
+    },
   });
 
   // TODO: Monkey-patching in a fix for an open issue suggesting that
@@ -132,7 +140,7 @@ export default function (uri, networkErrorCallback) {
     cache,
     connectToDevTools: true,
     typeDefs,
-    resolvers
+    resolvers,
   });
   client.onResetStore(() => {
     writeLocalCache(cache);

client/src/pages/portfolio/project.vue

@@ -11,6 +11,7 @@
       <div class="project__actions">
         <share-link
           :final="project.final"
+          data-cy="project-share-link"
           class="project__share"
           @click.native="updateProjectShareState(project.id, !project.final)" />