From 7dc22774532872fc99aa7768cf299ab623e9d155 Mon Sep 17 00:00:00 2001 From: tusooa Date: Mon, 9 Jan 2023 13:02:16 -0500 Subject: Use stylelint --- src/components/settings_modal/settings_modal.scss | 51 +++++++++++++---------- 1 file changed, 28 insertions(+), 23 deletions(-) (limited to 'src/components/settings_modal/settings_modal.scss') diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss index 13cb0e65..f5861229 100644 --- a/src/components/settings_modal/settings_modal.scss +++ b/src/components/settings_modal/settings_modal.scss @@ -1,4 +1,5 @@ -@import 'src/_variables.scss'; +@import "src/variables"; + .settings-modal { overflow: hidden; @@ -6,32 +7,13 @@ .option-list { list-style-type: none; padding-left: 2em; + li { margin-bottom: 0.5em; } - .suboptions { - margin-top: 0.3em - } - } - - &.peek { - .settings-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)); - } + .suboptions { + margin-top: 0.3em; } } @@ -63,6 +45,7 @@ .settings-footer { display: flex; + >* { margin-right: 0.5em; } @@ -72,4 +55,26 @@ flex-grow: 1; } } + + &.peek { + .settings-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)); + } + } + } } -- 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/components/settings_modal/settings_modal.scss') 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 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/components/settings_modal/settings_modal.scss') 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 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/components/settings_modal/settings_modal.scss') 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 From ac75d051b720da2c47393de6b35663afe50d37cc Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 29 Mar 2023 23:26:57 +0300 Subject: better frontends tab, now you can set default frontend --- src/App.scss | 1 + .../settings_modal/admin_tabs/frontends_tab.js | 6 + .../settings_modal/admin_tabs/frontends_tab.scss | 2 +- .../settings_modal/admin_tabs/frontends_tab.vue | 204 +++++++++++++++------ .../settings_modal/helpers/group_setting.js | 1 - src/components/settings_modal/helpers/setting.js | 4 +- .../helpers/shared_computed_object.js | 3 + src/components/settings_modal/settings_modal.scss | 3 + .../settings_modal/settings_modal_admin_content.js | 3 + .../settings_modal_admin_content.vue | 1 + src/i18n/en.json | 11 +- 11 files changed, 177 insertions(+), 62 deletions(-) (limited to 'src/components/settings_modal/settings_modal.scss') diff --git a/src/App.scss b/src/App.scss index 149d640f..ef68ac50 100644 --- a/src/App.scss +++ b/src/App.scss @@ -646,6 +646,7 @@ option { } .cards-list { + list-style: none; display: grid; grid-auto-flow: row dense; grid-template-columns: 1fr 1fr; diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.js b/src/components/settings_modal/admin_tabs/frontends_tab.js index a5d33cbe..a2c27c2a 100644 --- a/src/components/settings_modal/admin_tabs/frontends_tab.js +++ b/src/components/settings_modal/admin_tabs/frontends_tab.js @@ -51,6 +51,12 @@ const FrontendsTab = { .then((externalUser) => { this.$store.dispatch('loadFrontendsStuff') }) + }, + setDefault (frontend, suggestRef) { + const ref = suggestRef || frontend.refs[0] + const { name } = frontend + + this.$store.commit('updateAdminDraft', { path: [':pleroma', ':frontends', ':primary'], value: { name, ref } }) } } } diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.scss b/src/components/settings_modal/admin_tabs/frontends_tab.scss index 1e1881ff..e3e04bc6 100644 --- a/src/components/settings_modal/admin_tabs/frontends_tab.scss +++ b/src/components/settings_modal/admin_tabs/frontends_tab.scss @@ -8,6 +8,6 @@ word-wrap: nowrap; white-space: nowrap; overflow-x: hidden; - max-width: 80%; + max-width: 10em; } } diff --git a/src/components/settings_modal/admin_tabs/frontends_tab.vue b/src/components/settings_modal/admin_tabs/frontends_tab.vue index 48649dfb..71bbfa69 100644 --- a/src/components/settings_modal/admin_tabs/frontends_tab.vue +++ b/src/components/settings_modal/admin_tabs/frontends_tab.vue @@ -2,67 +2,157 @@

    {{ $t('admin_dash.tabs.frontends') }}

    -
      -
    • - {{ frontend.name }} -
      -
      {{ $t('admin_dash.frontend.repository') }}
      -
      {{ frontend.git }}
      -
      {{ $t('admin_dash.frontend.versions') }}
      -
      {{ frontend.refs }}
      -
      {{ $t('admin_dash.frontend.build_url') }}
      -
      {{ frontend.build_url }}
      -
      -
      - - - {{ $t('admin_dash.frontend.wip_notice') }}

      +
        +
      • +

        {{ $t('admin_dash.frontend.default_frontend') }}

        +

        {{ $t('admin_dash.frontend.default_frontend_tip') }}

        +

        {{ $t('admin_dash.frontend.default_frontend_tip2') }}

        +
        • +
      • + + NAME + +
        • +
      • + + REF + +
        • +
      • + +
        • +
      +
      +

      {{ $t('admin_dash.frontend.available_frontends') }}

      +
        +
      • + {{ frontend.name }} + {{ ' ' }} + + + - + + + + + {{ ' ' }} + + + + + +
      +
      • +
    +
    diff --git a/src/components/settings_modal/helpers/group_setting.js b/src/components/settings_modal/helpers/group_setting.js index 12a49000..23a2a202 100644 --- a/src/components/settings_modal/helpers/group_setting.js +++ b/src/components/settings_modal/helpers/group_setting.js @@ -7,7 +7,6 @@ export default { computed: { ...Setting.computed, isDirty () { - console.log(this.state, this.draft) return !isEqual(this.state, this.draft) } } diff --git a/src/components/settings_modal/helpers/setting.js b/src/components/settings_modal/helpers/setting.js index d2e1a6f4..4f0be448 100644 --- a/src/components/settings_modal/helpers/setting.js +++ b/src/components/settings_modal/helpers/setting.js @@ -61,7 +61,7 @@ export default { // TODO allow passing shared draft object? get () { if (this.realSource === 'admin') { - return get(this.$store.state.adminSettings.draft, this.path) + return get(this.$store.state.adminSettings.draft, this.canonPath) } else { return this.localDraft } @@ -75,7 +75,7 @@ export default { } }, state () { - const value = get(this.configSource, this.path) + const value = get(this.configSource, this.canonPath) if (value === undefined) { return this.defaultState } else { diff --git a/src/components/settings_modal/helpers/shared_computed_object.js b/src/components/settings_modal/helpers/shared_computed_object.js index d02db542..bb3d36ac 100644 --- a/src/components/settings_modal/helpers/shared_computed_object.js +++ b/src/components/settings_modal/helpers/shared_computed_object.js @@ -10,6 +10,9 @@ const SharedComputedObject = () => ({ }, adminConfig () { return this.$store.state.adminSettings.config + }, + adminDraft () { + return this.$store.state.adminSettings.draft } }) diff --git a/src/components/settings_modal/settings_modal.scss b/src/components/settings_modal/settings_modal.scss index 98de736b..49ef83e0 100644 --- a/src/components/settings_modal/settings_modal.scss +++ b/src/components/settings_modal/settings_modal.scss @@ -43,6 +43,9 @@ .btn { min-height: 2em; + } + + .btn:not(.dropdown-button) { 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 b7c0de57..f94721ec 100644 --- a/src/components/settings_modal/settings_modal_admin_content.js +++ b/src/components/settings_modal/settings_modal_admin_content.js @@ -51,6 +51,9 @@ const SettingsModalAdminContent = { adminDbLoaded () { return this.$store.state.adminSettings.loaded }, + adminDescriptionsLoaded () { + return this.$store.state.adminSettings.descriptions !== null + }, noDb () { return this.$store.state.adminSettings.dbConfigEnabled === false } diff --git a/src/components/settings_modal/settings_modal_admin_content.vue b/src/components/settings_modal/settings_modal_admin_content.vue index ae670a90..a7a2ac9a 100644 --- a/src/components/settings_modal/settings_modal_admin_content.vue +++ b/src/components/settings_modal/settings_modal_admin_content.vue @@ -1,5 +1,6 @@