/// <reference types="cypress" />

describe("Top Navigation", () => {
  
  const showSubscribeToUpdates = () => {
    cy.contains('Keep JamKazam Improving').should('exist')
    cy.contains('Subscribe').should('exist')
  }

  const showProfileDropdown = () => {
    cy.get('[data-testid=navbarTopProfileDropdown]').should('exist')
    cy.contains("Peter Pan").should('exist')
    //cy.contains("My Profile").should('exist')
    cy.contains("Sign Out").should('exist')
  }

  describe("when user has not logged in", () => {
    beforeEach(() => {
      cy.stubUnauthenticate()
    });

    it('shows homepage', () => {
      cy.visit('/')
      cy.contains('Home').should('exist')
      showSubscribeToUpdates()
    })

    it("not allowed to protected page", () => {
      cy.visit('/friends')
      cy.url().should('include', '/authentication/basic/login')
      cy.contains("Sign in")
      cy.get('button').should('have.text', 'Sign in')
      cy.get('[data-testid=navbarTopProfileDropdown]').should('not.exist')
    });
    
  })

  describe("when user has logged in", () => {
    
    beforeEach(() => {
      cy.stubAuthenticate()
      cy.visit('/')
    });

    it("shows user dropdown", () => {
      showSubscribeToUpdates()
      showProfileDropdown()
    })

    it('sign out', () => {
      cy.get('[data-testid=navbarTopProfileDropdown]').contains('Peter Pan').click()
      cy.stubUnauthenticate()
      cy.get('[data-testid=navbarTopProfileDropdown]').contains('Sign Out').click()
      cy.get('[data-testid=navbarTopProfileDropdown]').should('not.exist')
      cy.contains("Home")
    })
  })

  describe('header notifications', () => {
    beforeEach(() => {
      cy.stubAuthenticate()
      cy.intercept('GET', /\S+\/notifications/, { fixture: 'notifications'} )
      cy.intercept('GET', /\S+\/profile\S+/, { fixture: 'person' });
      cy.visit('/')
    })

    it('shows notifications', () => {
      cy.get('[data-testid=notificationDropdown]').should('not.be.visible')
      cy.get('.notification-indicator').click()
      cy.get('[data-testid=notificationDropdown]').should('be.visible')
      cy.get('[data-testid=notificationDropdown] .list-group-item').should('have.length', 3)
      cy.get('[data-testid=notificationDropdown]').contains('View all').click() //view all notifications
      cy.url().should('include', '/notifications')
    })
  })

  describe('locale switch', () => {
    beforeEach(() => {
      cy.stubAuthenticate()
      cy.visit('/')
    })

    it("translate", () => {
      cy.get('.card-header').contains('Home')
      cy.get('[data-testid=langSwitch]').contains('ES').click()
      cy.get('.card-header').contains('Página de inicio')
      cy.get('.card-header').should('not.contain', 'Home')
      cy.get('[data-testid=langSwitch]').contains('EN').click()
      cy.get('.card-header').contains('Home')
      cy.get('.card-header').should('not.contain', 'Página de inicio')
    })
  })

  describe('left side navigation', () => {
    beforeEach(() => {
      cy.viewport('macbook-13');
      cy.stubAuthenticate()
      cy.visit('/')
    })

    it('shows all main and sub menu items opened by default', () => {
      cy.get('[data-testid=verticalNavigation]' ).contains('Sessions')
      cy.get('[data-testid=verticalNavigation]' ).contains('Create Session')
      cy.get('[data-testid=verticalNavigation]' ).contains('Browse Current Sessions')
      cy.get('[data-testid=verticalNavigation]' ).contains('View Session History')
    })

    it.only('toggles only one menu on click', () => {
       cy.get('[data-testid=verticalNavigation]' ).contains('Sessions').click()
       cy.get('[data-testid=verticalNavigation]' ).contains('Create Session').should('not.visible')
       cy.get('[data-testid=verticalNavigation]' ).contains('Browse Current Sessions').should('not.visible')
       cy.get('[data-testid=verticalNavigation]' ).contains('View Session History').should('not.visible')
       //the Friends menu is not toggled 
       cy.get('[data-testid=verticalNavigation]' ).contains('Friends')
       cy.get('[data-testid=verticalNavigation]' ).contains('My Friends')
    })
  })

});

