From 4a03d60667249e8673b5312c9476c35fc880cb33 Mon Sep 17 00:00:00 2001
From: les <lesion@autistici.org>
Date: Sun, 20 Oct 2019 14:07:09 +0200
Subject: [PATCH] [feat] Split federation/settings admin components

---
 components/admin/Federation.vue | 22 +++++++++
 components/admin/Settings.vue   | 64 ++++++++++++++++++++++++++
 components/admin/Users.vue      |  2 +-
 components/admin/timezones.js   |  4 ++
 locales/it.js                   | 12 +++--
 pages/admin.vue                 | 81 ++++++---------------------------
 6 files changed, 113 insertions(+), 72 deletions(-)
 create mode 100644 components/admin/Federation.vue
 create mode 100644 components/admin/Settings.vue
 create mode 100644 components/admin/timezones.js

diff --git a/components/admin/Federation.vue b/components/admin/Federation.vue
new file mode 100644
index 00000000..1b82fbf3
--- /dev/null
+++ b/components/admin/Federation.vue
@@ -0,0 +1,22 @@
+<template lang="pug">
+  div
+    el-divider {{$t('admin.federation')}}
+    el-form(inline label-width='400px')
+      el-form-item(:label="$t('admin.enable_federation')")
+        el-switch(v-model='enable_federation')    
+</template>
+<script>
+import { mapState, mapActions } from 'vuex'
+
+export default {
+  name: 'Federation',
+  methods: mapActions(['setSetting']),
+  computed: {
+    ...mapState(['settings']),
+    enable_federation: {
+      get () { return this.settings.enable_federation },
+      set (value) { this.setSetting({ key: 'enable_federation', value }) }
+    },
+  }
+}
+</script>
\ No newline at end of file
diff --git a/components/admin/Settings.vue b/components/admin/Settings.vue
new file mode 100644
index 00000000..c855f8f3
--- /dev/null
+++ b/components/admin/Settings.vue
@@ -0,0 +1,64 @@
+<template lang="pug">
+  div
+    el-form(inline label-width="400px")
+      //- select timezone
+      el-form-item(:label="$t('admin.select_instance_timezone')")
+        el-select(v-model='instance_timezone' filterable)
+          el-option(v-for='timezone in timezones' :key='timezone.value' :value='timezone.value')
+            span.float-left {{timezone.value}} 
+            small.float-right.text-danger {{timezone.offset}}
+
+      //- allow open registration
+      el-form-item(:label="$t('admin.allow_registration_description')")
+        el-switch(name='reg' v-model='allow_registration')
+
+      //- allow anon event
+      el-form-item(:label="$t('admin.allow_anon_event')")
+        el-switch(v-model='allow_anon_event')
+
+      el-form-item(:label="$t('admin.allow_recurrent_event')")
+        el-switch(v-model='allow_recurrent_event')
+
+      el-form-item(v-show='allow_recurrent_event' :label="$t('admin.recurrent_event_visible')")
+        el-switch(v-model='recurrent_event_visible')
+
+</template>
+<script>
+import { mapActions, mapState } from 'vuex'
+import moment from 'moment-timezone'
+import timezones from './timezones'
+export default {
+  name: 'Settings',
+  computed: {
+    timezones () {
+      const current_timezone = moment.tz.guess()
+      return timezones
+        .filter(tz => tz !== current_timezone)
+        .concat([current_timezone])
+        .map(tz => ({ value: tz, offset: moment().tz(tz).format('z Z') }))
+    },
+    ...mapState(['settings']),
+    instance_timezone: {
+      get () { return this.settings.instance_timezone },
+      set (value) { this.setSetting({ key: 'instance_timezone', value }) }
+    },
+    allow_registration: {
+      get () { return this.settings.allow_registration },
+      set (value) { this.setSetting({ key: 'allow_registration', value }) }
+    },
+    allow_anon_event: {
+      get () { return this.settings.allow_anon_event },
+      set (value) { this.setSetting({ key: 'allow_anon_event', value }) }
+    },
+    allow_recurrent_event: {
+      get () { return this.settings.allow_recurrent_event },
+      set (value) { this.setSetting({ key: 'allow_recurrent_event', value }) }
+    },
+    recurrent_event_visible: {
+      get () { return this.settings.recurrent_event_visible },
+      set (value) { this.setSetting({ key: 'recurrent_event_visible', value }) }
+    },
+  },
+  methods: mapActions(['setSetting'])
+}
+</script>
\ No newline at end of file
diff --git a/components/admin/Users.vue b/components/admin/Users.vue
index 1cb9b0a2..d5d0ed54 100644
--- a/components/admin/Users.vue
+++ b/components/admin/Users.vue
@@ -4,7 +4,7 @@ div
   el-collapse
     el-collapse-item
       template(slot='title')
