const schema = require('../fixtures/schema.json');
const me = require('../fixtures/me.join-class.json');
const selectedClass = require('../fixtures/selected-school-class.json');

describe('Class Management', () => {
  beforeEach(() => {
    cy.server();

    cy.mockGraphql({
      schema: schema,
    });

    cy.viewport('macbook-15');
    cy.apolloLogin('rahel.cueni', 'test');

  });

  // fixme: cache misbehaves with mequery, but only for test
  // it('should join class', () => {
  //   const name = 'KF1A';
  //   const id = 'U2Nob29sQ2xhc3NOb2RlOjI=';
  //   const __typename = 'SchoolClassNode';
  //
  //   let localMe = {
  //     ...me
  //   };
  //
  //   cy.mockGraphqlOps({
  //     operations: {
  //       MeQuery: localMe,
  //       // JoinClass() {
  //       //   // fixme: is this necessary? the cache somehow does not seem to do anything for the MeQuery
  //       //   let schoolClass = {
  //       //     id,
  //       //     name,
  //       //     // __typename
  //       //   };
  //       //   // localMe.me.schoolClasses.edges.push({
  //       //   //   node: schoolClass,
  //       //   //   __typename: 'SchoolClassNodeEdge'
  //       //   // });
  //       //   return {
  //       //     joinClass: {
  //       //       success: true,
  //       //       schoolClass
  //       //     }
  //       //   }
  //       // },
  //       JoinClass: {
  //         joinClass: {
  //           success: true,
  //           schoolClass: {
  //             name,
  //             id
  //           }
  //         }
  //       },
  //       MySchoolClassQuery: {
  //         me: {
  //           ...selectedClass.me,
  //           selectedClass: {
  //             __typename,
  //             name,
  //             id,
  //             members: []
  //           }
  //         }
  //       }
  //     }
  //   });
  //
  //   cy.visit('/me/profile');
  //
  //   cy.get('[data-cy=header-user-widget]').within(() => {
  //     cy.get('[data-cy=user-widget-avatar]').click();
  //   });
  //   //
  //   cy.get('[data-cy=class-selection]').click();
  //   cy.get('[data-cy=class-selection-entry]').should('have.length', 1);
  //   cy.get('[data-cy=class-selection]').click();
  //
  //   cy.get('[data-cy=join-class-link]').click();
  //
  //   cy.get('[data-cy=input-class-code]').type('XXXX');
  //   cy.get('[data-cy=join-class]').click();
  //
  //   cy.get('[data-cy=school-class-name]').should('contain', name);
  //   cy.get('[data-cy=current-class-name]').should('contain', name);
  //
  //   cy.get('[data-cy=header-user-widget]').within(() => {
  //     cy.get('[data-cy=user-widget-avatar]').click();
  //   });
  //
  //   cy.get('[data-cy=class-selection]').click();
  //   cy.get('[data-cy=class-selection-entry]').should('have.length', 2);
  //   //
  // });

  it('should not be able to leave class', () => {
    cy.mockGraphqlOps({
      operations: {
        MeQuery: me,
        MySchoolClassQuery: selectedClass
      }
    });

    cy.visit('/me/my-class');
    cy.get('[data-cy=school-class-member]').should('have.length', 2);
    cy.get('[data-cy=remove-from-class]').should('have.length', 0);
    cy.get('[data-cy=add-to-class]').should('have.length', 0);
  });

  it('should leave and re-join class', () => {
    // todo: re-enable after the deactivation of users is re-enabled again

    // const teacher = {
    //   me: {
    //     ...me.me,
    //     isTeacher: true
    //   }
    // };
    // const teacherSelectedClass = {
    //   me: {
    //     ...selectedClass.me,
    //     isTeacher: true
    //   }
    // };
    // cy.mockGraphqlOps({
    //   operations: {
    //     MeQuery: teacher,
    //     AddRemoveMember: {
    //       addRemoveMember: {
    //         success: true
    //       }
    //     },
    //     MySchoolClassQuery: teacherSelectedClass
    //   }
    // });
    //
    // cy.visit('/me/my-class');
    // cy.get('[data-cy=active-class-members-list]').within(() => {
    //   cy.get('[data-cy=school-class-member]').should('have.length', 2)
    // });
    // cy.get('[data-cy=inactive-class-members-list]').should('not.exist');
    //
    // cy.get('[data-cy=remove-from-class]').first().click();
    //
    // cy.get('[data-cy=modal-save-button]').click();
    //
    // cy.get('[data-cy=active-class-members-list]').within(() => {
    //   cy.get('[data-cy=school-class-member]').should('have.length', 1)
    // });
    // cy.get('[data-cy=inactive-class-members-list]').within(() => {
    //   cy.get('[data-cy=school-class-member]').should('have.length', 1)
    // });
    //
    // cy.get('[data-cy=add-to-class]').first().click();
    //
    // cy.get('[data-cy=active-class-members-list]').within(() => {
    //   cy.get('[data-cy=school-class-member]').should('have.length', 2)
    // });
    // cy.get('[data-cy=inactive-class-members-list]').should('not.exist');
  });

  it('should display old classes', () => {
    let oldClasses = me.me.schoolClasses;
    let OldClassesQuery = {
      me: {
        ...me.me,
        oldClasses
      },
    };

    cy.mockGraphqlOps({
      operations: {
        MeQuery: me,
        OldClassesQuery
      }
    });

    cy.visit('/me/old-classes');

    cy.get('[data-cy=old-class-item]').should('have.length', 1);

  });
});

