qugalet/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

revert interface.js since it's an action it will be always asynchronous

Browse source
This commit is contained in:
Henry Jameson 2024-09-18 02:49:27 +03:00
parent 6c6d356f70
commit d2f85f4f25
1 changed files with 98 additions and 93 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

191
src/modules/interface.js
View file

@ -56,6 +56,9 @@ const interfaceMod = {
state.temporaryChangesConfirm = () => {} state.temporaryChangesConfirm = () => {}
state.temporaryChangesRevert = () => {} state.temporaryChangesRevert = () => {}
}, },
setThemeApplied (state) {
state.themeApplied = true
},
setNotificationPermission (state, permission) { setNotificationPermission (state, permission) {
state.notificationPermission = permission state.notificationPermission = permission
}, },
@ -117,9 +120,6 @@ const interfaceMod = {
setPageTitle ({ rootState }, option = '') { setPageTitle ({ rootState }, option = '') {
document.title = `${option} ${rootState.instance.name}` document.title = `${option} ${rootState.instance.name}`
}, },
setThemeApplied ({ state, rootGetters }) {
state.themeApplied = true
},
settingsSaved ({ commit, dispatch }, { success, error }) { settingsSaved ({ commit, dispatch }, { success, error }) {
commit('settingsSaved', { success, error }) commit('settingsSaved', { success, error })
}, },
@ -212,7 +212,7 @@ const interfaceMod = {
setLastTimeline ({ commit }, value) { setLastTimeline ({ commit }, value) {
commit('setLastTimeline', value) commit('setLastTimeline', value)
}, },
setTheme ({ dispatch, commit, rootState }, { themeName, themeData, recompile, saveData } = {}) { setTheme ({ commit, rootState }, { themeName, themeData, recompile, saveData } = {}) {
const { const {
theme: instanceThemeName theme: instanceThemeName
} = rootState.instance } = rootState.instance
@ -230,27 +230,27 @@ const interfaceMod = {
const forceRecompile = forceThemeRecompilation || recompile const forceRecompile = forceThemeRecompilation || recompile
let result = null let promise = null
if (themeData) { if (themeData) {
result = normalizeThemeData(themeData) promise = Promise.resolve(normalizeThemeData(themeData))
} else if (themeName) { } else if (themeName) {
result = normalizeThemeData(getPreset(themeName)) promise = getPreset(themeName).then(themeData => normalizeThemeData(themeData))
.then(themeData => normalizeThemeData(themeData))
} else if (userThemeSource || userThemeSnapshot) { } else if (userThemeSource || userThemeSnapshot) {
result = normalizeThemeData({ promise = Promise.resolve(normalizeThemeData({
_pleroma_theme_version: 2, _pleroma_theme_version: 2,
theme: userThemeSnapshot, theme: userThemeSnapshot,
source: userThemeSource source: userThemeSource
}) }))
} else if (actualThemeName && actualThemeName !== 'custom') { } else if (actualThemeName && actualThemeName !== 'custom') {
const themeData = getPreset(actualThemeName) promise = getPreset(actualThemeName).then(themeData => {
const realThemeData = normalizeThemeData(themeData) const realThemeData = normalizeThemeData(themeData)
if (actualThemeName === instanceThemeName) { if (actualThemeName === instanceThemeName) {
// This sole line is the reason why this whole block is above the recompilation check // This sole line is the reason why this whole block is above the recompilation check
commit('setInstanceOption', { name: 'themeData', value: { theme: realThemeData } }) commit('setInstanceOption', { name: 'themeData', value: { theme: realThemeData } })
} }
result = realThemeData return realThemeData
})
} else { } else {
throw new Error('Cannot load any theme!') throw new Error('Cannot load any theme!')
} }
@ -258,91 +258,96 @@ const interfaceMod = {
// If we're not not forced to recompile try using // If we're not not forced to recompile try using
// cache (tryLoadCache return true if load successful) // cache (tryLoadCache return true if load successful)
if (!forceRecompile && !themeDebug && tryLoadCache()) { if (!forceRecompile && !themeDebug && tryLoadCache()) {
return dispatch('setThemeApplied') commit('setThemeApplied')
return
} }
const realThemeData = result promise
const theme2ruleset = convertTheme2To3(realThemeData) .then(realThemeData => {
const theme2ruleset = convertTheme2To3(realThemeData)
if (saveData) { if (saveData) {
commit('setOption', { name: 'theme', value: themeName || actualThemeName }) commit('setOption', { name: 'theme', value: themeName || actualThemeName })
commit('setOption', { name: 'customTheme', value: realThemeData }) commit('setOption', { name: 'customTheme', value: realThemeData })
commit('setOption', { name: 'customThemeSource', value: realThemeData }) commit('setOption', { name: 'customThemeSource', value: realThemeData })
}
const hacks = []
Object.entries(theme3hacks).forEach(([key, value]) => {
switch (key) {
case 'fonts': {
Object.entries(theme3hacks.fonts).forEach(([fontKey, font]) => {
if (!font?.family) return
switch (fontKey) {
case 'interface':
hacks.push({
component: 'Root',
directives: {
'--font': 'generic | ' + font.family
}
})
break
case 'input':
hacks.push({
component: 'Input',
directives: {
'--font': 'generic | ' + font.family
}
})
break
case 'post':
hacks.push({
component: 'RichContent',
directives: {
'--font': 'generic | ' + font.family
}
})
break
case 'monospace':
hacks.push({
component: 'Root',
directives: {
'--monoFont': 'generic | ' + font.family
}
})
break
}
})
break
} }
case 'underlay': { const hacks = []
if (value !== 'none') {
const newRule = { Object.entries(theme3hacks).forEach(([key, value]) => {
component: 'Underlay', switch (key) {
directives: {} case 'fonts': {
Object.entries(theme3hacks.fonts).forEach(([fontKey, font]) => {
if (!font?.family) return
switch (fontKey) {
case 'interface':
hacks.push({
component: 'Root',
directives: {
'--font': 'generic | ' + font.family
}
})
break
case 'input':
hacks.push({
component: 'Input',
directives: {
'--font': 'generic | ' + font.family
}
})
break
case 'post':
hacks.push({
component: 'RichContent',
directives: {
'--font': 'generic | ' + font.family
}
})
break
case 'monospace':
hacks.push({
component: 'Root',
directives: {
'--monoFont': 'generic | ' + font.family
}
})
break
}
})
break
} }
if (value === 'opaque') { case 'underlay': {
newRule.directives.opacity = 1 if (value !== 'none') {
newRule.directives.background = '--wallpaper' const newRule = {
component: 'Underlay',
directives: {}
}
if (value === 'opaque') {
newRule.directives.opacity = 1
newRule.directives.background = '--wallpaper'
}
if (value === 'transparent') {
newRule.directives.opacity = 0
}
hacks.push(newRule)
}
break
} }
if (value === 'transparent') {
newRule.directives.opacity = 0
}
hacks.push(newRule)
} }
break })
}
}
})
const ruleset = [ const ruleset = [
...theme2ruleset, ...theme2ruleset,
...hacks ...hacks
] ]
applyTheme( applyTheme(
ruleset, ruleset,
() => dispatch('setThemeApplied'), () => commit('setThemeApplied'),
themeDebug themeDebug
) )
})
return promise
} }
} }
} }