-        h4  <v-icon name='plus'/> {{$t('common.new_user')}}
+        el-button(mini size='mini')  <v-icon name='plus'/> {{$t('common.new_user')}}
       el-form(inline)
         el-form-item(:label="$t('common.username')")
           el-input(v-model='new_user.username')
diff --git a/components/admin/timezones.js b/components/admin/timezones.js
new file mode 100644
index 00000000..68fb7316
--- /dev/null
+++ b/components/admin/timezones.js
@@ -0,0 +1,4 @@
+export default [
+  'Europe/Rome',
+  'Europe/Paris',
+]
\ No newline at end of file
diff --git a/locales/it.js b/locales/it.js
index ab7d09fb..8e0b3e74 100644
--- a/locales/it.js
+++ b/locales/it.js
@@ -52,7 +52,12 @@ export default {
     username: 'Nomignolo',
     comments: 'nessun commento|un commento|{n} commenti',
     activate_user: 'Confermato',
-    displayname: 'Nome mostrato'
+    displayname: 'Nome mostrato',
+    federation: 'Federazione',
+    set_password: 'Imposta password',
+    copy_link: 'Copia link',
+    send_via_mail: 'Invia mail',
+    add_to_calendar: 'Aggiungi al tuo calendario'
   },
 
   login: {
@@ -132,7 +137,7 @@ export default {
     due: 'alle',
     from: 'Dalle',
     image_too_big: 'Immagine troppo grande! Massimo 4M',
-    interact_with_me_at: 'Seguimi nel fediverso su'
+    interact_with_me_at: 'Seguimi nel fediverso su',
   },
 
   admin: {
@@ -151,7 +156,8 @@ export default {
     allow_recurrent_event: 'Abilita eventi fissi',
     recurrent_event_visible: 'Appuntamenti fissi visibili di default',
     federation: 'Federazione / ActivityPub',
-    enable_federation: 'Abilita la federazione!'
+    enable_federation: 'Abilita la federazione!',
+    select_instance_timezone: 'Seleziona la timezone'
   },
 
   auth: {
diff --git a/pages/admin.vue b/pages/admin.vue
index ae61eb07..fa8188d8 100644
--- a/pages/admin.vue
+++ b/pages/admin.vue
@@ -1,5 +1,5 @@
 <template lang="pug">
-  el-card#admin
+  el-main
     nuxt-link.float-right(to='/')
       el-button(circle  icon='el-icon-close' type='danger' size='small' plain)
 
@@ -31,7 +31,7 @@
           el-table-column(:label='$t("common.name")' width='300')
             template(slot-scope='data') {{data.row.title}}
           el-table-column(:label='$t("common.where")' width='250')
-            template(slot-scope='data') {{data.row.place.name}}
+            template(slot-scope='data') {{dperPageata.row.place.name}}
           el-table-column(:label='$t("common.confirm")' width='250')
             template(slot-scope='data')
               el-button(type='primary' @click='confirm(data.row.id)' size='mini') {{$t('common.confirm')}}
@@ -44,32 +44,14 @@
         template(slot='label')
           v-icon(name='cog')
           span  {{$t('common.settings')}}
+        Settings
 
-        el-form(inline label-width="400px")
-
-          //- allow open registration
-          el-form-item(:label="$t('admin.allow_registration_description')")
-            el-switch(name='reg' v-model='allow_registration')
-
-          //- allow anon event
-          el-form-item(:label="$t('admin.allow_anon_event')")
-            el-switch(v-model='allow_anon_event')
-
-          el-form-item(:label="$t('admin.allow_recurrent_event')")
-            el-switch(v-model='allow_recurrent_event')
-
-          el-form-item(v-show='allow_recurrent_event' :label="$t('admin.recurrent_event_visible')")
-            el-switch(v-model='recurrent_event_visible')
-
-        el-divider {{$t('admin.federation')}}
-        el-form(inline label-width='400px')
-          el-form-item(:label="$t('admin.enable_federation')")
-            el-switch(v-model='enable_federation')
-
-            //- el-form-item(:label="$t('admin.allow_boost_like')")
-            //-   el-switch(v-model='allow_comments')
-      //- el-tab-pane.pt-1
-        
+      //- FEDERATION
+      el-tab-pane.pt-1
+        template(slot='label')
+          v-icon(name='network-wired')
+          span.ml-1 {{$t('common.federation')}}
+        Federation
 
 </template>
 <script>
@@ -77,19 +59,18 @@ import { mapState, mapActions } from 'vuex'
 import { Message, MessageBox } from 'element-ui'
 import Users from '../components/admin/Users'
 import Places from '../components/admin/Places'
+import Settings from '../components/admin/Settings'
+import Federation from '../components/admin/Federation'
 
 export default {
   name: 'Admin',
-  components: { Users, Places },
+  components: { Users, Places, Settings, Federation },
   middleware: ['auth'],
   data () {
     return {
       perPage: 10,
       eventPage: 1,
-      tagPage: 1,
-      tagFields: ['tag', 'color'],
       description: '',
-      tag: { name: '', color: '' },
       events: [],
       loading: false,
       tab: '0',
@@ -108,50 +89,14 @@ export default {
       console.error(e)
     }
   },
-  async mounted () {
-    const code = this.$route.query.code
-
-    if (code) {
-      this.tab = '4'
-      const instance = await this.$axios.$post('/user/code', { code, is_admin: true })
-    }
-  },
   computed: {
-    ...mapState(['tags', 'settings']),
-    allow_registration: {
-      get () { return this.settings.allow_registration },
-      set (value) { this.setSetting({ key: 'allow_registration', value }) }
-    },
-    allow_anon_event: {
-      get () { return this.settings.allow_anon_event },
-      set (value) { this.setSetting({ key: 'allow_anon_event', value }) }
-    },
-    allow_recurrent_event: {
-      get () { return this.settings.allow_recurrent_event },
-      set (value) { this.setSetting({ key: 'allow_recurrent_event', value }) }
-    },
-    recurrent_event_visible: {
-      get () { return this.settings.recurrent_event_visible },
-      set (value) { this.setSetting({ key: 'recurrent_event_visible', value }) }
-    },
-    enable_federation: {
-      get () { return this.settings.enable_federation },
-      set (value) { this.setSetting({ key: 'enable_federation', value }) }
-    },
+    ...mapState(['settings']),
     paginatedEvents () {
       return this.events.slice((this.eventPage - 1) * this.perPage,
         this.eventPage * this.perPage)
     },
-    paginatedTags () {
-      return this.tags.slice((this.tagPage - 1) * this.perPage,
-        this.tagPage * this.perPage)
-    }
   },
   methods: {
-    ...mapActions(['setSetting']),
-    tagSelected (tag) {
-      this.tag = { color: tag.color, tag: tag.tag }
-    },
     preview (id) {
       this.$router.push(`/event/${id}`)
     },