Merge branch 'release/new-portfolio' into develop

2021-10-27 18:13:51 +02:00 · 2021-10-27 18:13:51 +02:00 · ef6d76aee1
parent 26b1c3e8af ebe266a7b0
commit ef6d76aee1
14 changed files with 166 additions and 68 deletions
--- a/client/cypress/fixtures/maxim.png
+++ b/client/cypress/fixtures/maxim.png
--- a/client/cypress/integration/frontend/portfolio/new-project.spec.js
+++ b/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');
--- a/client/cypress/integration/frontend/portfolio/project-page.spec.js
+++ b/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);
    });
  });
-});
+})
+;
--- a/client/cypress/integration/frontend/portfolio/projects-page.spec.js
+++ b/client/cypress/integration/frontend/portfolio/projects-page.spec.js
--- a/client/cypress/integration/frontend/read-only/portfolio.spec.js
+++ b/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');
  });
--- a/client/src/components/MoreOptionsWidget.vue
+++ b/client/src/components/MoreOptionsWidget.vue
@ -34,8 +34,7 @@
 </script>

 <style scoped lang="scss">
-  @import "@/styles/_variables.scss";
-  @import "@/styles/_mixins.scss";
+  @import "~styles/helpers";

  .more-options {
    display: flex;
@ -58,7 +57,7 @@
    }

    &__popover {
-      width: 180px;
+      min-width: 200px;
      @include popover-defaults();
    }
  }
--- a/client/src/components/portfolio/CreateProjectButton.vue
+++ b/client/src/components/portfolio/CreateProjectButton.vue
@ -1,8 +1,7 @@
 <template>
  <router-link
    :to="createProjectRoute"
-    class="button button--primary"
-    data-cy="add-project-button">Projekt erstellen
+    class="button button--primary">Projekt erstellen
  </router-link>
 </template>

--- a/client/src/components/portfolio/PortfolioOnboarding.vue
+++ b/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>

--- a/client/src/components/portfolio/ProjectEntry.vue
+++ b/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
-        data-cy="edit-project-entry"
-        @click="editProjectEntry()">Eintrag bearbeiten</a>
+      <li class="popover-links__link">
+        <a
+          data-cy="edit-project-entry"
+          @click="editProjectEntry()">Eintrag bearbeiten</a>
      </li>
-      <li class="popover-links__link"><a
-        data-cy="delete-project-entry"
-        @click="deleteProjectEntry()">Eintrag löschen</a>
+      <li class="popover-links__link">
+        <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>

--- a/client/src/components/portfolio/ShareLink.vue
+++ b/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>
--- a/client/src/graphql/client.js
+++ b/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);
--- a/client/src/pages/portfolio/newProject.vue
+++ b/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({
-                  node: project,
-                  __typename: 'ProjectNode'
-                });
+                data.projects.unshift(project);
                store.writeQuery({query: PROJECTS_QUERY, data});
              }
            } catch (e) {
--- a/client/src/pages/portfolio/portfolio.vue
+++ b/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" />

--- a/client/src/pages/portfolio/project.vue
+++ b/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)" />