describe('settings', () => {
  beforeEach(() => {
    this.modifiedViews = []

    // mock API methods
    cy.fixture('saved_views/savedviews.json').then((savedViewsJson) => {
      // saved views PATCH
      cy.intercept(
        'PATCH',
        'http://localhost:8000/api/saved_views/*',
        (req) => {
          this.modifiedViews.push(req.body) // store this for later
          req.reply({ result: 'OK' })
        }
      )

      cy.intercept('GET', 'http://localhost:8000/api/saved_views/*', (req) => {
        let response = { ...savedViewsJson }
        if (this.modifiedViews.length) {
          response.results = response.results.map((v) => {
            if (this.modifiedViews.find((mv) => mv.id == v.id))
              v = this.modifiedViews.find((mv) => mv.id == v.id)
            return v
          })
        }

        req.reply(response)
      }).as('savedViews')
    })

    cy.fixture('documents/documents.json').then((documentsJson) => {
      cy.intercept('GET', 'http://localhost:8000/api/documents/1/', (req) => {
        let response = { ...documentsJson }
        response = response.results.find((d) => d.id == 1)
        req.reply(response)
      })
    })

    cy.intercept('http://localhost:8000/api/documents/1/metadata/', {
      fixture: 'documents/1/metadata.json',
    })

    cy.intercept('http://localhost:8000/api/documents/1/suggestions/', {
      fixture: 'documents/1/suggestions.json',
    })

    cy.viewport(1024, 1024)
    cy.visit('/settings')
    cy.wait('@savedViews')
  })

  it('should activate / deactivate save button when settings change and are saved', () => {
    cy.contains('button', 'Save').should('be.disabled')
    cy.contains('Use system settings').click()
    cy.contains('button', 'Save').should('not.be.disabled')
    cy.contains('button', 'Save').click()
    cy.contains('button', 'Save').should('be.disabled')
  })

  it('should warn on unsaved changes', () => {
    cy.contains('Use system settings').click()
    cy.contains('a', 'Dashboard').click()
    cy.contains('You have unsaved changes')
    cy.contains('button', 'Cancel').click()
    cy.contains('button', 'Save').click().wait('@savedViews')
    cy.contains('a', 'Dashboard').click()
    cy.contains('You have unsaved changes').should('not.exist')
  })

  it('should apply appearance changes when set', () => {
    cy.contains('Use system settings').click()
    cy.get('body').should('not.have.class', 'color-scheme-system')
    cy.contains('Enable dark mode').click()
    cy.get('body').should('have.class', 'color-scheme-dark')
  })

  it('should remove saved view from sidebar when unset', () => {
    cy.contains('a', 'Saved views').click()
    cy.get('#show_in_sidebar_1').click()
    cy.contains('button', 'Save').click().wait('@savedViews')
    cy.contains('li', 'Inbox').should('not.exist')
  })

  it('should remove saved view from dashboard when unset', () => {
    cy.contains('a', 'Saved views').click()
    cy.get('#show_on_dashboard_1').click()
    cy.contains('button', 'Save').click().wait('@savedViews')
    cy.visit('/dashboard')
    cy.get('app-saved-view-widget').contains('Inbox').should('not.exist')
  })

  it('should change the pdf viewer type', () => {
    cy.visit('/documents/1')
    cy.get('object[data*="/api/documents/1/preview/"]').should('not.exist')
    cy.visit('/settings')
    cy.contains('Use PDF viewer provided by the browser').click().wait(1000) // await change to be registered
    cy.contains('button', 'Save').click().wait('@savedViews').wait(1000)
    cy.visit('/documents/1')
    cy.get('object[data*="/api/documents/1/preview/"]')
  })
})