describe('Teacher Class Management', () => {

  beforeEach(() => {
    cy.server();

    cy.mockGraphql({
      schema: schema,
    });

    cy.viewport('macbook-15');
    cy.apolloLogin('nico.zickgraf', 'test');

  });

  it('changes class name', () => {
    let className = 'Gotta have class';

    let localMe = {
      me: {
        ...me.me,
        isTeacher: true
      }
    };

    cy.mockGraphqlOps({
      operations: {
        MeQuery: localMe,
        MySchoolClassQuery: {
          me: {
            ...selectedClass.me,
            isTeacher: true
          }
        },
        UpdateSchoolClass: {
          updateSchoolClass: {
            success: true,
            schoolClass: {
              name: className,
              __typename: 'SchoolClassNode'
            },
            __typename: 'UpdateSchoolClassPayload'
          }
        }
      }
    });

    cy.visit('/me/my-class');

    cy.get('[data-cy=edit-class-name-link]').click();
    cy.get('[data-cy=edit-class-name-input] input').type('{selectall}{backspace}').type(className);
    cy.get('[data-cy=modal-save-button]').click();
    cy.get('[data-cy=school-class-name]').should('contain', className);
  });

  // // fixme: cache misbehaves with mequery, but only for test
  //
  // it.only('creates a new class', () => {
  //   const name = 'Moordale';
  //   const id = 'U2Nob29sQ2xhc3NOb2RlOjI=';
  //   const __typename = "SchoolClassNode";
  //   let localMe = {
  //     me: {
  //       ...me.me,
  //       isTeacher: true
  //     }
  //   };
  //
  //   cy.mockGraphqlOps({
  //     operations: {
  //       MeQuery: () => {
  //         return localMe;
  //       },
  //       CreateSchoolClass() {
  //         // fixme: is this necessary? the cache somehow does not seem to do anything for the MeQuery
  //         let schoolClass = {
  //           id,
  //           name,
  //           __typename
  //         };
  //         // localMe.me.schoolClasses.edges.push({
  //         //   node: schoolClass,
  //         //   __typename: 'SchoolClassNodeEdge'
  //         // });
  //         return {
  //           createSchoolClass: {
  //             success: true,
  //             schoolClass
  //           }
  //         }
  //       },
  //       MySchoolClassQuery: {
  //         me: {
  //           ...selectedClass.me,
  //           selectedClass: {
  //             __typename,
  //             name,
  //             id,
  //             members: []
  //           }
  //         }
  //       }
  //     }
  //   });
  //
  //   cy.visit('/me/my-class');
  //
  //   cy.get('h1').should('exist');
  //
  //   cy.get('[data-cy=header-user-widget]').within(() => {
  //     cy.get('[data-cy=user-widget-avatar]').click();
  //   });
  //
  //   cy.get('[data-cy=class-selection]').click();
  //   cy.get('[data-cy=class-selection-entry]').should('have.length', 1);
  //
  //
  //   cy.get('[data-cy=create-class-link]').click();
  //
  //   cy.get('[data-cy=input-class-name]').type(name);
  //
  //   cy.get('[data-cy=create-class]').click();
  //
  //   cy.get('[data-cy=school-class-name]').should('contain', name);
  //   cy.get('[data-cy=current-class-name]').should('contain', name);
  //
  //   cy.get('[data-cy=header-user-widget]').within(() => {
  //     cy.get('[data-cy=user-widget-avatar]').click();
  //   });
  //
  //   cy.get('[data-cy=class-selection]').click();
  //   cy.get('[data-cy=class-selection-entry]').should('have.length', 2);
  // });
});