From 4d23d31fecf480abfccc4db3ac79c6640078dc3b Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 14 Mar 2023 21:50:43 +0200
Subject: initial admin settings prototype (WIP)

---
 .../settings_modal/admin_tabs/instance_tab.js      | 29 ++++++++++++++++++++++
 1 file changed, 29 insertions(+)
 create mode 100644 src/components/settings_modal/admin_tabs/instance_tab.js

(limited to 'src/components/settings_modal/admin_tabs/instance_tab.js')

diff --git a/src/components/settings_modal/admin_tabs/instance_tab.js b/src/components/settings_modal/admin_tabs/instance_tab.js
new file mode 100644
index 00000000..4a261659
--- /dev/null
+++ b/src/components/settings_modal/admin_tabs/instance_tab.js
@@ -0,0 +1,29 @@
+import BooleanSetting from '../helpers/boolean_setting.vue'
+import ChoiceSetting from '../helpers/choice_setting.vue'
+import IntegerSetting from '../helpers/integer_setting.vue'
+import StringSetting from '../helpers/string_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faGlobe
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faGlobe
+)
+
+const InstanceTab = {
+  data () {},
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting
+  },
+  computed: {
+    ...SharedComputedObject()
+  }
+}
+
+export default InstanceTab
-- 
cgit v1.2.3-70-g09d2


From 6b40fc989575fd52b3b9bf3e8d78d7fb4a6c7696 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 21 Mar 2023 22:26:11 +0200
Subject: fixes

---
 .../settings_modal/admin_tabs/instance_tab.js      |  1 -
 .../settings_modal/helpers/boolean_setting.vue     | 27 +++++++++++-----------
 .../settings_modal/helpers/draft_buttons.vue       |  4 ++--
 src/components/settings_modal/helpers/setting.js   |  2 --
 4 files changed, 15 insertions(+), 19 deletions(-)

(limited to 'src/components/settings_modal/admin_tabs/instance_tab.js')

