Media proxy tab

src/components/settings_modal/admin_tabs/media_proxy_tab.js

@@ -0,0 +1,36 @@
+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 AttachmentSetting from '../helpers/attachment_setting.vue'
+
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
+const MediaProxyTab = {
+  provide () {
+    return {
+      defaultDraftMode: true,
+      defaultSource: 'admin'
+    }
+  },
+  components: {
+    BooleanSetting,
+    ChoiceSetting,
+    IntegerSetting,
+    StringSetting,
+    AttachmentSetting,
+    GroupSetting
+  },
+  computed: {
+    mediaProxyEnabled () {
+      return this.$store.state.adminSettings.draft[':pleroma'][':media_proxy'][':enabled']
+    },
+    mediaInvalidationProvider () {
+      return this.$store.state.adminSettings.draft[':pleroma'][':media_proxy'][':invalidation'][':provider']
+    },
+    ...SharedComputedObject()
+  }
+}
+
+export default MediaProxyTab

src/components/settings_modal/admin_tabs/media_proxy_tab.vue

@@ -0,0 +1,115 @@
+<template>
+  <div :label="$t('admin_dash.tabs.media_proxy')">
+    <div class="setting-item">
+      <h3>{{ $t('admin_dash.media_proxy.basic') }}</h3>
+      <ul class="setting-list">
+        <li>
+          <BooleanSetting path=":pleroma.:media_proxy.:enabled" />
+          <ul class="setting-list suboptions">
+            <li>
+              <StringSetting
+                path=":pleroma.:media_proxy.:base_url"
+                />
+            </li>
+          </ul>
+        </li>
+      </ul>
+      <template v-if="mediaProxyEnabled">
+        <h3>{{ $t('admin_dash.media_proxy.invalidation') }}</h3>
+        <ul class="setting-list">
+          <li>
+            <BooleanSetting path=":pleroma.:media_proxy.:invalidation.:enabled" />
+            <ul class="setting-list suboptions">
+              <li>
+                <ChoiceSetting
+                  path=":pleroma.:media_proxy.:invalidation.:provider"
+                  parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                />
+              </li>
+              <h4>{{ $t('admin_dash.media_proxy.invalidation_settings') }}</h4>
+              <ul class="setting-list suboptions">
+                <template v-if="mediaInvalidationProvider === 'Pleroma.Web.MediaProxy.Invalidation.Http'">
+                  <!-- TODO: you know the drill by now - list component -->
+                  <li>
+                    <!-- choice maybe? -->
+                    <StringSetting
+                      :path="[':pleroma', 'Pleroma.Web.MediaProxy.Invalidation.Http', ':method']"
+                      parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                      />
+                  </li>
+                  <!-- TODO: you know the drill by now - list component AGAIN -->
+                </template>
+                <template v-if="mediaInvalidationProvider === 'Pleroma.Web.MediaProxy.Invalidation.Script'">
+                  <!-- TODO: you know the drill by now - list component -->
+                  <li>
+                    <StringSetting
+                      :path="[':pleroma', 'Pleroma.Web.MediaProxy.Invalidation.Script', ':script_path']"
+                      parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                                   />
+                  </li>
+                  <li>
+                    <StringSetting
+                      :path="[':pleroma', 'Pleroma.Web.MediaProxy.Invalidation.Script', ':url_format']"
+                      parent-path=":pleroma.:media_proxy.:invalidation.:enabled"
+                                   />
+                  </li>
+                </template>
+              </ul>
+            </ul>
+          </li>
+        </ul>
+        <h3>{{ $t('admin_dash.media_proxy.limits') }}</h3>
+        <ul class="setting-list">
+          <li>
+            <IntegerSetting
+              path=":pleroma.:media_proxy.:proxy_opts.:max_body_length"
+            />
+          </li>
+          <li>
+            <IntegerSetting
+              path=":pleroma.:media_proxy.:proxy_opts.:max_read_duration"
+            />
+          </li>
+          <li>
+            <BooleanSetting path=":pleroma.:media_proxy.:proxy_opts.:redirect_on_failure" />
+          </li>
+        </ul>
+        <!-- TODO: add whitelist when we have list component (hehe) -->
+        <h3>{{ $t('admin_dash.media_proxy.thumbnails') }}</h3>
+        <ul class="setting-list">
+          <li>
+            <BooleanSetting path=":pleroma.:media_preview_proxy.:enabled" />
+            <ul class="setting-list suboptions">
+              <li>
+                <IntegerSetting
+                  parent-path=":pleroma.:media_preview_proxy.:enabled"
+                  path=":pleroma.:media_preview_proxy.:image_quality"
+                />
+              </li>
+              <li>
+                <IntegerSetting
+                  parent-path=":pleroma.:media_preview_proxy.:enabled"
+                  path=":pleroma.:media_preview_proxy.:min_content_length"
+                />
+              </li>
+              <li>
+                <IntegerSetting
+                  parent-path=":pleroma.:media_preview_proxy.:enabled"
+                  path=":pleroma.:media_preview_proxy.:thumbnail_max_width"
+                />
+              </li>
+              <li>
+                <IntegerSetting
+                  parent-path=":pleroma.:media_preview_proxy.:enabled"
+                  path=":pleroma.:media_preview_proxy.:thumbnail_max_height"
+                />
+              </li>
+            </ul>
+          </li>
+        </ul>
+      </template>
+    </div>
+  </div>
+</template>
+
+<script src="./media_proxy_tab.js"></script>

