Use new app settings components

[marcoambrosini]

• Requires App Settings Dialog nextcloud-libraries/nextcloud-vue#1286

[danxuliu]

This error appears now in the browser console when opening the main Talk UI (even if the settings dialog is not opened):

[Vue warn]: Error in updated hook: "TypeError: this.$el.querySelector is not a function"

found in

---> <AppSettingsDialog>
       <SettingsDialog> at src/components/SettingsDialog/SettingsDialog.vue
         <Content>
           <App> at src/App.vue
             <Root>

Additionally, clicking on the headers in the left area causes the right area to scroll to the appropriate section, but scrolling in the right area does not change the highlighted header in the left area (although this may be an issue of the component from nextcloud-vue, I do not know).

I have also noticed that content in the right area can not be selected using the mouse (not that I want to, but I found it strange :-P ) and, in Firefox, it is not possible to scroll in the right area using the arrow keys (although it works in Chromium). However it also happened before using the new AppSettings components, so it could be a problem with the Modal component (just a guess). Opened issues in nextcloud-vue.

[danxuliu]

Tested with nextcloud-libraries/nextcloud-vue#1503, but there is still something strange with the blurring (not sure if the issue is in the component or in how it is used):

• Open the settings
• Close the settings
• Open the settings
• Click on the second header
• Scroll

The header will not be blurred.

[PVince81]

Missing padding on top:

[PVince81]

seems this was closed by mistake

[PVince81]

please note that nextcloud-vue was updated, so many stuff that wasn't working before is working now.
you might need to rebase

[marcoambrosini]

Ready for review!

[PVince81]

a wild conflict appears!

[marcoambrosini]

Rebased!!