diff --git a/src/components/settings_modal/admin_tabs/instance_tab.js b/src/components/settings_modal/admin_tabs/instance_tab.js
index 4a261659..77a05d38 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.js
+++ b/src/components/settings_modal/admin_tabs/instance_tab.js
@@ -14,7 +14,6 @@ library.add(
 )
 
 const InstanceTab = {
-  data () {},
   components: {
     BooleanSetting,
     ChoiceSetting,
diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue
index aedbf23e..07971b00 100644
--- a/src/components/settings_modal/helpers/boolean_setting.vue
+++ b/src/components/settings_modal/helpers/boolean_setting.vue
@@ -13,26 +13,25 @@
         class="label"
       >
         <template v-if="backendDescription">
-          {{ backendDescriptionLabel + ' ' }}
+          {{ backendDescriptionLabel }}
         </template>
         <template v-else>
           <slot />
         </template>
       </span>
-      {{ ' ' }}
-      <ModifiedIndicator
-        :changed="isChanged"
-        :onclick="reset"
-      />
-      <ProfileSettingIndicator :is-profile="isProfileSetting" />
-      <DraftButtons />
-      <p
-        v-if="backendDescriptionDescription"
-        class="setting-description"
-      >
-        {{ backendDescriptionDescription + ' ' }}
-      </p>
     </Checkbox>
+    <ModifiedIndicator
+      :changed="isChanged"
+      :onclick="reset"
+    />
+    <ProfileSettingIndicator :is-profile="isProfileSetting" />
+    <DraftButtons />
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
   </label>
 </template>
 
diff --git a/src/components/settings_modal/helpers/draft_buttons.vue b/src/components/settings_modal/helpers/draft_buttons.vue
index 53ddc9b4..9e972b14 100644
--- a/src/components/settings_modal/helpers/draft_buttons.vue
+++ b/src/components/settings_modal/helpers/draft_buttons.vue
@@ -5,13 +5,13 @@
     class="DraftButtons"
   >
     <Popover
+      v-if="$parent.isDirty"
       trigger="hover"
       :trigger-attrs="{ 'aria-label': $t('settings.commit_value_tooltip') }"
     >
       <template #trigger>
         &nbsp;
         <button
-          v-if="$parent.isDirty"
           class="button button-default btn"
           type="button"
           :title="$t('settings.commit_value')"
@@ -27,13 +27,13 @@
       </template>
     </Popover>
     <Popover
+      v-if="$parent.isDirty"
       trigger="hover"
       :trigger-attrs="{ 'aria-label': $t('settings.reset_value_tooltip') }"
     >
       <template #trigger>
         &nbsp;
         <button
-          v-if="$parent.isDirty"
           class="button button-default btn"
           type="button"
           :title="$t('settings.reset_value')"
diff --git a/src/components/settings_modal/helpers/setting.js b/src/components/settings_modal/helpers/setting.js
index a6d35fb9..fd730db9 100644
--- a/src/components/settings_modal/helpers/setting.js
+++ b/src/components/settings_modal/helpers/setting.js
@@ -1,4 +1,3 @@
-import Checkbox from 'src/components/checkbox/checkbox.vue'
 import ModifiedIndicator from './modified_indicator.vue'
 import ProfileSettingIndicator from './profile_setting_indicator.vue'
 import DraftButtons from './draft_buttons.vue'
@@ -6,7 +5,6 @@ import { get, set } from 'lodash'
 
 export default {
   components: {
-    Checkbox,
     ModifiedIndicator,
     DraftButtons,
     ProfileSettingIndicator
-- 
cgit v1.2.3-70-g09d2


From 2bf224e214d9b42333a2139a89c089ca9a544149 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 21 Mar 2023 22:46:40 +0200
Subject: made draft-mode and source inject-able

---
 .../settings_modal/admin_tabs/instance_tab.js      |  6 ++
 .../settings_modal/admin_tabs/instance_tab.vue     | 78 ++++------------------
 .../settings_modal/helpers/choice_setting.js       |  3 +-
 .../settings_modal/helpers/choice_setting.vue      |  2 +-
 .../settings_modal/helpers/number_setting.vue      |  2 +-
 src/components/settings_modal/helpers/setting.js   | 41 ++++++++----
 .../settings_modal/helpers/string_setting.vue      |  2 +-
 7 files changed, 50 insertions(+), 84 deletions(-)

(limited to 'src/components/settings_modal/admin_tabs/instance_tab.js')

diff --git a/src/components/settings_modal/admin_tabs/instance_tab.js b/src/components/settings_modal/admin_tabs/instance_tab.js
index 77a05d38..7aaedbce 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.js
+++ b/src/components/settings_modal/admin_tabs/instance_tab.js
@@ -14,6 +14,12 @@ library.add(
 )
 
 const InstanceTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
   components: {
     BooleanSetting,
     ChoiceSetting,
diff --git a/src/components/settings_modal/admin_tabs/instance_tab.vue b/src/components/settings_modal/admin_tabs/instance_tab.vue
index 411982cc..43ad4c8c 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.vue
+++ b/src/components/settings_modal/admin_tabs/instance_tab.vue
@@ -4,65 +4,37 @@
       <h2>{{ $t('admin_dash.instance.instance') }}</h2>
       <ul class="setting-list">
         <li>
-          <StringSetting
-            source="admin"
-            path=":pleroma.:instance.:name"
-            draft-mode
-          >
+          <StringSetting path=":pleroma.:instance.:name">
             NAME
           </StringSetting>
         </li>
         <li>
-          <StringSetting
-            source="admin"
-            path=":pleroma.:instance.:email"
-            draft-mode
-          >
+          <StringSetting path=":pleroma.:instance.:email">
             ADMIN EMAIL
           </StringSetting>
         </li>
         <li>
-          <StringSetting
-            source="admin"
-            path=":pleroma.:instance.:description"
-            draft-mode
-          >
+          <StringSetting path=":pleroma.:instance.:description">
             DESCRIPTION
           </StringSetting>
         </li>
         <li>
-          <StringSetting
-            source="admin"
-            path=":pleroma.:instance.:short_description"
-            draft-mode
-          >
+          <StringSetting path=":pleroma.:instance.:short_description">
             SHORT DESCRIPTION
           </StringSetting>
         </li>
         <li>
-          <StringSetting
-            source="admin"
-            path=":pleroma.:instance.:instance_thumbnail"
-            draft-mode
-          >
+          <StringSetting path=":pleroma.:instance.:instance_thumbnail">
             INSTANCE THUMBNAIL
           </StringSetting>
         </li>
         <li>
-          <StringSetting
-            source="admin"
-            path=":pleroma.:instance.:background_image"
-            draft-mode
-          >
+          <StringSetting path=":pleroma.:instance.:background_image">
             BACKGROUND IMAGE
           </StringSetting>
         </li>
         <li>
-          <BooleanSetting
-            source="admin"
-            path=":pleroma.:instance.:public"
-            draft-mode
-          >
+          <BooleanSetting path=":pleroma.:instance.:public">
             PUBLIC
           </BooleanSetting>
         </li>
@@ -72,21 +44,15 @@
       <h2>{{ $t('admin_dash.instance.registrations') }}</h2>
       <ul class="setting-list">
         <li>
-          <BooleanSetting
-            source="admin"
-            path=":pleroma.:instance.:registrations_open"
-            draft-mode
-          >
+          <BooleanSetting path=":pleroma.:instance.:registrations_open">
             REGISTRATIONS OPEN
           </BooleanSetting>
           <ul class="setting-list suboptions">
             <li>
               <BooleanSetting
-                source="admin"
                 path=":pleroma.:instance.:invites_enabled"
                 parent-path=":pleroma.:instance.:registrations_open"
                 :parent-invert="true"
-                draft-mode
               >
                 INVITES ENABLED
               </BooleanSetting>
@@ -94,20 +60,12 @@
           </ul>
         </li>
         <li>
-          <BooleanSetting
-            source="admin"
-            path=":pleroma.:instance.:account_activation_required"
-            draft-mode
-          >
+          <BooleanSetting path=":pleroma.:instance.:account_activation_required">
             ACTIVATION REQUIRED
           </BooleanSetting>
         </li>
         <li>
-          <BooleanSetting
-            source="admin"
-            path=":pleroma.:instance.:account_approval_required"
-            draft-mode
-          >
+          <BooleanSetting path=":pleroma.:instance.:account_approval_required">
             APPROVAL REQUIRED
           </BooleanSetting>
         </li>
@@ -115,32 +73,24 @@
           <h3>{{ $t('admin_dash.instance.captcha_header') }}</h3>
         </li>
         <li>
-          <BooleanSetting
-            source="admin"
-            :path="[':pleroma', 'Pleroma.Captcha', ':enabled']"
-            draft-mode
-          >
+          <BooleanSetting :path="[':pleroma', 'Pleroma.Captcha', ':enabled']">
             CAPTCHA
           </BooleanSetting>
           <ul class="setting-list suboptions">
             <li>
               <ChoiceSetting
-                source="admin"
                 :path="[':pleroma', 'Pleroma.Captcha', ':method']"
                 :parent-path="[':pleroma', 'Pleroma.Captcha', ':enabled']"
                 :option-label-map="{
                   'Pleroma.Captcha.Native': $t('admin_dash.captcha.native'),
                   'Pleroma.Captcha.Kocaptcha': $t('admin_dash.captcha.kocaptcha')
                 }"
-                draft-mode
               >
                 CAPTCHA TYPE
               </ChoiceSetting>
               <IntegerSetting
-                source="admin"
                 :path="[':pleroma', 'Pleroma.Captcha', ':seconds_valid']"
                 :parent-path="[':pleroma', 'Pleroma.Captcha', ':enabled']"
-                draft-mode
               >
                 VALID
               </IntegerSetting>
@@ -152,11 +102,7 @@
           >
             <h4>{{ $t('admin_dash.instance.kocaptcha') }}</h4>
             <li>
-              <StringSetting
-                source="admin"
-                :path="[':pleroma', 'Pleroma.Captcha.Kocaptcha', ':endpoint']"
-                draft-mode
-              >
+              <StringSetting :path="[':pleroma', 'Pleroma.Captcha.Kocaptcha', ':endpoint']">
                 cockAPTCHA ENDPOINT
               </StringSetting>
             </li>
diff --git a/src/components/settings_modal/helpers/choice_setting.js b/src/components/settings_modal/helpers/choice_setting.js
index 3ff81bc9..bdeece76 100644
--- a/src/components/settings_modal/helpers/choice_setting.js
+++ b/src/components/settings_modal/helpers/choice_setting.js
@@ -22,8 +22,7 @@ export default {
   computed: {
     ...Setting.computed,
     realOptions () {
-      if (this.source === 'admin') {
-        console.log(this.backendDescriptionSuggestions)
+      if (this.realSource === 'admin') {
         return this.backendDescriptionSuggestions.map(x => ({
           key: x,
           value: x,
diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue
index 55f9a62c..8713acf5 100644
--- a/src/components/settings_modal/helpers/choice_setting.vue
+++ b/src/components/settings_modal/helpers/choice_setting.vue
@@ -11,7 +11,7 @@
     </template>
     {{ ' ' }}
     <Select
-      :model-value="draftMode ? draft :state"
+      :model-value="realDraftMode ? draft :state"
       :disabled="disabled"
       @update:modelValue="update"
     >
diff --git a/src/components/settings_modal/helpers/number_setting.vue b/src/components/settings_modal/helpers/number_setting.vue
index 93a7a79a..f97d5cf2 100644
--- a/src/components/settings_modal/helpers/number_setting.vue
+++ b/src/components/settings_modal/helpers/number_setting.vue
@@ -18,7 +18,7 @@
       :step="step || 1"
       :disabled="disabled"
       :min="min || 0"
-      :value="draftMode ? draft :state"
+      :value="realDraftMode ? draft :state"
       @change="update"
     >
     {{ ' ' }}
diff --git a/src/components/settings_modal/helpers/setting.js b/src/components/settings_modal/helpers/setting.js
index fd730db9..7cad27b7 100644
--- a/src/components/settings_modal/helpers/setting.js
+++ b/src/components/settings_modal/helpers/setting.js
@@ -31,10 +31,18 @@ export default {
     },
     source: {
       type: String,
-      default: 'default'
+      default: undefined
     },
     draftMode: {
       type: Boolean,
+      default: undefined
+    }
+  },
+  inject: {
+    defaultSource: {
+      default: 'default'
+    },
+    defaultDraftMode: {
       default: false
     }
   },
@@ -44,7 +52,7 @@ export default {
     }
   },
   created () {
-    if (this.draftMode) {
+    if (this.realDraftMode) {
       this.draft = this.state
     }
   },
@@ -57,6 +65,12 @@ export default {
         return value
       }
     },
+    realSource () {
+      return this.source || this.defaultSource
+    },
+    realDraftMode () {
+      return typeof this.draftMode === 'undefined' ? this.defaultDraftMode : this.draftMode
+    },
     backendDescription () {
       return get(this.$store.state.adminSettings.descriptions, this.path)
     },
@@ -74,7 +88,8 @@ export default {
       return this.disabled || (parentValue !== null ? (this.parentInvert ? parentValue : !parentValue) : false)
     },
     configSource () {
-      switch (this.source) {
+      console.log('SRC', this.realSource)
+      switch (this.realSource) {
         case 'profile':
           return this.$store.state.profileConfig
         case 'admin':
@@ -84,7 +99,7 @@ export default {
       }
     },
     configSink () {
-      switch (this.source) {
+      switch (this.realSource) {
         case 'profile':
           return (k, v) => this.$store.dispatch('setProfileOption', { name: k, value: v })
         case 'admin':
@@ -94,7 +109,7 @@ export default {
       }
     },
     defaultState () {
-      switch (this.source) {
+      switch (this.realSource) {
         case 'profile':
           return {}
         default:
@@ -102,10 +117,10 @@ export default {
       }
     },
     isProfileSetting () {
-      return this.source === 'profile'
+      return this.realSource === 'profile'
     },
     isChanged () {
-      switch (this.source) {
+      switch (this.realSource) {
         case 'profile':
         case 'admin':
           return false
@@ -114,10 +129,10 @@ export default {
       }
     },
     isDirty () {
-      return this.draftMode && this.draft !== this.state
+      return this.realDraftMode && this.draft !== this.state
     },
     canHardReset () {
-      return this.source === 'admin' && this.$store.state.adminSettings.modifiedPaths.has(this.path)
+      return this.realSource === 'admin' && this.$store.state.adminSettings.modifiedPaths.has(this.path)
     },
     matchesExpertLevel () {
       return (this.expert || 0) <= this.$store.state.config.expertLevel > 0
@@ -128,20 +143,20 @@ export default {
       return e.target.value
     },
     update (e) {
-      if (this.draftMode) {
+      if (this.realDraftMode) {
         this.draft = this.getValue(e)
       } else {
         this.configSink(this.path, this.getValue(e))
       }
     },
     commitDraft () {
-      if (this.draftMode) {
+      if (this.realDraftMode) {
         this.configSink(this.path, this.draft)
       }
     },
     reset () {
       console.log('reset')
-      if (this.draftMode) {
+      if (this.realDraftMode) {
         console.log(this.draft)
         console.log(this.state)
         this.draft = this.state
@@ -150,7 +165,7 @@ export default {
       }
     },
     hardReset () {
-      switch (this.source) {
+      switch (this.realSource) {
         case 'admin':
           return this.$store.dispatch('resetAdminSetting', { path: this.path })
             .then(() => { this.draft = this.state })
diff --git a/src/components/settings_modal/helpers/string_setting.vue b/src/components/settings_modal/helpers/string_setting.vue
index 91a4afa4..fb91b5d9 100644
--- a/src/components/settings_modal/helpers/string_setting.vue
+++ b/src/components/settings_modal/helpers/string_setting.vue
@@ -16,7 +16,7 @@
       class="string-input"
       step="1"
       :disabled="disabled"
-      :value="draftMode ? draft :state"
+      :value="realDraftMode ? draft : state"
       @change="update"
     >
     {{ ' ' }}
-- 
cgit v1.2.3-70-g09d2


From c7a16bdfe2cebe51c232ae3fe3101d35c4f877a2 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 22 Mar 2023 12:43:53 +0200
Subject: grouped settings/managed drafts support added

---
 .../settings_modal/admin_tabs/instance_tab.js      |  4 ++-
 .../settings_modal/admin_tabs/instance_tab.vue     | 15 ++++++++++
 .../settings_modal/helpers/group_setting.js        | 14 ++++++++++
 .../settings_modal/helpers/group_setting.vue       | 15 ++++++++++
 src/components/settings_modal/helpers/setting.js   | 32 +++++++++++++++++++---
 src/modules/adminSettings.js                       | 24 ++++++++++++++--
 6 files changed, 96 insertions(+), 8 deletions(-)
 create mode 100644 src/components/settings_modal/helpers/group_setting.js
 create mode 100644 src/components/settings_modal/helpers/group_setting.vue

(limited to 'src/components/settings_modal/admin_tabs/instance_tab.js')

diff --git a/src/components/settings_modal/admin_tabs/instance_tab.js b/src/components/settings_modal/admin_tabs/instance_tab.js
index 7aaedbce..f702afcf 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.js
+++ b/src/components/settings_modal/admin_tabs/instance_tab.js
@@ -2,6 +2,7 @@ import BooleanSetting from '../helpers/boolean_setting.vue'
 import ChoiceSetting from '../helpers/choice_setting.vue'
 import IntegerSetting from '../helpers/integer_setting.vue'
 import StringSetting from '../helpers/string_setting.vue'
+import GroupSetting from '../helpers/group_setting.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
@@ -24,7 +25,8 @@ const InstanceTab = {
     BooleanSetting,
     ChoiceSetting,
     IntegerSetting,
-    StringSetting
+    StringSetting,
+    GroupSetting
   },
   computed: {
     ...SharedComputedObject()
diff --git a/src/components/settings_modal/admin_tabs/instance_tab.vue b/src/components/settings_modal/admin_tabs/instance_tab.vue
index 96d8a17e..9291ddf8 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.vue
+++ b/src/components/settings_modal/admin_tabs/instance_tab.vue
@@ -70,6 +70,11 @@
             FED TIMELINES
           </BooleanSetting>
         </li>
+        <li>
+          <GroupSetting path=":pleroma.:restrict_unauthenticated.:timelines">
+            TIMELINES
+          </GroupSetting>
+        </li>
         <li>
           <h4>{{ $t('admin_dash.instance.restrict.profiles') }}</h4>
         </li>
@@ -89,6 +94,11 @@
             FED PROFILES
           </BooleanSetting>
         </li>
+        <li>
+          <GroupSetting path=":pleroma.:restrict_unauthenticated.:profiles">
+            PROFILES
+          </GroupSetting>
+        </li>
         <li>
           <h4>{{ $t('admin_dash.instance.restrict.activities') }}</h4>
         </li>
@@ -108,6 +118,11 @@
             FED STATUSES
           </BooleanSetting>
         </li>
+        <li>
+          <GroupSetting path=":pleroma.:restrict_unauthenticated.:activities">
+            STATUSES
+          </GroupSetting>
+        </li>
       </ul>
     </div>
     <div class="setting-item">
diff --git a/src/components/settings_modal/helpers/group_setting.js b/src/components/settings_modal/helpers/group_setting.js
new file mode 100644
index 00000000..12a49000
--- /dev/null
+++ b/src/components/settings_modal/helpers/group_setting.js
@@ -0,0 +1,14 @@
+import { isEqual } from 'lodash'
+
+import Setting from './setting.js'
+
+export default {
+  ...Setting,
+  computed: {
+    ...Setting.computed,
+    isDirty () {
+      console.log(this.state, this.draft)
+      return !isEqual(this.state, this.draft)
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/group_setting.vue b/src/components/settings_modal/helpers/group_setting.vue
new file mode 100644
index 00000000..a4df4bf3
--- /dev/null
+++ b/src/components/settings_modal/helpers/group_setting.vue
@@ -0,0 +1,15 @@
+<template>
+  <span
+    v-if="matchesExpertLevel"
+    class="GroupSetting"
+  >
+    <ModifiedIndicator
+      :changed="isChanged"
+      :onclick="reset"
+    />
+    <ProfileSettingIndicator :is-profile="isProfileSetting" />
+    <DraftButtons />
+  </span>
+</template>
+
+<script src="./group_setting.js"></script>
diff --git a/src/components/settings_modal/helpers/setting.js b/src/components/settings_modal/helpers/setting.js
index d42ae763..d2e1a6f4 100644
--- a/src/components/settings_modal/helpers/setting.js
+++ b/src/components/settings_modal/helpers/setting.js
@@ -48,15 +48,32 @@ export default {
   },
   data () {
     return {
-      draft: null
+      localDraft: null
     }
   },
   created () {
-    if (this.realDraftMode) {
+    if (this.realDraftMode && this.realSource !== 'admin') {
       this.draft = this.state
     }
   },
   computed: {
+    draft: {
+      // TODO allow passing shared draft object?
+      get () {
+        if (this.realSource === 'admin') {
+          return get(this.$store.state.adminSettings.draft, this.path)
+        } else {
+          return this.localDraft
+        }
+      },
+      set (value) {
+        if (this.realSource === 'admin') {
+          this.$store.commit('updateAdminDraft', { path: this.canonPath, value })
+        } else {
+          this.localDraft = value
+        }
+      }
+    },
     state () {
       const value = get(this.configSource, this.path)
       if (value === undefined) {
@@ -130,11 +147,18 @@ export default {
           return this.state !== this.defaultState
       }
     },
+    canonPath () {
+      return Array.isArray(this.path) ? this.path : this.path.split('.')
+    },
     isDirty () {
-      return this.realDraftMode && this.draft !== this.state
+      if (this.realSource === 'admin' && this.canonPath.length > 3) {
+        return false // should not show draft buttons for "grouped" values
+      } else {
+        return this.realDraftMode && this.draft !== this.state
+      }
     },
     canHardReset () {
-      return this.realSource === 'admin' && this.$store.state.adminSettings.modifiedPaths.has(this.path)
+      return this.realSource === 'admin' && this.$store.state.adminSettings.modifiedPaths.has(this.canonPath.join(' -> '))
     },
     matchesExpertLevel () {
       return (this.expert || 0) <= this.$store.state.config.expertLevel > 0
diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js
index a84fadbf..27d5b37d 100644
--- a/src/modules/adminSettings.js
+++ b/src/modules/adminSettings.js
@@ -1,10 +1,11 @@
-import { set, cloneDeep } from 'lodash'
+import { set, get, cloneDeep } from 'lodash'
 
 export const defaultState = {
   needsReboot: null,
   config: null,
   modifiedPaths: null,
-  descriptions: null
+  descriptions: null,
+  draft: null
 }
 
 export const newUserFlags = {
@@ -22,6 +23,20 @@ const adminSettingsStorage = {
     },
     updateAdminDescriptions (state, { descriptions }) {
       state.descriptions = descriptions
+    },
+    updateAdminDraft (state, { path, value }) {
+      const [group, key, subkey] = path
+      const parent = [group, key, subkey]
+
+      set(state.draft, path, value)
+
+      // force-updating grouped draft to trigger refresh of group settings
+      if (path.length > parent.length) {
+        set(state.draft, parent, cloneDeep(get(state.draft, parent)))
+      }
+    },
+    resetAdminDraft (state) {
+      state.draft = cloneDeep(state.config)
     }
   },
   actions: {
@@ -31,7 +46,9 @@ const adminSettingsStorage = {
       backendDbConfig.configs.forEach(c => {
         const path = [c.group, c.key]
         if (c.db) {
-          c.db.forEach(x => modifiedPaths.add(path + '.' + x))
+          // Path elements can contain dot, therefore we use ' -> ' as a separator instead
+          // Using strings for modified paths for easier searching
+          c.db.forEach(x => modifiedPaths.add([...path, x].join(' -> ')))
         }
         const convert = (value) => {
           if (Array.isArray(value) && value.length > 0 && value[0].tuple) {
@@ -46,6 +63,7 @@ const adminSettingsStorage = {
       })
       console.log(config[':pleroma'])
       commit('updateAdminSettings', { config, modifiedPaths })
+      commit('resetAdminDraft')
     },
     setInstanceAdminDescriptions ({ state, commit, dispatch }, { backendDescriptions }) {
       const convert = ({ children, description, label, key = '<ROOT>', group, suggestions }, path, acc) => {
-- 
cgit v1.2.3-70-g09d2


From 9aaa8a86f52bc97838c768a8859919a3ad6fd54f Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Thu, 13 Apr 2023 01:11:20 +0300
Subject: initial implementation of attachmentsetting

---
 .../settings_modal/admin_tabs/instance_tab.js      |  2 +
 .../settings_modal/admin_tabs/instance_tab.vue     |  8 +--
 .../settings_modal/helpers/attachment_setting.js   | 42 +++++++++++++
 .../settings_modal/helpers/attachment_setting.vue  | 70 ++++++++++++++++++++++
 .../settings_modal/helpers/string_setting.vue      |  1 -
 src/services/file_type/file_type.service.js        | 18 +++++-
 6 files changed, 134 insertions(+), 7 deletions(-)
 create mode 100644 src/components/settings_modal/helpers/attachment_setting.js
 create mode 100644 src/components/settings_modal/helpers/attachment_setting.vue

(limited to 'src/components/settings_modal/admin_tabs/instance_tab.js')

diff --git a/src/components/settings_modal/admin_tabs/instance_tab.js b/src/components/settings_modal/admin_tabs/instance_tab.js
index f702afcf..b07bafe8 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.js
+++ b/src/components/settings_modal/admin_tabs/instance_tab.js
@@ -3,6 +3,7 @@ import ChoiceSetting from '../helpers/choice_setting.vue'
 import IntegerSetting from '../helpers/integer_setting.vue'
 import StringSetting from '../helpers/string_setting.vue'
 import GroupSetting from '../helpers/group_setting.vue'
+import AttachmentSetting from '../helpers/attachment_setting.vue'
 
 import SharedComputedObject from '../helpers/shared_computed_object.js'
 import { library } from '@fortawesome/fontawesome-svg-core'
@@ -26,6 +27,7 @@ const InstanceTab = {
     ChoiceSetting,
     IntegerSetting,
     StringSetting,
+    AttachmentSetting,
     GroupSetting
   },
   computed: {
diff --git a/src/components/settings_modal/admin_tabs/instance_tab.vue b/src/components/settings_modal/admin_tabs/instance_tab.vue
index 535e4132..e519e135 100644
--- a/src/components/settings_modal/admin_tabs/instance_tab.vue
+++ b/src/components/settings_modal/admin_tabs/instance_tab.vue
@@ -24,14 +24,14 @@
           </StringSetting>
         </li>
         <li>
-          <StringSetting path=":pleroma.:instance.:instance_thumbnail">
+          <AttachmentSetting path=":pleroma.:instance.:instance_thumbnail">
             INSTANCE THUMBNAIL
-          </StringSetting>
+          </AttachmentSetting>
         </li>
         <li>
-          <StringSetting path=":pleroma.:instance.:background_image">
+          <AttachmentSetting path=":pleroma.:instance.:background_image">
             BACKGROUND IMAGE
-          </StringSetting>
+          </AttachmentSetting>
         </li>
       </ul>
     </div>
diff --git a/src/components/settings_modal/helpers/attachment_setting.js b/src/components/settings_modal/helpers/attachment_setting.js
new file mode 100644
index 00000000..a0a12ead
--- /dev/null
+++ b/src/components/settings_modal/helpers/attachment_setting.js
@@ -0,0 +1,42 @@
+import Setting from './setting.js'
+import { fileTypeExt } from 'src/services/file_type/file_type.service.js'
+import MediaUpload from 'src/components/media_upload/media_upload.vue'
+import Attachment from 'src/components/attachment/attachment.vue'
+
+export default {
+  ...Setting,
+  props: {
+    ...Setting.props,
+    type: {
+      type: Array,
+      required: false,
+      default: []
+    }
+  },
+  components: {
+    ...Setting.components,
+    MediaUpload,
+    Attachment
+  },
+  computed: {
+    ...Setting.computed,
+    attachment () {
+      const path = this.realDraftMode ? this.draft : this.state
+      const url = path.includes('://') ? path : this.$store.state.instance.server + path
+      return {
+        mimetype: fileTypeExt(url),
+        url
+      }
+    }
+  },
+  methods: {
+    ...Setting.methods,
+    setMediaFile (fileInfo) {
+      if (this.realDraftMode) {
+        this.draft = fileInfo.url
+      } else {
+        this.configSink(this.path, fileInfo.url)
+      }
+    }
+  }
+}
diff --git a/src/components/settings_modal/helpers/attachment_setting.vue b/src/components/settings_modal/helpers/attachment_setting.vue
new file mode 100644
index 00000000..3a933511
--- /dev/null
+++ b/src/components/settings_modal/helpers/attachment_setting.vue
@@ -0,0 +1,70 @@
+<template>
+  <span
+    v-if="matchesExpertLevel"
+    class="AttachmentSetting"
+  >
+    <label :for="path" :class="{ 'faint': shouldBeDisabled }">
+      <template v-if="backendDescriptionLabel">
+        {{ backendDescriptionLabel + ' ' }}
+      </template>
+      <template v-else>
+        <slot />
+      </template>
+
+    </label>
+    <p
+      v-if="backendDescriptionDescription"
+      class="setting-description"
+      :class="{ 'faint': shouldBeDisabled }"
+    >
+      {{ backendDescriptionDescription + ' ' }}
+    </p>
+    <div class="attachment-input">
+      <Attachment
+        class="attachment"
+        :compact="compact"
+        :attachment="attachment"
+        size="small"
+        hide-description
+        @setMedia="onMedia"
+        @naturalSizeLoad="onNaturalSizeLoad"
+      />
+      <div class="controls">
+        <media-upload
+          normal-button
+          ref="mediaUpload"
+          class="media-upload-icon"
+          :drop-files="dropFiles"
+          @uploaded="setMediaFile"
+          @upload-failed="uploadFailed"
+        />
+        <input
+          :id="path"
+          class="string-input"
+          :disabled="shouldBeDisabled"
+          :value="realDraftMode ? draft : state"
+          @change="update"
+        >
+        {{ ' ' }}
+        <ModifiedIndicator
+          :changed="isChanged"
+          :onclick="reset"
+        />
+        <ProfileSettingIndicator :is-profile="isProfileSetting" />
+      </div>
+    </div>
+    <DraftButtons />
+  </span>
+</template>
+
+<script src="./attachment_setting.js"></script>
+
+<style lang="scss">
+.AttachmentSetting {
+  .attachment {
+    display: block;
+    width: 20em;
+    height: 15em;
+  }
+}
+</style>
diff --git a/src/components/settings_modal/helpers/string_setting.vue b/src/components/settings_modal/helpers/string_setting.vue
index 7e70b82f..84d0a9d6 100644
--- a/src/components/settings_modal/helpers/string_setting.vue
+++ b/src/components/settings_modal/helpers/string_setting.vue
@@ -14,7 +14,6 @@
     <input
       :id="path"
       class="string-input"
-      step="1"
       :disabled="shouldBeDisabled"
       :value="realDraftMode ? draft : state"
       @change="update"
diff --git a/src/services/file_type/file_type.service.js b/src/services/file_type/file_type.service.js
index 5182ecd1..b92c6c64 100644
--- a/src/services/file_type/file_type.service.js
+++ b/src/services/file_type/file_type.service.js
@@ -1,7 +1,7 @@
 // TODO this func might as well take the entire file and use its mimetype
 // or the entire service could be just mimetype service that only operates
 // on mimetypes and not files. Currently the naming is confusing.
-const fileType = mimetype => {
+export const fileType = mimetype => {
   if (mimetype.match(/flash/)) {
     return 'flash'
   }
@@ -25,11 +25,25 @@ const fileType = mimetype => {
   return 'unknown'
 }
 
-const fileMatchesSomeType = (types, file) =>
+export const fileTypeExt = url => {
+  if (url.match(/\.(png|jpe?g|gif|webp|avif)$/)) {
+    return 'image'
+  }
+  if (url.match(/\.(ogv|mp4|webm|mov)$/)) {
+    return 'video'
+  }
+  if (url.match(/\.(it|s3m|mod|umx|mp3|aac|m4a|flac|alac|ogg|oga|opus|wav|ape|midi?)$/)) {
+    return 'audio'
+  }
+  return 'unknown'
+}
+
+export const fileMatchesSomeType = (types, file) =>
   types.some(type => fileType(file.mimetype) === type)
 
 const fileTypeService = {
   fileType,
+  fileTypeExt,
   fileMatchesSomeType
 }
 
-- 
cgit v1.2.3-70-g09d2