src/components/settings_modal/settings_modal_admin_content.js

@@ -3,6 +3,7 @@ import VerticalTabSwitcher from './helpers/vertical_tab_switcher.jsx'
 import InstanceTab from './admin_tabs/instance_tab.vue'
 import LimitsTab from './admin_tabs/limits_tab.vue'
 import FrontendsTab from './admin_tabs/frontends_tab.vue'
+import MediaProxyTab from './admin_tabs/media_proxy_tab.vue'
 import EmojiTab from './admin_tabs/emoji_tab.vue'
 import UploadsTab from './admin_tabs/uploads_tab.vue'
 import MailerTab from './admin_tabs/mailer_tab.vue'
@@ -15,6 +16,7 @@ import {
   faWrench,
   faHand,
   faLaptopCode,
+  faTowerBroadcast,
   faEnvelope,
   faChartLine,
   faDoorOpen,
@@ -25,6 +27,7 @@ library.add(
   faWrench,
   faHand,
   faLaptopCode,
+  faTowerBroadcast,
   faEnvelope,
   faChartLine,
   faDoorOpen,
@@ -38,6 +41,7 @@ const SettingsModalAdminContent = {
     InstanceTab,
     LimitsTab,
     FrontendsTab,
+    MediaProxyTab,
     MailerTab,
     EmojiTab,
     UploadsTab,

src/components/settings_modal/settings_modal_admin_content.vue

@@ -98,6 +98,14 @@
       <UploadsTab />
     </div>
 
+    <div
+      :label="$t('admin_dash.tabs.media_proxy')"
+      icon="tower-broadcast"
+      data-tab-name="media_proxy"
+    >
+      <MediaProxyTab />
+    </div>
+
     <div
       :label="$t('admin_dash.tabs.monitoring')"
       icon="chart-line"

src/i18n/en.json

@@ -1153,6 +1153,7 @@
       "limits": "Limits",
       "frontends": "Front-ends",
       "mailer": "EMails",
+      "media_proxy": "Media Proxy",
       "emoji": "Emoji",
       "uploads": "Uploads",
       "monitoring": "Monitoring",
@@ -1196,6 +1197,12 @@
       "filenames": "Filenames, Titles and Descriptions",
       "uploader_settings": "Uploader settings"
     },
+    "media_proxy": {
+      "basic": "Basic Settings",
+      "invalidation": "Cache Invalidation",
+      "limits": "Limits",
+      "thumbnails": "Thumbnail Generation"
+    },
     "mailer": {
       "adapter": "Mailing Adapter",
       "auth": "Authentication"