From 9632b77786a9d3735f04ecf4a814311fad926ad0 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 13 Mar 2023 00:09:47 +0200 Subject: initial implementation of an admin settings module --- src/modules/adminSettings.js | 48 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 48 insertions(+) create mode 100644 src/modules/adminSettings.js (limited to 'src/modules/adminSettings.js') diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js new file mode 100644 index 00000000..01e9a49e --- /dev/null +++ b/src/modules/adminSettings.js @@ -0,0 +1,48 @@ +import { set, cloneDeep } from 'lodash' + +export const defaultState = { + needsReboot: null, + config: null, + modifiedPaths: null +} + +export const newUserFlags = { + ...defaultState.flagStorage +} + +const serverSideStorage = { + state: { + ...cloneDeep(defaultState) + }, + mutations: { + updateAdminSettings (state, { config, modifiedPaths }) { + state.config = config + state.modifiedPaths = modifiedPaths + } + }, + actions: { + setInstanceAdminSettings ({ state, commit, dispatch }, { backendDbConfig }) { + const config = {} + const modifiedPaths = new Set() + backendDbConfig.configs.forEach(c => { + const path = c.group + '.' + c.key + if (c.db) { + c.db.forEach(x => modifiedPaths.add(path + '.' + x)) + } + const convert = (value) => { + if (Array.isArray(value) && value.length > 0 && value[0].tuple) { + return value.reduce((acc, c) => { + return { ...acc, [c.tuple[0]]: convert(c.tuple[1]) } + }, {}) + } else { + return value + } + } + set(config, path, convert(c.value)) + }) + commit('updateAdminSettings', { config, modifiedPaths }) + } + } +} + +export default serverSideStorage -- cgit v1.2.3-70-g09d2 From 4d23d31fecf480abfccc4db3ac79c6640078dc3b Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Tue, 14 Mar 2023 21:50:43 +0200 Subject: initial admin settings prototype (WIP) --- src/components/admin_modal/admin_modal.js | 68 ++++++++++++ src/components/admin_modal/admin_modal.scss | 80 ++++++++++++++ src/components/admin_modal/admin_modal.vue | 121 +++++++++++++++++++++ src/components/admin_modal/admin_modal_content.js | 88 +++++++++++++++ .../admin_modal/admin_modal_content.scss | 56 ++++++++++ src/components/admin_modal/tabs/general_tab.js | 33 ++++++ src/components/desktop_nav/desktop_nav.js | 5 +- src/components/desktop_nav/desktop_nav.vue | 9 +- src/components/notification/notification.vue | 2 +- .../settings_modal/admin_tabs/instance_tab.js | 29 +++++ .../settings_modal/admin_tabs/instance_tab.vue | 35 ++++++ src/components/settings_modal/helpers/setting.js | 14 ++- .../settings_modal/helpers/string_setting.js | 9 ++ .../settings_modal/helpers/string_setting.vue | 25 +++++ src/components/settings_modal/settings_modal.js | 23 +++- src/components/settings_modal/settings_modal.vue | 3 +- .../settings_modal/settings_modal_admin_content.js | 76 +++++++++++++ .../settings_modal_admin_content.scss | 56 ++++++++++ .../settings_modal_admin_content.vue | 21 ++++ .../settings_modal/settings_modal_content.js | 88 --------------- .../settings_modal/settings_modal_content.scss | 56 ---------- .../settings_modal/settings_modal_content.vue | 83 -------------- .../settings_modal/settings_modal_user_content.js | 88 +++++++++++++++ .../settings_modal_user_content.scss | 56 ++++++++++ .../settings_modal/settings_modal_user_content.vue | 83 ++++++++++++++ src/components/tab_switcher/tab_switcher.jsx | 8 +- src/modules/adminSettings.js | 5 +- src/modules/interface.js | 21 +++- 28 files changed, 985 insertions(+), 256 deletions(-) create mode 100644 src/components/admin_modal/admin_modal.js create mode 100644 src/components/admin_modal/admin_modal.scss create mode 100644 src/components/admin_modal/admin_modal.vue create mode 100644 src/components/admin_modal/admin_modal_content.js create mode 100644 src/components/admin_modal/admin_modal_content.scss create mode 100644 src/components/admin_modal/tabs/general_tab.js create mode 100644 src/components/settings_modal/admin_tabs/instance_tab.js create mode 100644 src/components/settings_modal/admin_tabs/instance_tab.vue create mode 100644 src/components/settings_modal/helpers/string_setting.js create mode 100644 src/components/settings_modal/helpers/string_setting.vue create mode 100644 src/components/settings_modal/settings_modal_admin_content.js create mode 100644 src/components/settings_modal/settings_modal_admin_content.scss create mode 100644 src/components/settings_modal/settings_modal_admin_content.vue delete mode 100644 src/components/settings_modal/settings_modal_content.js delete mode 100644 src/components/settings_modal/settings_modal_content.scss delete mode 100644 src/components/settings_modal/settings_modal_content.vue create mode 100644 src/components/settings_modal/settings_modal_user_content.js create mode 100644 src/components/settings_modal/settings_modal_user_content.scss create mode 100644 src/components/settings_modal/settings_modal_user_content.vue (limited to 'src/modules/adminSettings.js') diff --git a/src/components/admin_modal/admin_modal.js b/src/components/admin_modal/admin_modal.js new file mode 100644 index 00000000..525f09aa --- /dev/null +++ b/src/components/admin_modal/admin_modal.js @@ -0,0 +1,68 @@ +import Modal from 'src/components/modal/modal.vue' +import PanelLoading from 'src/components/panel_loading/panel_loading.vue' +import AsyncComponentError from 'src/components/async_component_error/async_component_error.vue' +import getResettableAsyncComponent from 'src/services/resettable_async_component.js' +import Popover from '../popover/popover.vue' +import Checkbox from 'src/components/checkbox/checkbox.vue' +import { library } from '@fortawesome/fontawesome-svg-core' +import { + newImporter, + newExporter +} from 'src/services/export_import/export_import.js' +import { + faTimes, + faFileUpload, + faFileDownload, + faChevronDown +} from '@fortawesome/free-solid-svg-icons' +import { + faWindowMinimize +} from '@fortawesome/free-regular-svg-icons' + +library.add( + faTimes, + faWindowMinimize, + faFileUpload, + faFileDownload, + faChevronDown +) + +const AdminModal = { + data () { + return {} + }, + components: { + Modal, + Popover, + Checkbox, + AdminModalContent: getResettableAsyncComponent( + () => import('./admin_modal_content.vue'), + { + loadingComponent: PanelLoading, + errorComponent: AsyncComponentError, + delay: 0 + } + ) + }, + methods: { + closeModal () { + this.$store.dispatch('closeAdminModal') + }, + peekModal () { + this.$store.dispatch('togglePeekAdminModal') + } + }, + computed: { + modalActivated () { + return this.$store.state.interface.adminModalState !== 'hidden' + }, + modalOpenedOnce () { + return this.$store.state.interface.adminModalLoaded + }, + modalPeeked () { + return this.$store.state.interface.adminModalState === 'minimized' + } + } +} + +export default AdminModal diff --git a/src/components/admin_modal/admin_modal.scss b/src/components/admin_modal/admin_modal.scss new file mode 100644 index 00000000..0d916f32 --- /dev/null +++ b/src/components/admin_modal/admin_modal.scss @@ -0,0 +1,80 @@ +@import "src/variables"; + +.admin-modal { + overflow: hidden; + + .setting-list, + .option-list { + list-style-type: none; + padding-left: 2em; + + li { + margin-bottom: 0.5em; + } + + .suboptions { + margin-top: 0.3em; + } + } + + .admin-modal-panel { + overflow: hidden; + transition: transform; + transition-timing-function: ease-in-out; + transition-duration: 300ms; + width: 1000px; + max-width: 90vw; + height: 90vh; + + @media all and (max-width: 800px) { + max-width: 100vw; + height: 100%; + } + + >.panel-body { + height: 100%; + overflow-y: hidden; + + .btn { + min-height: 2em; + min-width: 10em; + padding: 0 2em; + } + } + } + + .admin-footer { + display: flex; + + >* { + margin-right: 0.5em; + } + + .extra-content { + display: flex; + flex-grow: 1; + } + } + + &.peek { + .admin-modal-panel { + /* Explanation: + * Modal is positioned vertically centered. + * 100vh - 100% = Distance between modal's top+bottom boundaries and screen + * (100vh - 100%) / 2 = Distance between bottom (or top) boundary and screen + * + 100% - we move modal completely off-screen, it's top boundary touches + * bottom of the screen + * - 50px - leaving tiny amount of space so that titlebar + tiny amount of modal is visible + */ + transform: translateY(calc(((100vh - 100%) / 2 + 100%) - 50px)); + + @media all and (max-width: 800px) { + /* For mobile, the modal takes 100% of the available screen. + This ensures the minimized modal is always 50px above the browser bottom + bar regardless of whether or not it is visible. + */ + transform: translateY(calc(100% - 50px)); + } + } + } +} diff --git a/src/components/admin_modal/admin_modal.vue b/src/components/admin_modal/admin_modal.vue new file mode 100644 index 00000000..d7e5a80f --- /dev/null +++ b/src/components/admin_modal/admin_modal.vue @@ -0,0 +1,121 @@ + + + + + diff --git a/src/components/admin_modal/admin_modal_content.js b/src/components/admin_modal/admin_modal_content.js new file mode 100644 index 00000000..897cc163 --- /dev/null +++ b/src/components/admin_modal/admin_modal_content.js @@ -0,0 +1,88 @@ +import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx' + +import DataImportExportTab from './tabs/data_import_export_tab.vue' +import MutesAndBlocksTab from './tabs/mutes_and_blocks_tab.vue' +import NotificationsTab from './tabs/notifications_tab.vue' +import FilteringTab from './tabs/filtering_tab.vue' +import SecurityTab from './tabs/security_tab/security_tab.vue' +import ProfileTab from './tabs/profile_tab.vue' +import GeneralTab from './tabs/general_tab.vue' +import VersionTab from './tabs/version_tab.vue' +import ThemeTab from './tabs/theme_tab/theme_tab.vue' + +import { library } from '@fortawesome/fontawesome-svg-core' +import { + faWrench, + faUser, + faFilter, + faPaintBrush, + faBell, + faDownload, + faEyeSlash, + faInfo +} from '@fortawesome/free-solid-svg-icons' + +library.add( + faWrench, + faUser, + faFilter, + faPaintBrush, + faBell, + faDownload, + faEyeSlash, + faInfo +) + +const AdminModalContent = { + components: { + TabSwitcher, + + DataImportExportTab, + MutesAndBlocksTab, + NotificationsTab, + FilteringTab, + SecurityTab, + ProfileTab, + GeneralTab, + VersionTab, + ThemeTab + }, + computed: { + isLoggedIn () { + return !!this.$store.state.users.currentUser + }, + open () { + return this.$store.state.interface.AdminModalState !== 'hidden' + }, + bodyLock () { + return this.$store.state.interface.AdminModalState === 'visible' + } + }, + methods: { + onOpen () { + const targetTab = this.$store.state.interface.AdminModalTargetTab + // We're being told to open in specific tab + if (targetTab) { + const tabIndex = this.$refs.tabSwitcher.$slots.default().findIndex(elm => { + return elm.props && elm.props['data-tab-name'] === targetTab + }) + if (tabIndex >= 0) { + this.$refs.tabSwitcher.setTab(tabIndex) + } + } + // Clear the state of target tab, so that next time Admin is opened + // it doesn't force it. + this.$store.dispatch('clearAdminModalTargetTab') + } + }, + mounted () { + this.onOpen() + }, + watch: { + open: function (value) { + if (value) this.onOpen() + } + } +} + +export default AdminModalContent diff --git a/src/components/admin_modal/admin_modal_content.scss b/src/components/admin_modal/admin_modal_content.scss new file mode 100644 index 00000000..2db7b2f8 --- /dev/null +++ b/src/components/admin_modal/admin_modal_content.scss @@ -0,0 +1,56 @@ +@import "src/variables"; + +.admin_tab-switcher { + height: 100%; + + .setting-item { + border-bottom: 2px solid var(--fg, $fallback--fg); + margin: 1em 1em 1.4em; + padding-bottom: 1.4em; + + > div, + > label { + display: block; + margin-bottom: 0.5em; + + &:last-child { + margin-bottom: 0; + } + } + + .select-multiple { + display: flex; + + .option-list { + margin: 0; + padding-left: 0.5em; + } + } + + &:last-child { + border-bottom: none; + padding-bottom: 0; + margin-bottom: 1em; + } + + select { + min-width: 10em; + } + + textarea { + width: 100%; + max-width: 100%; + height: 100px; + } + + .unavailable, + .unavailable svg { + color: var(--cRed, $fallback--cRed); + color: $fallback--cRed; + } + + .number-input { + max-width: 6em; + } + } +} diff --git a/src/components/admin_modal/tabs/general_tab.js b/src/components/admin_modal/tabs/general_tab.js new file mode 100644 index 00000000..8c166f19 --- /dev/null +++ b/src/components/admin_modal/tabs/general_tab.js @@ -0,0 +1,33 @@ +import BooleanSetting from '../settings_modal/helpers/boolean_setting.vue' +import ChoiceSetting from '../settings_modal/helpers/choice_setting.vue' +import IntegerSetting from '../settings_modal/helpers/integer_setting.vue' + +import { library } from '@fortawesome/fontawesome-svg-core' +import { + faGlobe +} from '@fortawesome/free-solid-svg-icons' + +library.add( + faGlobe +) + +const GeneralTab = { + components: { + BooleanSetting, + ChoiceSetting, + IntegerSetting, + }, + computed: { + mergedConfig () { + console.log(this.$store.state) + return this.$store.state + } + }, + methods: { + changeDefaultScope (value) { + this.$store.dispatch('setProfileOption', { name: 'defaultScope', value }) + } + } +} + +export default GeneralTab diff --git a/src/components/desktop_nav/desktop_nav.js b/src/components/desktop_nav/desktop_nav.js index 745b1a81..f6a2e294 100644 --- a/src/components/desktop_nav/desktop_nav.js +++ b/src/components/desktop_nav/desktop_nav.js @@ -107,7 +107,10 @@ export default { this.searchBarHidden = hidden }, openSettingsModal () { - this.$store.dispatch('openSettingsModal') + this.$store.dispatch('openSettingsModal', 'user') + }, + openAdminModal () { + this.$store.dispatch('openSettingsModal', 'admin') } } } diff --git a/src/components/desktop_nav/desktop_nav.vue b/src/components/desktop_nav/desktop_nav.vue index dc8bbfd3..49382f8e 100644 --- a/src/components/desktop_nav/desktop_nav.vue +++ b/src/components/desktop_nav/desktop_nav.vue @@ -48,20 +48,19 @@ icon="cog" /> - - +
- + +
{ + return elm.props && elm.props['data-tab-name'] === targetTab + }) + if (tabIndex >= 0) { + this.$refs.tabSwitcher.setTab(tabIndex) + } + } + // Clear the state of target tab, so that next time settings is opened + // it doesn't force it. + this.$store.dispatch('clearSettingsModalTargetTab') + } + }, + mounted () { + this.onOpen() + }, + watch: { + open: function (value) { + if (value) this.onOpen() + } + } +} + +export default SettingsModalAdminContent diff --git a/src/components/settings_modal/settings_modal_admin_content.scss b/src/components/settings_modal/settings_modal_admin_content.scss new file mode 100644 index 00000000..87df7982 --- /dev/null +++ b/src/components/settings_modal/settings_modal_admin_content.scss @@ -0,0 +1,56 @@ +@import "src/variables"; + +.settings_tab-switcher { + height: 100%; + + .setting-item { + border-bottom: 2px solid var(--fg, $fallback--fg); + margin: 1em 1em 1.4em; + padding-bottom: 1.4em; + + > div, + > label { + display: block; + margin-bottom: 0.5em; + + &:last-child { + margin-bottom: 0; + } + } + + .select-multiple { + display: flex; + + .option-list { + margin: 0; + padding-left: 0.5em; + } + } + + &:last-child { + border-bottom: none; + padding-bottom: 0; + margin-bottom: 1em; + } + + select { + min-width: 10em; + } + + textarea { + width: 100%; + max-width: 100%; + height: 100px; + } + + .unavailable, + .unavailable svg { + color: var(--cRed, $fallback--cRed); + color: $fallback--cRed; + } + + .number-input { + max-width: 6em; + } + } +} diff --git a/src/components/settings_modal/settings_modal_admin_content.vue b/src/components/settings_modal/settings_modal_admin_content.vue new file mode 100644 index 00000000..9873b127 --- /dev/null +++ b/src/components/settings_modal/settings_modal_admin_content.vue @@ -0,0 +1,21 @@ + + + + + diff --git a/src/components/settings_modal/settings_modal_content.js b/src/components/settings_modal/settings_modal_content.js deleted file mode 100644 index 9ac0301f..00000000 --- a/src/components/settings_modal/settings_modal_content.js +++ /dev/null @@ -1,88 +0,0 @@ -import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx' - -import DataImportExportTab from './tabs/data_import_export_tab.vue' -import MutesAndBlocksTab from './tabs/mutes_and_blocks_tab.vue' -import NotificationsTab from './tabs/notifications_tab.vue' -import FilteringTab from './tabs/filtering_tab.vue' -import SecurityTab from './tabs/security_tab/security_tab.vue' -import ProfileTab from './tabs/profile_tab.vue' -import GeneralTab from './tabs/general_tab.vue' -import VersionTab from './tabs/version_tab.vue' -import ThemeTab from './tabs/theme_tab/theme_tab.vue' - -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faWrench, - faUser, - faFilter, - faPaintBrush, - faBell, - faDownload, - faEyeSlash, - faInfo -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faWrench, - faUser, - faFilter, - faPaintBrush, - faBell, - faDownload, - faEyeSlash, - faInfo -) - -const SettingsModalContent = { - components: { - TabSwitcher, - - DataImportExportTab, - MutesAndBlocksTab, - NotificationsTab, - FilteringTab, - SecurityTab, - ProfileTab, - GeneralTab, - VersionTab, - ThemeTab - }, - computed: { - isLoggedIn () { - return !!this.$store.state.users.currentUser - }, - open () { - return this.$store.state.interface.settingsModalState !== 'hidden' - }, - bodyLock () { - return this.$store.state.interface.settingsModalState === 'visible' - } - }, - methods: { - onOpen () { - const targetTab = this.$store.state.interface.settingsModalTargetTab - // We're being told to open in specific tab - if (targetTab) { - const tabIndex = this.$refs.tabSwitcher.$slots.default().findIndex(elm => { - return elm.props && elm.props['data-tab-name'] === targetTab - }) - if (tabIndex >= 0) { - this.$refs.tabSwitcher.setTab(tabIndex) - } - } - // Clear the state of target tab, so that next time settings is opened - // it doesn't force it. - this.$store.dispatch('clearSettingsModalTargetTab') - } - }, - mounted () { - this.onOpen() - }, - watch: { - open: function (value) { - if (value) this.onOpen() - } - } -} - -export default SettingsModalContent diff --git a/src/components/settings_modal/settings_modal_content.scss b/src/components/settings_modal/settings_modal_content.scss deleted file mode 100644 index 87df7982..00000000 --- a/src/components/settings_modal/settings_modal_content.scss +++ /dev/null @@ -1,56 +0,0 @@ -@import "src/variables"; - -.settings_tab-switcher { - height: 100%; - - .setting-item { - border-bottom: 2px solid var(--fg, $fallback--fg); - margin: 1em 1em 1.4em; - padding-bottom: 1.4em; - - > div, - > label { - display: block; - margin-bottom: 0.5em; - - &:last-child { - margin-bottom: 0; - } - } - - .select-multiple { - display: flex; - - .option-list { - margin: 0; - padding-left: 0.5em; - } - } - - &:last-child { - border-bottom: none; - padding-bottom: 0; - margin-bottom: 1em; - } - - select { - min-width: 10em; - } - - textarea { - width: 100%; - max-width: 100%; - height: 100px; - } - - .unavailable, - .unavailable svg { - color: var(--cRed, $fallback--cRed); - color: $fallback--cRed; - } - - .number-input { - max-width: 6em; - } - } -} diff --git a/src/components/settings_modal/settings_modal_content.vue b/src/components/settings_modal/settings_modal_content.vue deleted file mode 100644 index 0be76d22..00000000 --- a/src/components/settings_modal/settings_modal_content.vue +++ /dev/null @@ -1,83 +0,0 @@ - - - - - diff --git a/src/components/settings_modal/settings_modal_user_content.js b/src/components/settings_modal/settings_modal_user_content.js new file mode 100644 index 00000000..9ac0301f --- /dev/null +++ b/src/components/settings_modal/settings_modal_user_content.js @@ -0,0 +1,88 @@ +import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx' + +import DataImportExportTab from './tabs/data_import_export_tab.vue' +import MutesAndBlocksTab from './tabs/mutes_and_blocks_tab.vue' +import NotificationsTab from './tabs/notifications_tab.vue' +import FilteringTab from './tabs/filtering_tab.vue' +import SecurityTab from './tabs/security_tab/security_tab.vue' +import ProfileTab from './tabs/profile_tab.vue' +import GeneralTab from './tabs/general_tab.vue' +import VersionTab from './tabs/version_tab.vue' +import ThemeTab from './tabs/theme_tab/theme_tab.vue' + +import { library } from '@fortawesome/fontawesome-svg-core' +import { + faWrench, + faUser, + faFilter, + faPaintBrush, + faBell, + faDownload, + faEyeSlash, + faInfo +} from '@fortawesome/free-solid-svg-icons' + +library.add( + faWrench, + faUser, + faFilter, + faPaintBrush, + faBell, + faDownload, + faEyeSlash, + faInfo +) + +const SettingsModalContent = { + components: { + TabSwitcher, + + DataImportExportTab, + MutesAndBlocksTab, + NotificationsTab, + FilteringTab, + SecurityTab, + ProfileTab, + GeneralTab, + VersionTab, + ThemeTab + }, + computed: { + isLoggedIn () { + return !!this.$store.state.users.currentUser + }, + open () { + return this.$store.state.interface.settingsModalState !== 'hidden' + }, + bodyLock () { + return this.$store.state.interface.settingsModalState === 'visible' + } + }, + methods: { + onOpen () { + const targetTab = this.$store.state.interface.settingsModalTargetTab + // We're being told to open in specific tab + if (targetTab) { + const tabIndex = this.$refs.tabSwitcher.$slots.default().findIndex(elm => { + return elm.props && elm.props['data-tab-name'] === targetTab + }) + if (tabIndex >= 0) { + this.$refs.tabSwitcher.setTab(tabIndex) + } + } + // Clear the state of target tab, so that next time settings is opened + // it doesn't force it. + this.$store.dispatch('clearSettingsModalTargetTab') + } + }, + mounted () { + this.onOpen() + }, + watch: { + open: function (value) { + if (value) this.onOpen() + } + } +} + +export default SettingsModalContent diff --git a/src/components/settings_modal/settings_modal_user_content.scss b/src/components/settings_modal/settings_modal_user_content.scss new file mode 100644 index 00000000..87df7982 --- /dev/null +++ b/src/components/settings_modal/settings_modal_user_content.scss @@ -0,0 +1,56 @@ +@import "src/variables"; + +.settings_tab-switcher { + height: 100%; + + .setting-item { + border-bottom: 2px solid var(--fg, $fallback--fg); + margin: 1em 1em 1.4em; + padding-bottom: 1.4em; + + > div, + > label { + display: block; + margin-bottom: 0.5em; + + &:last-child { + margin-bottom: 0; + } + } + + .select-multiple { + display: flex; + + .option-list { + margin: 0; + padding-left: 0.5em; + } + } + + &:last-child { + border-bottom: none; + padding-bottom: 0; + margin-bottom: 1em; + } + + select { + min-width: 10em; + } + + textarea { + width: 100%; + max-width: 100%; + height: 100px; + } + + .unavailable, + .unavailable svg { + color: var(--cRed, $fallback--cRed); + color: $fallback--cRed; + } + + .number-input { + max-width: 6em; + } + } +} diff --git a/src/components/settings_modal/settings_modal_user_content.vue b/src/components/settings_modal/settings_modal_user_content.vue new file mode 100644 index 00000000..0221cccb --- /dev/null +++ b/src/components/settings_modal/settings_modal_user_content.vue @@ -0,0 +1,83 @@ + + + + + diff --git a/src/components/tab_switcher/tab_switcher.jsx b/src/components/tab_switcher/tab_switcher.jsx index a7ef8560..b444da43 100644 --- a/src/components/tab_switcher/tab_switcher.jsx +++ b/src/components/tab_switcher/tab_switcher.jsx @@ -60,13 +60,7 @@ export default { const isWanted = slot => slot.props && slot.props['data-tab-name'] === tabName return this.$slots.default().findIndex(isWanted) === this.activeIndex } - }, - settingsModalVisible () { - return this.settingsModalState === 'visible' - }, - ...mapState({ - settingsModalState: state => state.interface.settingsModalState - }) + } }, beforeUpdate () { const currentSlot = this.slots()[this.active] diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js index 01e9a49e..8006717d 100644 --- a/src/modules/adminSettings.js +++ b/src/modules/adminSettings.js @@ -10,7 +10,7 @@ export const newUserFlags = { ...defaultState.flagStorage } -const serverSideStorage = { +const adminSettingsStorage = { state: { ...cloneDeep(defaultState) }, @@ -40,9 +40,10 @@ const serverSideStorage = { } set(config, path, convert(c.value)) }) + console.log(config) commit('updateAdminSettings', { config, modifiedPaths }) } } } -export default serverSideStorage +export default adminSettingsStorage diff --git a/src/modules/interface.js b/src/modules/interface.js index a86193ea..2d012f1b 100644 --- a/src/modules/interface.js +++ b/src/modules/interface.js @@ -1,7 +1,9 @@ const defaultState = { settingsModalState: 'hidden', - settingsModalLoaded: false, + settingsModalLoadedUser: false, + settingsModalLoadedAdmin: false, settingsModalTargetTab: null, + settingsModalMode: 'user', settings: { currentSaveStateNotice: null, noticeClearTimeout: null, @@ -54,10 +56,17 @@ const interfaceMod = { throw new Error('Illegal minimization state of settings modal') } }, - openSettingsModal (state) { + openSettingsModal (state, value) { + state.settingsModalMode = value state.settingsModalState = 'visible' - if (!state.settingsModalLoaded) { - state.settingsModalLoaded = true + if (value === 'user') { + if (!state.settingsModalLoadedUser) { + state.settingsModalLoadedUser = true + } + } else if (value === 'admin') { + if (!state.settingsModalLoadedAdmin) { + state.settingsModalLoadedAdmin = true + } } }, setSettingsModalTargetTab (state, value) { @@ -92,8 +101,8 @@ const interfaceMod = { closeSettingsModal ({ commit }) { commit('closeSettingsModal') }, - openSettingsModal ({ commit }) { - commit('openSettingsModal') + openSettingsModal ({ commit }, value = 'user') { + commit('openSettingsModal', value) }, togglePeekSettingsModal ({ commit }) { commit('togglePeekSettingsModal') -- cgit v1.2.3-70-g09d2 From bfd802ad046886230574cf2262f9c2e5f1b03a3f Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 16 Mar 2023 23:18:55 +0200 Subject: setting admin settings works now. also now we have draftable settings --- .../settings_modal/admin_tabs/instance_tab.vue | 23 ++++- .../settings_modal/helpers/boolean_setting.js | 15 +-- .../settings_modal/helpers/boolean_setting.vue | 3 +- .../settings_modal/helpers/choice_setting.js | 9 +- .../settings_modal/helpers/draft_buttons.vue | 102 +++++++++++++++++++++ .../settings_modal/helpers/integer_setting.js | 8 +- .../settings_modal/helpers/integer_setting.vue | 4 +- src/components/settings_modal/helpers/setting.js | 70 ++++++++++++-- .../settings_modal/helpers/size_setting.js | 5 +- .../settings_modal/helpers/string_setting.js | 4 - .../settings_modal/helpers/string_setting.vue | 6 +- src/modules/adminSettings.js | 52 ++++++++++- src/modules/users.js | 2 +- src/services/api/api.service.js | 26 +++++- 14 files changed, 284 insertions(+), 45 deletions(-) create mode 100644 src/components/settings_modal/helpers/draft_buttons.vue (limited to 'src/modules/adminSettings.js') diff --git a/src/components/settings_modal/admin_tabs/instance_tab.vue b/src/components/settings_modal/admin_tabs/instance_tab.vue index 65b3d12f..18ba6127 100644 --- a/src/components/settings_modal/admin_tabs/instance_tab.vue +++ b/src/components/settings_modal/admin_tabs/instance_tab.vue @@ -1,18 +1,35 @@ diff --git a/src/components/settings_modal/helpers/choice_setting.js b/src/components/settings_modal/helpers/choice_setting.js index 8aa5f54b..a3c3bf44 100644 --- a/src/components/settings_modal/helpers/choice_setting.js +++ b/src/components/settings_modal/helpers/choice_setting.js @@ -1,15 +1,12 @@ import Select from 'src/components/select/select.vue' -import ModifiedIndicator from './modified_indicator.vue' -import ProfileSettingIndicator from './profile_setting_indicator.vue' import Setting from './setting.js' export default { + ...Setting, components: { - Select, - ModifiedIndicator, - ProfileSettingIndicator + ...Setting.components, + Select }, - ...Setting, props: { ...Setting.props, options: { diff --git a/src/components/settings_modal/helpers/draft_buttons.vue b/src/components/settings_modal/helpers/draft_buttons.vue new file mode 100644 index 00000000..0d99da13 --- /dev/null +++ b/src/components/settings_modal/helpers/draft_buttons.vue @@ -0,0 +1,102 @@ + + + + + + + diff --git a/src/components/settings_modal/helpers/integer_setting.js b/src/components/settings_modal/helpers/integer_setting.js index 0f29f11a..8ad033e7 100644 --- a/src/components/settings_modal/helpers/integer_setting.js +++ b/src/components/settings_modal/helpers/integer_setting.js @@ -1,15 +1,11 @@ -import ModifiedIndicator from './modified_indicator.vue' import Setting from './setting.js' export default { - components: { - ModifiedIndicator - }, ...Setting, methods: { ...Setting.methods, - update (e) { - this.configSink(this.path, parseInt(e.target.value)) + getValue (e) { + return parseInt(e.target.value) } } } diff --git a/src/components/settings_modal/helpers/integer_setting.vue b/src/components/settings_modal/helpers/integer_setting.vue index 695e2673..e900b87c 100644 --- a/src/components/settings_modal/helpers/integer_setting.vue +++ b/src/components/settings_modal/helpers/integer_setting.vue @@ -13,7 +13,7 @@ step="1" :disabled="disabled" :min="min || 0" - :value="state" + :value="draftMode ? draft :state" @change="update" > {{ ' ' }} @@ -21,6 +21,8 @@ :changed="isChanged" :onclick="reset" /> + + diff --git a/src/components/settings_modal/helpers/setting.js b/src/components/settings_modal/helpers/setting.js index 9195d3e9..0971b919 100644 --- a/src/components/settings_modal/helpers/setting.js +++ b/src/components/settings_modal/helpers/setting.js @@ -1,5 +1,16 @@ +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' import { get, set } from 'lodash' + export default { + components: { + Checkbox, + ModifiedIndicator, + DraftButtons, + ProfileSettingIndicator + }, props: { path: { type: String, @@ -23,6 +34,20 @@ export default { source: { type: String, default: 'default' + }, + draftMode: { + type: Boolean, + default: false + } + }, + data () { + return { + draft: null + } + }, + created () { + if (this.draftMode) { + this.draft = this.state } }, computed: { @@ -53,7 +78,7 @@ export default { case 'profile': return (k, v) => this.$store.dispatch('setProfileOption', { name: k, value: v }) case 'admin': - return (k, v) => console.log(this.path, k, v) + return (k, v) => this.$store.dispatch('pushAdminSetting', { path: k, value: v }) default: return (k, v) => this.$store.dispatch('setOption', { name: k, value: v }) } @@ -72,25 +97,56 @@ export default { isChanged () { switch (this.source) { case 'profile': - return false case 'admin': - console.log(this.$store.state.adminSettings.modifiedPaths) - return this.$store.state.adminSettings.modifiedPaths.has(this.path) + return false default: return this.state !== this.defaultState } }, + isDirty () { + return this.draftMode && this.draft !== this.state + }, + canHardReset () { + return this.source === 'admin' && this.$store.state.adminSettings.modifiedPaths.has(this.path) + }, matchesExpertLevel () { return (this.expert || 0) <= this.$store.state.config.expertLevel > 0 } }, methods: { + getValue (e) { + return e.target.value + }, update (e) { - console.log('U', this.path, e) - this.configSink(this.path, e) + if (this.draftMode) { + this.draft = this.getValue(e) + } else { + this.configSink(this.path, this.getValue(e)) + } + }, + commitDraft () { + if (this.draftMode) { + this.configSink(this.path, this.draft) + } }, reset () { - set(this.$store.getters.mergedConfig, this.path, this.defaultState) + console.log('reset') + if (this.draftMode) { + console.log(this.draft) + console.log(this.state) + this.draft = this.state + } else { + set(this.$store.getters.mergedConfig, this.path, this.defaultState) + } + }, + hardReset () { + switch (this.source) { + case 'admin': + return this.$store.dispatch('resetAdminSetting', { path: this.path }) + .then(() => { this.draft = this.state }) + default: + console.warn('Hard reset not implemented yet!') + } } } } diff --git a/src/components/settings_modal/helpers/size_setting.js b/src/components/settings_modal/helpers/size_setting.js index 4a0f7e48..12cef705 100644 --- a/src/components/settings_modal/helpers/size_setting.js +++ b/src/components/settings_modal/helpers/size_setting.js @@ -1,4 +1,3 @@ -import ModifiedIndicator from './modified_indicator.vue' import Select from 'src/components/select/select.vue' import Setting from './setting.js' @@ -7,11 +6,11 @@ export const defaultHorizontalUnits = ['px', 'rem', 'vw'] export const defaultVerticalUnits = ['px', 'rem', 'vh'] export default { + ...Setting, components: { - ModifiedIndicator, + ...Setting.components, Select }, - ...Setting, props: { ...Setting.props, min: Number, diff --git a/src/components/settings_modal/helpers/string_setting.js b/src/components/settings_modal/helpers/string_setting.js index 64f8772d..b368cfc8 100644 --- a/src/components/settings_modal/helpers/string_setting.js +++ b/src/components/settings_modal/helpers/string_setting.js @@ -1,9 +1,5 @@ -import ModifiedIndicator from './modified_indicator.vue' import Setting from './setting.js' export default { - components: { - ModifiedIndicator - }, ...Setting } diff --git a/src/components/settings_modal/helpers/string_setting.vue b/src/components/settings_modal/helpers/string_setting.vue index e4bd2de9..0a71aeab 100644 --- a/src/components/settings_modal/helpers/string_setting.vue +++ b/src/components/settings_modal/helpers/string_setting.vue @@ -11,7 +11,7 @@ class="string-input" step="1" :disabled="disabled" - :value="state" + :value="draftMode ? draft :state" @change="update" > {{ ' ' }} @@ -19,7 +19,9 @@ :changed="isChanged" :onclick="reset" /> + + - + diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js index 8006717d..d1df67d4 100644 --- a/src/modules/adminSettings.js +++ b/src/modules/adminSettings.js @@ -22,8 +22,8 @@ const adminSettingsStorage = { }, actions: { setInstanceAdminSettings ({ state, commit, dispatch }, { backendDbConfig }) { - const config = {} - const modifiedPaths = new Set() + const config = state.config || {} + const modifiedPaths = state.modifiedPaths || new Set() backendDbConfig.configs.forEach(c => { const path = c.group + '.' + c.key if (c.db) { @@ -40,8 +40,54 @@ const adminSettingsStorage = { } set(config, path, convert(c.value)) }) - console.log(config) commit('updateAdminSettings', { config, modifiedPaths }) + }, + pushAdminSetting ({ rootState, state, commit, dispatch }, { path, value }) { + const [group, key, ...rest] = path.split(/\./g) + const clone = {} // not actually cloning the entire thing to avoid excessive writes + set(clone, rest.join('.'), value) + + // TODO cleanup paths in modifiedPaths + const convert = (value) => { + if (typeof value !== 'object') { + return value + } else if (Array.isArray(value)) { + return value.map(convert) + } else { + return Object.entries(value).map(([k, v]) => ({ tuple: [k, v] })) + } + } + + rootState.api.backendInteractor.pushInstanceDBConfig({ + payload: { + configs: [{ + group, + key, + value: convert(clone) + }] + } + }) + .then(() => rootState.api.backendInteractor.fetchInstanceDBConfig()) + .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig })) + }, + resetAdminSetting ({ rootState, state, commit, dispatch }, { path }) { + console.log('ASS') + const [group, key, subkey] = path.split(/\./g) + + state.modifiedPaths.delete(path) + + return rootState.api.backendInteractor.pushInstanceDBConfig({ + payload: { + configs: [{ + group, + key, + delete: true, + subkeys: [subkey] + }] + } + }) + .then(() => rootState.api.backendInteractor.fetchInstanceDBConfig()) + .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig })) } } } diff --git a/src/modules/users.js b/src/modules/users.js index 74dbdffc..12e582f4 100644 --- a/src/modules/users.js +++ b/src/modules/users.js @@ -564,7 +564,7 @@ const users = { user.domainMutes = [] commit('setCurrentUser', user) commit('setServerSideStorage', user) - if (user.rights.moderator || user.rights.admin) { + if (user.rights.admin) { store.rootState.api.backendInteractor.fetchInstanceDBConfig() .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig })) } diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js index f0aa898a..71ba1dec 100644 --- a/src/services/api/api.service.js +++ b/src/services/api/api.service.js @@ -108,7 +108,7 @@ const PLEROMA_POST_ANNOUNCEMENT_URL = '/api/v1/pleroma/admin/announcements' const PLEROMA_EDIT_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}` const PLEROMA_DELETE_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}` -const PLEROMA_ADMIN_CONFIG_URL = '/api/v1/pleroma/admin/config' +const PLEROMA_ADMIN_CONFIG_URL = '/api/pleroma/admin/config' const oldfetch = window.fetch @@ -1677,6 +1677,27 @@ const fetchInstanceDBConfig = ({ credentials }) => { }) } +const pushInstanceDBConfig = ({ credentials, payload }) => { + return fetch(PLEROMA_ADMIN_CONFIG_URL, { + headers: { + Accept: 'application/json', + 'Content-Type': 'application/json', + ...authHeaders(credentials) + }, + method: 'POST', + body: JSON.stringify(payload) + }) + .then((response) => { + if (response.ok) { + return response.json() + } else { + return { + error: response + } + } + }) +} + const apiService = { verifyCredentials, fetchTimeline, @@ -1791,7 +1812,8 @@ const apiService = { editAnnouncement, deleteAnnouncement, adminFetchAnnouncements, - fetchInstanceDBConfig + fetchInstanceDBConfig, + pushInstanceDBConfig } export default apiService -- cgit v1.2.3-70-g09d2 From 332ad77e3579d2b512ba236b3f2c94ad8875864d Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Sun, 19 Mar 2023 21:27:07 +0200 Subject: limits tab, backend descriptions --- .../settings_modal/admin_tabs/instance_tab.vue | 103 +++++++++++--- .../settings_modal/admin_tabs/limits_tab.js | 29 ++++ .../settings_modal/admin_tabs/limits_tab.vue | 152 +++++++++++++++++++++ .../settings_modal/helpers/boolean_setting.vue | 13 +- .../settings_modal/helpers/integer_setting.vue | 13 +- src/components/settings_modal/helpers/setting.js | 10 ++ .../settings_modal/helpers/string_setting.vue | 13 +- src/components/settings_modal/settings_modal.scss | 6 + .../settings_modal/settings_modal_admin_content.js | 4 +- .../settings_modal_admin_content.vue | 9 +- src/modules/adminSettings.js | 24 +++- src/modules/users.js | 2 + src/services/api/api.service.js | 17 +++ 13 files changed, 370 insertions(+), 25 deletions(-) create mode 100644 src/components/settings_modal/admin_tabs/limits_tab.js create mode 100644 src/components/settings_modal/admin_tabs/limits_tab.vue (limited to 'src/modules/adminSettings.js') diff --git a/src/components/settings_modal/admin_tabs/instance_tab.vue b/src/components/settings_modal/admin_tabs/instance_tab.vue index 18ba6127..ad271293 100644 --- a/src/components/settings_modal/admin_tabs/instance_tab.vue +++ b/src/components/settings_modal/admin_tabs/instance_tab.vue @@ -12,6 +12,15 @@ NAME +
  • + + ADMIN EMAIL + +
  • - - POST LIMIT - + SHORT DESCRIPTION + +
    • +
  • + + INSTANCE THUMBNAIL + +
    • +
  • + + BACKGROUND IMAGE + +
    • +
  • + + PUBLIC + +
    • + +
    +
    +

    {{ $t('admin_dash.registrations') }}

    +
      +
    • + + REGISTRATIONS OPEN + +
        +
      • + + INVITES ENABLED + +
        • +
      +
      • +
    • + + ACTIVATION REQUIRED + +
      • +
    • + + APPROVAL REQUIRED +
    @@ -36,17 +117,3 @@ - - diff --git a/src/components/settings_modal/admin_tabs/limits_tab.js b/src/components/settings_modal/admin_tabs/limits_tab.js new file mode 100644 index 00000000..684739c3 --- /dev/null +++ b/src/components/settings_modal/admin_tabs/limits_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 LimitsTab = { + data () {}, + components: { + BooleanSetting, + ChoiceSetting, + IntegerSetting, + StringSetting + }, + computed: { + ...SharedComputedObject() + } +} + +export default LimitsTab diff --git a/src/components/settings_modal/admin_tabs/limits_tab.vue b/src/components/settings_modal/admin_tabs/limits_tab.vue new file mode 100644 index 00000000..3f07c554 --- /dev/null +++ b/src/components/settings_modal/admin_tabs/limits_tab.vue @@ -0,0 +1,152 @@ + + + diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue index 7e05fe85..aedbf23e 100644 --- a/src/components/settings_modal/helpers/boolean_setting.vue +++ b/src/components/settings_modal/helpers/boolean_setting.vue @@ -12,7 +12,12 @@ v-if="!!$slots.default" class="label" > - + +     {{ ' ' }} +

    + {{ backendDescriptionDescription + ' ' }} +

    diff --git a/src/components/settings_modal/helpers/integer_setting.vue b/src/components/settings_modal/helpers/integer_setting.vue index e900b87c..e935dfb0 100644 --- a/src/components/settings_modal/helpers/integer_setting.vue +++ b/src/components/settings_modal/helpers/integer_setting.vue @@ -4,7 +4,12 @@ class="IntegerSetting" > +

    + {{ backendDescriptionDescription + ' ' }} +

    diff --git a/src/components/settings_modal/helpers/setting.js b/src/components/settings_modal/helpers/setting.js index 0971b919..f270216f 100644 --- a/src/components/settings_modal/helpers/setting.js +++ b/src/components/settings_modal/helpers/setting.js @@ -59,6 +59,16 @@ export default { return value } }, + backendDescription () { + console.log(get(this.$store.state.adminSettings.descriptions, this.path)) + return get(this.$store.state.adminSettings.descriptions, this.path) + }, + backendDescriptionLabel () { + return this.backendDescription.label + }, + backendDescriptionDescription () { + return this.backendDescription.description + }, shouldBeDisabled () { const parentValue = this.parentPath !== undefined ? get(this.configSource, this.parentPath) : null return this.disabled || (parentValue !== null ? (this.parentInvert ? parentValue : !parentValue) : false) diff --git a/src/components/settings_modal/helpers/string_setting.vue b/src/components/settings_modal/helpers/string_setting.vue index 0a71aeab..91a4afa4 100644 --- a/src/components/settings_modal/helpers/string_setting.vue +++ b/src/components/settings_modal/helpers/string_setting.vue @@ -4,7 +4,12 @@ class="StringSetting" > +

    + {{ backendDescriptionDescription + ' ' }} +

    diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss index f5861229..4cce6099 100644 --- a/src/components/settings_modal/settings_modal.scss +++ b/src/components/settings_modal/settings_modal.scss @@ -17,6 +17,12 @@ } } + .setting-description { + margin-top: 0.2em; + margin-bottom: 2em; + font-size: 70%; + } + .settings-modal-panel { overflow: hidden; transition: transform; diff --git a/src/components/settings_modal/settings_modal_admin_content.js b/src/components/settings_modal/settings_modal_admin_content.js index 88ba1755..c6c8837f 100644 --- a/src/components/settings_modal/settings_modal_admin_content.js +++ b/src/components/settings_modal/settings_modal_admin_content.js @@ -3,6 +3,7 @@ import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx' import DataImportExportTab from './tabs/data_import_export_tab.vue' import MutesAndBlocksTab from './tabs/mutes_and_blocks_tab.vue' import InstanceTab from './admin_tabs/instance_tab.vue' +import LimitsTab from './admin_tabs/limits_tab.vue' import { library } from '@fortawesome/fontawesome-svg-core' import { @@ -33,7 +34,8 @@ const SettingsModalAdminContent = { DataImportExportTab, MutesAndBlocksTab, - InstanceTab + InstanceTab, + LimitsTab }, computed: { isLoggedIn () { diff --git a/src/components/settings_modal/settings_modal_admin_content.vue b/src/components/settings_modal/settings_modal_admin_content.vue index 9873b127..16b55828 100644 --- a/src/components/settings_modal/settings_modal_admin_content.vue +++ b/src/components/settings_modal/settings_modal_admin_content.vue @@ -7,12 +7,19 @@ :body-scroll-lock="bodyLock" >
    +
    + +
    diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js index d1df67d4..44a4d409 100644 --- a/src/modules/adminSettings.js +++ b/src/modules/adminSettings.js @@ -3,7 +3,8 @@ import { set, cloneDeep } from 'lodash' export const defaultState = { needsReboot: null, config: null, - modifiedPaths: null + modifiedPaths: null, + descriptions: null } export const newUserFlags = { @@ -18,6 +19,9 @@ const adminSettingsStorage = { updateAdminSettings (state, { config, modifiedPaths }) { state.config = config state.modifiedPaths = modifiedPaths + }, + updateAdminDescriptions (state, { descriptions }) { + state.descriptions = descriptions } }, actions: { @@ -40,8 +44,25 @@ const adminSettingsStorage = { } set(config, path, convert(c.value)) }) + console.log(config[':pleroma'][':welcome']) commit('updateAdminSettings', { config, modifiedPaths }) }, + setInstanceAdminDescriptions ({ state, commit, dispatch }, { backendDescriptions }) { + const convert = ({ children, description, label, key = '', group, suggestions }, path, acc) => { + const newPath = group ? group + '.' + key : key + const obj = { description, label, suggestions } + if (Array.isArray(children)) { + children.forEach(c => { + convert(c, '.' + newPath, obj) + }) + } + set(acc, newPath, obj) + } + + const descriptions = {} + backendDescriptions.forEach(d => convert(d, '', descriptions)) + commit('updateAdminDescriptions', { descriptions }) + }, pushAdminSetting ({ rootState, state, commit, dispatch }, { path, value }) { const [group, key, ...rest] = path.split(/\./g) const clone = {} // not actually cloning the entire thing to avoid excessive writes @@ -71,7 +92,6 @@ const adminSettingsStorage = { .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig })) }, resetAdminSetting ({ rootState, state, commit, dispatch }, { path }) { - console.log('ASS') const [group, key, subkey] = path.split(/\./g) state.modifiedPaths.delete(path) diff --git a/src/modules/users.js b/src/modules/users.js index 12e582f4..45cba334 100644 --- a/src/modules/users.js +++ b/src/modules/users.js @@ -567,6 +567,8 @@ const users = { if (user.rights.admin) { store.rootState.api.backendInteractor.fetchInstanceDBConfig() .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig })) + store.rootState.api.backendInteractor.fetchInstanceConfigDescriptions() + .then(backendDescriptions => dispatch('setInstanceAdminDescriptions', { backendDescriptions })) } commit('addNewUsers', [user]) diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js index 71ba1dec..073f40a3 100644 --- a/src/services/api/api.service.js +++ b/src/services/api/api.service.js @@ -109,6 +109,7 @@ const PLEROMA_EDIT_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements const PLEROMA_DELETE_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcements/${id}` const PLEROMA_ADMIN_CONFIG_URL = '/api/pleroma/admin/config' +const PLEROMA_ADMIN_DESCRIPTIONS_URL = '/api/pleroma/admin/config/descriptions' const oldfetch = window.fetch @@ -1677,6 +1678,21 @@ const fetchInstanceDBConfig = ({ credentials }) => { }) } +const fetchInstanceConfigDescriptions = ({ credentials }) => { + return fetch(PLEROMA_ADMIN_DESCRIPTIONS_URL, { + headers: authHeaders(credentials) + }) + .then((response) => { + if (response.ok) { + return response.json() + } else { + return { + error: response + } + } + }) +} + const pushInstanceDBConfig = ({ credentials, payload }) => { return fetch(PLEROMA_ADMIN_CONFIG_URL, { headers: { @@ -1813,6 +1829,7 @@ const apiService = { deleteAnnouncement, adminFetchAnnouncements, fetchInstanceDBConfig, + fetchInstanceConfigDescriptions, pushInstanceDBConfig } -- cgit v1.2.3-70-g09d2 From 0b5e536b4c96a81ec78f323be9bece6deae61773 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 20 Mar 2023 23:36:47 +0200 Subject: ChoiceSetting support added, added captcha settings --- .../settings_modal/admin_tabs/instance_tab.vue | 51 ++++++++++++++++++++++ .../settings_modal/helpers/choice_setting.js | 27 +++++++++++- .../settings_modal/helpers/choice_setting.vue | 18 ++++++-- .../settings_modal/helpers/number_setting.vue | 15 ++++++- src/components/settings_modal/helpers/setting.js | 7 ++- .../helpers/shared_computed_object.js | 3 ++ src/modules/adminSettings.js | 13 +++--- 7 files changed, 121 insertions(+), 13 deletions(-) (limited to 'src/modules/adminSettings.js') diff --git a/src/components/settings_modal/admin_tabs/instance_tab.vue b/src/components/settings_modal/admin_tabs/instance_tab.vue index ad271293..ff784287 100644 --- a/src/components/settings_modal/admin_tabs/instance_tab.vue +++ b/src/components/settings_modal/admin_tabs/instance_tab.vue @@ -111,6 +111,57 @@ APPROVAL REQUIRED +
  • +

    {{ $t('admin_dash.captcha.header') }}

    +
    • +
  • + + CAPTCHA + +
      +
    • + + CAPTCHA TYPE + + + VALID + +
      • +
    +
      +

      {{ $t('admin_dash.kocaptcha') }}

      +
    • + + cockAPTCHA ENDPOINT + +
      • +
    +
    • diff --git a/src/components/settings_modal/helpers/choice_setting.js b/src/components/settings_modal/helpers/choice_setting.js index a3c3bf44..3ff81bc9 100644 --- a/src/components/settings_modal/helpers/choice_setting.js +++ b/src/components/settings_modal/helpers/choice_setting.js @@ -11,7 +11,32 @@ export default { ...Setting.props, options: { type: Array, - required: true + required: false + }, + optionLabelMap: { + type: Object, + required: false, + default: {} + } + }, + computed: { + ...Setting.computed, + realOptions () { + if (this.source === 'admin') { + console.log(this.backendDescriptionSuggestions) + return this.backendDescriptionSuggestions.map(x => ({ + key: x, + value: x, + label: this.optionLabelMap[x] || x + })) + } + return this.options + } + }, + methods: { + ...Setting.methods, + getValue (e) { + return e } } } diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue index 4c4cdefe..55f9a62c 100644 --- a/src/components/settings_modal/helpers/choice_setting.vue +++ b/src/components/settings_modal/helpers/choice_setting.vue @@ -3,15 +3,20 @@ v-if="matchesExpertLevel" class="ChoiceSetting" > - + + {{ ' ' }} + + +

    + {{ backendDescriptionDescription + ' ' }} +

    diff --git a/src/components/settings_modal/helpers/setting.js b/src/components/settings_modal/helpers/setting.js index 8c7074a5..a6d35fb9 100644 --- a/src/components/settings_modal/helpers/setting.js +++ b/src/components/settings_modal/helpers/setting.js @@ -13,7 +13,7 @@ export default { }, props: { path: { - type: String, + type: [String, Array], required: true }, disabled: { @@ -21,7 +21,7 @@ export default { default: false }, parentPath: { - type: String + type: [String, Array] }, parentInvert: { type: Boolean, @@ -68,6 +68,9 @@ export default { backendDescriptionDescription () { return this.backendDescription?.description }, + backendDescriptionSuggestions () { + return this.backendDescription?.suggestions + }, shouldBeDisabled () { const parentValue = this.parentPath !== undefined ? get(this.configSource, this.parentPath) : null return this.disabled || (parentValue !== null ? (this.parentInvert ? parentValue : !parentValue) : false) diff --git a/src/components/settings_modal/helpers/shared_computed_object.js b/src/components/settings_modal/helpers/shared_computed_object.js index 912999ce..d02db542 100644 --- a/src/components/settings_modal/helpers/shared_computed_object.js +++ b/src/components/settings_modal/helpers/shared_computed_object.js @@ -7,6 +7,9 @@ const SharedComputedObject = () => ({ }, mergedConfig () { return this.$store.getters.mergedConfig + }, + adminConfig () { + return this.$store.state.adminSettings.config } }) diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js index 44a4d409..a84fadbf 100644 --- a/src/modules/adminSettings.js +++ b/src/modules/adminSettings.js @@ -29,7 +29,7 @@ const adminSettingsStorage = { const config = state.config || {} const modifiedPaths = state.modifiedPaths || new Set() backendDbConfig.configs.forEach(c => { - const path = c.group + '.' + c.key + const path = [c.group, c.key] if (c.db) { c.db.forEach(x => modifiedPaths.add(path + '.' + x)) } @@ -44,16 +44,16 @@ const adminSettingsStorage = { } set(config, path, convert(c.value)) }) - console.log(config[':pleroma'][':welcome']) + console.log(config[':pleroma']) commit('updateAdminSettings', { config, modifiedPaths }) }, setInstanceAdminDescriptions ({ state, commit, dispatch }, { backendDescriptions }) { const convert = ({ children, description, label, key = '', group, suggestions }, path, acc) => { - const newPath = group ? group + '.' + key : key + const newPath = group ? [group, key] : [key] const obj = { description, label, suggestions } if (Array.isArray(children)) { children.forEach(c => { - convert(c, '.' + newPath, obj) + convert(c, newPath, obj) }) } set(acc, newPath, obj) @@ -61,12 +61,13 @@ const adminSettingsStorage = { const descriptions = {} backendDescriptions.forEach(d => convert(d, '', descriptions)) + console.log(descriptions[':pleroma']['Pleroma.Captcha']) commit('updateAdminDescriptions', { descriptions }) }, pushAdminSetting ({ rootState, state, commit, dispatch }, { path, value }) { - const [group, key, ...rest] = path.split(/\./g) + const [group, key, ...rest] = Array.isArray(path) ? path : path.split(/\./g) const clone = {} // not actually cloning the entire thing to avoid excessive writes - set(clone, rest.join('.'), value) + set(clone, rest, value) // TODO cleanup paths in modifiedPaths const convert = (value) => { -- cgit v1.2.3-70-g09d2 From c7a16bdfe2cebe51c232ae3fe3101d35c4f877a2 Mon Sep 17 00:00:00 2001 From: Henry Jameson 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/modules/adminSettings.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 +
  • + + TIMELINES + +

  • {{ $t('admin_dash.instance.restrict.profiles') }}

    • @@ -89,6 +94,11 @@ FED PROFILES +
  • + + PROFILES + +

  • {{ $t('admin_dash.instance.restrict.activities') }}

    • @@ -108,6 +118,11 @@ FED STATUSES +
  • + + STATUSES + +
    • 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 @@ + + + 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 = '', group, suggestions }, path, acc) => { -- cgit v1.2.3-70-g09d2 From ece69f01b790b4bc02387d31ca911a0588e0664c Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 22 Mar 2023 18:57:23 +0200 Subject: added mass-draft-push and mass-draft-reset, small stylistic fixes --- src/components/settings_modal/settings_modal.js | 14 +++++- src/components/settings_modal/settings_modal.scss | 2 + src/components/settings_modal/settings_modal.vue | 19 +++++++- src/modules/adminSettings.js | 57 ++++++++++++++++++++++- 4 files changed, 88 insertions(+), 4 deletions(-) (limited to 'src/modules/adminSettings.js') diff --git a/src/components/settings_modal/settings_modal.js b/src/components/settings_modal/settings_modal.js index e033d999..ff58f2c3 100644 --- a/src/components/settings_modal/settings_modal.js +++ b/src/components/settings_modal/settings_modal.js @@ -5,7 +5,7 @@ import getResettableAsyncComponent from 'src/services/resettable_async_component import Popover from '../popover/popover.vue' import Checkbox from 'src/components/checkbox/checkbox.vue' import { library } from '@fortawesome/fontawesome-svg-core' -import { cloneDeep } from 'lodash' +import { cloneDeep, isEqual } from 'lodash' import { newImporter, newExporter @@ -155,6 +155,12 @@ const SettingsModal = { PLEROMAFE_SETTINGS_MINOR_VERSION ] return clone + }, + resetAdminDraft () { + this.$store.commit('resetAdminDraft') + }, + pushAdminDraft () { + this.$store.dispatch('pushAdminDraft') } }, computed: { @@ -183,6 +189,12 @@ const SettingsModal = { set (value) { this.$store.dispatch('setOption', { name: 'expertLevel', value: value ? 1 : 0 }) } + }, + adminDraftAny () { + return !isEqual( + this.$store.state.adminSettings.config, + this.$store.state.adminSettings.draft + ) } } } diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss index 4cce6099..4cb506f9 100644 --- a/src/components/settings_modal/settings_modal.scss +++ b/src/components/settings_modal/settings_modal.scss @@ -51,6 +51,8 @@ .settings-footer { display: flex; + flex-wrap: wrap; + line-height: 2; >* { margin-right: 0.5em; diff --git a/src/components/settings_modal/settings_modal.vue b/src/components/settings_modal/settings_modal.vue index 303050e4..57ec5535 100644 --- a/src/components/settings_modal/settings_modal.vue +++ b/src/components/settings_modal/settings_modal.vue @@ -45,7 +45,7 @@
    -
    +
    + + + {{ ' ' }} + +
    diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js index 27d5b37d..25fb8e50 100644 --- a/src/modules/adminSettings.js +++ b/src/modules/adminSettings.js @@ -1,4 +1,4 @@ -import { set, get, cloneDeep } from 'lodash' +import { set, get, cloneDeep, differenceWith, isEqual, flatten } from 'lodash' export const defaultState = { needsReboot: null, @@ -42,7 +42,7 @@ const adminSettingsStorage = { actions: { setInstanceAdminSettings ({ state, commit, dispatch }, { backendDbConfig }) { const config = state.config || {} - const modifiedPaths = state.modifiedPaths || new Set() + const modifiedPaths = new Set() backendDbConfig.configs.forEach(c => { const path = [c.group, c.key] if (c.db) { @@ -82,6 +82,59 @@ const adminSettingsStorage = { console.log(descriptions[':pleroma']['Pleroma.Captcha']) commit('updateAdminDescriptions', { descriptions }) }, + + // This action takes draft state, diffs it with live config state and then pushes + // only differences between the two. Difference detection only work up to subkey (third) level. + pushAdminDraft ({ rootState, state, commit, dispatch }) { + // TODO cleanup paths in modifiedPaths + const convert = (value) => { + if (typeof value !== 'object') { + return value + } else if (Array.isArray(value)) { + return value.map(convert) + } else { + return Object.entries(value).map(([k, v]) => ({ tuple: [k, v] })) + } + } + + // Getting all group-keys used in config + const allGroupKeys = flatten( + Object + .entries(state.config) + .map( + ([group, lv1data]) => Object + .keys(lv1data) + .map((key) => ({ group, key })) + ) + ) + + // Only using group-keys where there are changes detected + const changedGroupKeys = allGroupKeys.filter(({ group, key }) => { + return !isEqual(state.config[group][key], state.draft[group][key]) + }) + + // Here we take all changed group-keys and get all changed subkeys + const changed = changedGroupKeys.map(({ group, key }) => { + const config = state.config[group][key] + const draft = state.draft[group][key] + + // We convert group-key value into entries arrays + const eConfig = Object.entries(config) + const eDraft = Object.entries(draft) + + // Then those entries array we diff so only changed subkey entries remain + // We use the diffed array to reconstruct the object and then shove it into convert() + return ({ group, key, value: convert(Object.fromEntries(differenceWith(eDraft, eConfig, isEqual))) }) + }) + + rootState.api.backendInteractor.pushInstanceDBConfig({ + payload: { + configs: changed + } + }) + .then(() => rootState.api.backendInteractor.fetchInstanceDBConfig()) + .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig })) + }, pushAdminSetting ({ rootState, state, commit, dispatch }, { path, value }) { const [group, key, ...rest] = Array.isArray(path) ? path : path.split(/\./g) const clone = {} // not actually cloning the entire thing to avoid excessive writes -- cgit v1.2.3-70-g09d2 From 4c3af5c362574aad4d851990265ebc7252c6f990 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 27 Mar 2023 22:57:50 +0300 Subject: handle db config disabled case --- .../settings_modal/settings_modal_admin_content.js | 18 ++++++++-- .../settings_modal_admin_content.vue | 39 ++++++++++++++++++++++ src/i18n/en.json | 10 +++++- src/modules/adminSettings.js | 30 ++++++++++++++++- src/modules/users.js | 6 ---- 5 files changed, 93 insertions(+), 10 deletions(-) (limited to 'src/modules/adminSettings.js') diff --git a/src/components/settings_modal/settings_modal_admin_content.js b/src/components/settings_modal/settings_modal_admin_content.js index 07d4cf2e..1c239e59 100644 --- a/src/components/settings_modal/settings_modal_admin_content.js +++ b/src/components/settings_modal/settings_modal_admin_content.js @@ -9,7 +9,7 @@ import { library } from '@fortawesome/fontawesome-svg-core' import { faWrench, faHand, - faFilter, + faLaptopCode, faPaintBrush, faBell, faDownload, @@ -20,7 +20,7 @@ import { library.add( faWrench, faHand, - faFilter, + faLaptopCode, faPaintBrush, faBell, faDownload, @@ -38,6 +38,9 @@ const SettingsModalAdminContent = { LimitsTab }, computed: { + user () { + return this.$store.state.users.currentUser + }, isLoggedIn () { return !!this.$store.state.users.currentUser }, @@ -46,6 +49,17 @@ const SettingsModalAdminContent = { }, bodyLock () { return this.$store.state.interface.settingsModalState === 'visible' + }, + adminDbLoaded () { + return this.$store.state.adminSettings.loaded + }, + noDb () { + return this.$store.state.adminSettings.dbConfigEnabled === false + } + }, + created () { + if (this.user.rights.admin) { + this.$store.dispatch('loadAdminStuff') } }, methods: { diff --git a/src/components/settings_modal/settings_modal_admin_content.vue b/src/components/settings_modal/settings_modal_admin_content.vue index 52c6ddf5..ae670a90 100644 --- a/src/components/settings_modal/settings_modal_admin_content.vue +++ b/src/components/settings_modal/settings_modal_admin_content.vue @@ -4,9 +4,40 @@ class="settings_tab-switcher" :side-tab-bar="true" :scrollable-tabs="true" + :render-only-focused="true" :body-scroll-lock="bodyLock" >
    +
    +
    +

    {{ $t('admin_dash.nodb.heading') }}

    + + + + + +

    {{ $t('admin_dash.nodb.text2') }}

    +
    +
    +
    +
    +
    + +
    diff --git a/src/i18n/en.json b/src/i18n/en.json index dd78d148..86ae7f06 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -845,8 +845,16 @@ "reset_all": "Reset all", "commit_all": "Save all", "tabs": { + "nodb": "No DB Config", "instance": "Instance", - "limits": "Limits" + "limits": "Limits", + "frontends": "Front-ends" + }, + "nodb": { + "heading": "Database config is disabled", + "text": "You need to change backend config files so that {property} is set to {value}, see more in {documentation}.", + "documentation": "documentation", + "text2": "Most configuration options will be unavailable." }, "captcha": { "native": "Native", diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js index 25fb8e50..fef73974 100644 --- a/src/modules/adminSettings.js +++ b/src/modules/adminSettings.js @@ -1,11 +1,13 @@ import { set, get, cloneDeep, differenceWith, isEqual, flatten } from 'lodash' export const defaultState = { + loaded: false, needsReboot: null, config: null, modifiedPaths: null, descriptions: null, - draft: null + draft: null, + dbConfigEnabled: null } export const newUserFlags = { @@ -17,7 +19,13 @@ const adminSettingsStorage = { ...cloneDeep(defaultState) }, mutations: { + setInstanceAdminNoDbConfig (state) { + state.loaded = false + state.dbConfigEnabled = false + }, updateAdminSettings (state, { config, modifiedPaths }) { + state.loaded = true + state.dbConfigEnabled = true state.config = config state.modifiedPaths = modifiedPaths }, @@ -40,6 +48,26 @@ const adminSettingsStorage = { } }, actions: { + loadAdminStuff ({ state, rootState, dispatch, commit }) { + rootState.api.backendInteractor.fetchInstanceDBConfig() + .then(backendDbConfig => { + if (backendDbConfig.error) { + if (backendDbConfig.error.status === 400) { + backendDbConfig.error.json().then(errorJson => { + if (/configurable_from_database/.test(errorJson.error)) { + commit('setInstanceAdminNoDbConfig') + } + }) + } + } else { + dispatch('setInstanceAdminSettings', { backendDbConfig }) + } + }) + if (state.descriptions === null) { + rootState.api.backendInteractor.fetchInstanceConfigDescriptions() + .then(backendDescriptions => this.$store.dispatch('setInstanceAdminDescriptions', { backendDescriptions })) + } + }, setInstanceAdminSettings ({ state, commit, dispatch }, { backendDbConfig }) { const config = state.config || {} const modifiedPaths = new Set() diff --git a/src/modules/users.js b/src/modules/users.js index 45cba334..a23f6d7d 100644 --- a/src/modules/users.js +++ b/src/modules/users.js @@ -564,12 +564,6 @@ const users = { user.domainMutes = [] commit('setCurrentUser', user) commit('setServerSideStorage', user) - if (user.rights.admin) { - store.rootState.api.backendInteractor.fetchInstanceDBConfig() - .then(backendDbConfig => dispatch('setInstanceAdminSettings', { backendDbConfig })) - store.rootState.api.backendInteractor.fetchInstanceConfigDescriptions() - .then(backendDescriptions => dispatch('setInstanceAdminDescriptions', { backendDescriptions })) - } commit('addNewUsers', [user]) dispatch('fetchEmoji') -- cgit v1.2.3-70-g09d2 From 3ac67ab7274c199766d026fcf168bd2a3d4e2692 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 27 Mar 2023 23:00:52 +0300 Subject: fix --- src/modules/adminSettings.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/modules/adminSettings.js') diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js index fef73974..b8265949 100644 --- a/src/modules/adminSettings.js +++ b/src/modules/adminSettings.js @@ -65,7 +65,7 @@ const adminSettingsStorage = { }) if (state.descriptions === null) { rootState.api.backendInteractor.fetchInstanceConfigDescriptions() - .then(backendDescriptions => this.$store.dispatch('setInstanceAdminDescriptions', { backendDescriptions })) + .then(backendDescriptions => dispatch('setInstanceAdminDescriptions', { backendDescriptions })) } }, setInstanceAdminSettings ({ state, commit, dispatch }, { backendDbConfig }) { -- cgit v1.2.3-70-g09d2 From 7bb28bb23c61e2d648eecf5d59969d32631f78e8 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 29 Mar 2023 00:58:07 +0300 Subject: frontends tab initial implementation, now you can (re)install frontends! yay! --- src/App.scss | 22 ++++++- .../settings_modal/admin_tabs/frontends_tab.js | 58 +++++++++++++++++ .../settings_modal/admin_tabs/frontends_tab.scss | 13 ++++ .../settings_modal/admin_tabs/frontends_tab.vue | 72 ++++++++++++++++++++++ src/components/settings_modal/settings_modal.scss | 1 - .../settings_modal/settings_modal_admin_content.js | 8 +-- src/i18n/en.json | 8 +++ src/modules/adminSettings.js | 15 +++++ src/services/api/api.service.js | 42 ++++++++++++- 9 files changed, 229 insertions(+), 10 deletions(-) create mode 100644 src/components/settings_modal/admin_tabs/frontends_tab.js create mode 100644 src/components/settings_modal/admin_tabs/frontends_tab.scss create mode 100644 src/components/settings_modal/admin_tabs/frontends_tab.vue (limited to 'src/modules/adminSettings.js') diff --git a/src/App.scss b/src/App.scss index 3f352e8d..149d640f 100644 --- a/src/App.scss +++ b/src/App.scss @@ -645,6 +645,19 @@ option { } } +.cards-list { + display: grid; + grid-auto-flow: row dense; + grid-template-columns: 1fr 1fr; + + li { + border: 1px solid var(--border); + border-radius: var(--inputRadius); + padding: 0.5em; + margin: 0.25em; + } +} + .btn-block { display: block; width: 100%; @@ -655,16 +668,19 @@ option { display: inline-flex; vertical-align: middle; - button { + button, + .button-dropdown { position: relative; flex: 1 1 auto; - &:not(:last-child) { + &:not(:last-child), + &:not(:last-child) .button-default { border-top-right-radius: 0; border-bottom-right-radius: 0; } - &:not(:first-child) { + &:not(:first-child), + &:not(:first-child) .button-default { border-top-left-radius: 0; border-bottom-left-radius: 0; } diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.js b/src/components/settings_modal/admin_tabs/frontends_tab.js new file mode 100644 index 00000000..a5d33cbe --- /dev/null +++ b/src/components/settings_modal/admin_tabs/frontends_tab.js @@ -0,0 +1,58 @@ +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 Popover from 'src/components/popover/popover.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 FrontendsTab = { + provide () { + return { + defaultDraftMode: true, + defaultSource: 'admin' + } + }, + components: { + BooleanSetting, + ChoiceSetting, + IntegerSetting, + StringSetting, + GroupSetting, + Popover + }, + created () { + if (this.user.rights.admin) { + this.$store.dispatch('loadFrontendsStuff') + } + }, + computed: { + frontends () { + return this.$store.state.adminSettings.frontends + }, + ...SharedComputedObject() + }, + methods: { + update (frontend, suggestRef) { + const ref = suggestRef || frontend.refs[0] + const { name } = frontend + const payload = { name, ref } + + this.$store.state.api.backendInteractor.installFrontend({ payload }) + .then((externalUser) => { + this.$store.dispatch('loadFrontendsStuff') + }) + } + } +} + +export default FrontendsTab diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.scss b/src/components/settings_modal/admin_tabs/frontends_tab.scss new file mode 100644 index 00000000..1e1881ff --- /dev/null +++ b/src/components/settings_modal/admin_tabs/frontends_tab.scss @@ -0,0 +1,13 @@ +.frontends-tab { + .cards-list { + padding: 0; + } + + dd { + text-overflow: ellipsis; + word-wrap: nowrap; + white-space: nowrap; + overflow-x: hidden; + max-width: 80%; + } +} diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.vue b/src/components/settings_modal/admin_tabs/frontends_tab.vue new file mode 100644 index 00000000..48649dfb --- /dev/null +++ b/src/components/settings_modal/admin_tabs/frontends_tab.vue @@ -0,0 +1,72 @@ + + + + + diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss index 4cb506f9..98de736b 100644 --- a/src/components/settings_modal/settings_modal.scss +++ b/src/components/settings_modal/settings_modal.scss @@ -43,7 +43,6 @@ .btn { min-height: 2em; - min-width: 10em; padding: 0 2em; } } diff --git a/src/components/settings_modal/settings_modal_admin_content.js b/src/components/settings_modal/settings_modal_admin_content.js index 1c239e59..b7c0de57 100644 --- a/src/components/settings_modal/settings_modal_admin_content.js +++ b/src/components/settings_modal/settings_modal_admin_content.js @@ -1,9 +1,8 @@ import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx' -import DataImportExportTab from './tabs/data_import_export_tab.vue' -import MutesAndBlocksTab from './tabs/mutes_and_blocks_tab.vue' 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 { library } from '@fortawesome/fontawesome-svg-core' import { @@ -32,10 +31,9 @@ const SettingsModalAdminContent = { components: { TabSwitcher, - DataImportExportTab, - MutesAndBlocksTab, InstanceTab, - LimitsTab + LimitsTab, + FrontendsTab }, computed: { user () { diff --git a/src/i18n/en.json b/src/i18n/en.json index 86ae7f06..ede5d494 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -873,6 +873,14 @@ "users": "User profile limits", "profile_fields": "Profile fields limits", "user_uploads": "Profile media limits" + }, + "frontend": { + "repository": "Repository link", + "versions": "Available versions", + "build_url": "Build URL", + "reinstall": "Reinstall", + "install": "Install", + "install_version": "Install version {version}" } }, "time": { diff --git a/src/modules/adminSettings.js b/src/modules/adminSettings.js index b8265949..cad9c0ca 100644 --- a/src/modules/adminSettings.js +++ b/src/modules/adminSettings.js @@ -1,6 +1,7 @@ import { set, get, cloneDeep, differenceWith, isEqual, flatten } from 'lodash' export const defaultState = { + frontends: [], loaded: false, needsReboot: null, config: null, @@ -23,6 +24,16 @@ const adminSettingsStorage = { state.loaded = false state.dbConfigEnabled = false }, + setAvailableFrontends (state, { frontends }) { + state.frontends = frontends.map(f => { + if (f.name === 'pleroma-fe') { + f.refs = ['master', 'develop'] + } else { + f.refs = [f.ref] + } + return f + }) + }, updateAdminSettings (state, { config, modifiedPaths }) { state.loaded = true state.dbConfigEnabled = true @@ -48,6 +59,10 @@ const adminSettingsStorage = { } }, actions: { + loadFrontendsStuff ({ state, rootState, dispatch, commit }) { + rootState.api.backendInteractor.fetchAvailableFrontends() + .then(frontends => commit('setAvailableFrontends', { frontends })) + }, loadAdminStuff ({ state, rootState, dispatch, commit }) { rootState.api.backendInteractor.fetchInstanceDBConfig() .then(backendDbConfig => { diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js index 073f40a3..56e7de71 100644 --- a/src/services/api/api.service.js +++ b/src/services/api/api.service.js @@ -110,6 +110,8 @@ const PLEROMA_DELETE_ANNOUNCEMENT_URL = id => `/api/v1/pleroma/admin/announcemen const PLEROMA_ADMIN_CONFIG_URL = '/api/pleroma/admin/config' const PLEROMA_ADMIN_DESCRIPTIONS_URL = '/api/pleroma/admin/config/descriptions' +const PLEROMA_ADMIN_FRONTENDS_URL = '/api/pleroma/admin/frontends' +const PLEROMA_ADMIN_FRONTENDS_INSTALL_URL = '/api/pleroma/admin/frontends/install' const oldfetch = window.fetch @@ -1693,6 +1695,21 @@ const fetchInstanceConfigDescriptions = ({ credentials }) => { }) } +const fetchAvailableFrontends = ({ credentials }) => { + return fetch(PLEROMA_ADMIN_FRONTENDS_URL, { + headers: authHeaders(credentials) + }) + .then((response) => { + if (response.ok) { + return response.json() + } else { + return { + error: response + } + } + }) +} + const pushInstanceDBConfig = ({ credentials, payload }) => { return fetch(PLEROMA_ADMIN_CONFIG_URL, { headers: { @@ -1714,6 +1731,27 @@ const pushInstanceDBConfig = ({ credentials, payload }) => { }) } +const installFrontend = ({ credentials, payload }) => { + return fetch(PLEROMA_ADMIN_FRONTENDS_INSTALL_URL, { + headers: { + Accept: 'application/json', + 'Content-Type': 'application/json', + ...authHeaders(credentials) + }, + method: 'POST', + body: JSON.stringify(payload) + }) + .then((response) => { + if (response.ok) { + return response.json() + } else { + return { + error: response + } + } + }) +} + const apiService = { verifyCredentials, fetchTimeline, @@ -1830,7 +1868,9 @@ const apiService = { adminFetchAnnouncements, fetchInstanceDBConfig, fetchInstanceConfigDescriptions, - pushInstanceDBConfig + fetchAvailableFrontends, + pushInstanceDBConfig, + installFrontend } export default apiService -- cgit v1.2.3-70-g09d2