Merge branch 'release/new-portfolio' into develop

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

@@ -46,7 +46,7 @@ describe('New project', () => {
     });
     cy.visit('/portfolio');
 
-    cy.get('[data-cy=add-project-button]').click();
+    cy.get('[data-cy=create-project-button]').click();
     cy.get('[data-cy=page-form-input-titel]').type('Some random title');
     cy.get('[data-cy=page-form-input-beschreibung]').should('exist').should('be.empty');
     cy.get('[data-cy=page-form-input-ziele]').should('not.exist');

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: {
+      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,
-          },
-        ],
-      },
     },
     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/cypress/integration/frontend/read-only/portfolio.spec.js

@@ -26,7 +26,7 @@ describe('Read Only Portfolio', () => {
 
     cy.visit('/portfolio');
     cy.getByDataCy('project-list').should('exist');
-    cy.getByDataCy('add-project-button').should('exist');
+    cy.getByDataCy('create-project-button').should('exist');
     cy.getByDataCy('project').should('have.length', 1);
     cy.getByDataCy('project-actions').should('exist');
   });

client/src/components/MoreOptionsWidget.vue

@@ -34,8 +34,7 @@
 </script>
 
 <style scoped lang="scss">
-  @import "@/styles/_variables.scss";
+  @import "~styles/helpers";
-  @import "@/styles/_mixins.scss";
 
   .more-options {
     display: flex;
@@ -58,7 +57,7 @@
     }
 
     &__popover {
-      width: 180px;
+      min-width: 200px;
       @include popover-defaults();
     }
   }

client/src/components/portfolio/CreateProjectButton.vue

@@ -1,8 +1,7 @@
 <template>
   <router-link
     :to="createProjectRoute"
-    class="button button--primary"
+    class="button button--primary">Projekt erstellen
-    data-cy="add-project-button">Projekt erstellen
   </router-link>
 </template>
 

client/src/components/portfolio/PortfolioOnboarding.vue

@@ -15,7 +15,7 @@
       Hier können Sie Projekte erstellen, um Ihre Gedanken festzuhalten oder Ihre Arbeit zu dokumentieren.
     </p>
 
-    <create-project-button />
+    <create-project-button data-cy="create-project-button-onboarding" />
   </div>
 </template>
 

client/src/components/portfolio/ProjectEntry.vue

@@ -6,13 +6,15 @@
       class="project-entry__more"
       data-cy="project-entry-more"
       v-if="!readOnly">
-      <li class="popover-links__link"><a
+      <li class="popover-links__link">
-        data-cy="edit-project-entry"
+        <a
-        @click="editProjectEntry()">Eintrag bearbeiten</a>
+          data-cy="edit-project-entry"
+          @click="editProjectEntry()">Eintrag bearbeiten</a>
       </li>
-      <li class="popover-links__link"><a
+      <li class="popover-links__link">
-        data-cy="delete-project-entry"
+        <a
-        @click="deleteProjectEntry()">Eintrag löschen</a>
+          data-cy="delete-project-entry"
+          @click="deleteProjectEntry()">Eintrag löschen</a>
       </li>
     </more-options-widget>
 
@@ -46,7 +48,7 @@
     props: ['description', 'documentUrl', 'created', 'id', 'readOnly'],
     components: {
       DocumentBlock,
-      MoreOptionsWidget
+      MoreOptionsWidget,
     },
 
     methods: {
@@ -59,14 +61,14 @@
           mutation: DELETE_PROJECT_ENTRY_MUTATION,
           variables: {
             input: {
-              id: this.id
+              id: this.id,
-            }
+            },
           },
           update(store, {data: {deleteProjectEntry: {success}}}) {
             if (success) {
               const query = PROJECT_QUERY;
               const variables = {
-                slug: projectEntry.$route.params.slug
+                slug: projectEntry.$route.params.slug,
               };
               const data = store.readQuery({query, variables});
               if (data) {
@@ -74,10 +76,10 @@
                 store.writeQuery({query, variables, data});
               }
             }
-          }
+          },
         });
-      }
+      },
-    }
+    },
   };
 </script>
 

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/newProject.vue

@@ -39,10 +39,7 @@
             try {
               const data = store.readQuery({query: PROJECTS_QUERY});
               if (data.projects) {
-                data.projects.edges.unshift({
+                data.projects.unshift(project);
-                  node: project,
-                  __typename: 'ProjectNode'
-                });
                 store.writeQuery({query: PROJECTS_QUERY, data});
               }
             } catch (e) {

client/src/pages/portfolio/portfolio.vue

@@ -5,6 +5,7 @@
         <h1 data-cy="page-title">Portfolio</h1>
 
         <create-project-button
+          data-cy="create-project-button"
           class="portfolio__create-button"
           v-if="!isReadOnly" />
 

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)" />