import { getModules, getMinimalMe } from '../../../support/helpers';

describe('Apply module visibility', () => {
  const schoolClasses = [
    {
      name: 'FLID2018a',
      id: btoa('SchoolClassNode:1'),
    },
    {
      name: 'Andere Klasse',
      id: btoa('SchoolClassNode:2'),
    },
  ];

  const { me: minimalMe } = getMinimalMe({});
  const me = {
    ...minimalMe,
    schoolClasses,
  };
  //      name: '[\'FLID2018a\', \'Andere Klasse\']'
  const operations = {
    MeQuery: {
      me,
    },
    ModulesQuery: getModules,
    UpdateSettings: {
      updateSettings: {
        success: true,
      },
    },
    MySchoolClassQuery: {
      me,
    },
    UpdateLastModule: {
      updateLastModule: {
        success: true,
      },
    },
    SyncModuleVisibility: {
      syncModuleVisibility: {
        success: true,
      },
    },
    ModuleDetailsQuery: {
      module: {
        id: 'some-module-id',
      },
    },
  };

  beforeEach(() => {
    cy.setup();
  });

  it('clicks through the UI', () => {
    cy.mockGraphqlOps({
      operations,
    });

    // go to module
    cy.visit('/module/lohn-und-budget');
    cy.selectClass('Andere Klasse');
    // click on settings
    cy.getByDataCy('module-settings-button').click();
    // click on select button
    cy.getByDataCy('select-school-class-button').click();
    // select schoolclass
    cy.getByDataCy('school-class-visibility-dropdown').select('FLID2018a');
    // save changes
    cy.getByDataCy('save-visibility-button').click();

    cy.getByDataCy('module-title').should('exist');
  });
});