Merge remote-tracking branch 'origin/develop' into chat-refactor

CHANGELOG.md

@@ -3,7 +3,11 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
-## 2.11
+## 2.11.1
+### Fixed
+- User note not working
+
+## 2.11.0
 ### Added
 - Initial MFM rendering support
 - Button to remove all drafts

changelog.d/2-11-2.fix

@@ -0,0 +1,4 @@
+Fixed crashing on Firefox 153
+Fixed serif-fonts being used by default in some cases
+Fixed font select component showing and using objects instead of strings
+Fixed generic ('sans-serif', 'monospace' etc) fonts not working

changelog.d/extra-notifications-style.fix

@@ -0,0 +1 @@
+Fix style of extra notifications

changelog.d/mfa-fixes.fix

@@ -0,0 +1 @@
+Fix MFA login and recovery code authentication.

changelog.d/no-crash-on-bad-style.fix

@@ -0,0 +1 @@
+Do not crash even on css rule insertion failure

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pleroma_fe",
-  "version": "2.11.0",
+  "version": "2.11.1",
   "description": "Pleroma frontend, the default frontend of Pleroma social network server",
   "author": "Pleroma contributors <https://git.pleroma.social/pleroma/pleroma-fe/src/CONTRIBUTORS.md>",
   "private": false,

src/components/extra_notifications/extra_notifications.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="ExtraNotifications">
+  <div class="ExtraNotifications panel-body">
     <div
       v-if="shouldShowChats"
       class="notification unseen"
@@ -87,6 +87,11 @@
   flex-direction: column;
   align-items: stretch;
 
+  &.panel-body::before {
+    content: '';
+    padding: 0;
+  }
+
   .notification {
     width: 100%;
     border-bottom: 1px solid;

src/components/login_form/login_form.js

@@ -63,8 +63,8 @@ const LoginForm = {
             })
           })
           .catch((error) => {
-            if (error.errorData?.error === 'mfa_required') {
+            if (error.errorData === 'mfa_required') {
-              this.requireMFA({ settings: error })
+              this.requireMFA({ settings: error.error })
             } else if (error.identifier === 'password_reset_required') {
               this.$router.push({
                 name: 'password-reset',

src/components/mfa_form/recovery_form.js

@@ -44,7 +44,7 @@ export default {
       }
 
       verifyRecoveryCode(data)
-        .then((result) => {
+        .then(({ data: result }) => {
           this.login(result).then(() => {
             this.$router.push({ name: 'friends' })
           })

src/components/settings_modal/tabs/general_tab.vue

@@ -68,7 +68,7 @@
             :model-value="mergedConfig.fontInterface"
             name="ui"
             :label="$t('settings.style.fonts.components_inline.interface')"
-            :fallback="{ family: 'sans-serif' }"
+            fallback="sans-serif"
             no-inherit="1"
             @update:model-value="v => updateFont('fontInterface', v)"
           />
@@ -77,7 +77,7 @@
           <FontControl
             :model-value="mergedConfig.fontInput"
             name="input"
-            :fallback="{ family: 'inherit' }"
+            fallback="inherit"
             :label="$t('settings.style.fonts.components_inline.input')"
             @update:model-value="v => updateFont('fontInput', v)"
           />

src/components/settings_modal/tabs/posts_tab.vue

@@ -58,7 +58,7 @@
           <FontControl
             :model-value="mergedConfig.fontPosts"
             name="post"
-            :fallback="{ family: 'inherit' }"
+            fallback="inherit"
             :label="$t('settings.style.fonts.components.post')"
             @update:model-value="v => updateFont('fontPosts', v)"
           />
@@ -67,7 +67,7 @@
           <FontControl
             :model-value="mergedConfig.fontMonospace"
             name="postCode"
-            :fallback="{ family: 'monospace' }"
+            fallback="monospace"
             :label="$t('settings.style.fonts.components.monospace')"
             @update:model-value="v => updateFont('fontMonospace', v)"
           />

src/services/style_setter/style_setter.js

@@ -32,16 +32,17 @@ export const createStyleSheet = (id, priority = 1000) => {
         newRule = newRule.replace(/backdrop-filter:[^;]+;/g, '') // Remove backdrop-filter
       }
 
-      // firefox doesn't like invalid selectors
+      if (newRule.startsWith('::-webkit')) {
-      if (
+        if (typeof CSS.supports !== 'function') return
-        !CSS.supports?.('selector(::-webkit-scrollbar)') &&
+        // firefox doesn't like invalid selectors
-        !CSS.supports?.('selector(::-webkit-scrollbar-button)') &&
+        const fullWebkitScrollbarSupport =
-        !CSS.supports?.('selector(::-webkit-resizer)') &&
+          CSS.supports('selector(::-webkit-scrollbar)') &&
-        !CSS.supports?.('selector(::-webkit-scrollbar-thumb)') &&
+          CSS.supports('selector(::-webkit-scrollbar-button)') &&
-        newRule.startsWith('::-webkit')
+          CSS.supports('selector(::-webkit-resizer)') &&
-      ) {
+          CSS.supports('selector(::-webkit-scrollbar-thumb)')
-        return
+        if (!fullWebkitScrollbarSupport) return
       }
+
       this.rules.push(
         newRule.replace(/var\(--shadowFilter\)[^;]*;/g, ''), // Remove shadowFilter references
       )
@@ -59,7 +60,13 @@ export const adoptStyleSheets = throttle(() => {
       .sort((a, b) => a.priority - b.priority)
       .map((sheet) => {
         const css = new CSSStyleSheet()
-        sheet.rules.forEach((r) => css.insertRule(r))
+        sheet.rules.forEach((r) => {
+          try {
+            css.insertRule(r)
+          } catch (e) {
+            console.warn('Error inserting rule:', e, r)
+          }
+        })
         return css
       })
   } else {

src/stores/interface.js

@@ -17,6 +17,16 @@ import {
 } from 'src/services/theme_data/theme_data.service.js'
 import { convertTheme2To3 } from 'src/services/theme_data/theme2_to_theme3.js'
 
+const GENERIC_FONT_NAMES = new Set([
+  'serif',
+  'sans-serif',
+  'system-ui',
+  'cursive',
+  'fantasy',
+  'math',
+  'monospace',
+])
+
 export const useInterfaceStore = defineStore('interface', {
   state: () => ({
     localFonts: null,
@@ -246,7 +256,7 @@ export const useInterfaceStore = defineStore('interface', {
       }
     },
     setFontsList(value) {
-      this.localFonts = [...new Set(value.map((font) => font)).values()]
+      this.localFonts = [...new Set(value.map(({ family }) => family)).values()]
     },
     queryLocalFonts() {
       if (this.localFonts !== null) return
@@ -706,11 +716,14 @@ export const useInterfaceStore = defineStore('interface', {
         Object.entries(fontMap).forEach(([font, component]) => {
           const family = mergedConfig[`font${font}`]
           const variable = font === 'Monospace' ? '--monoFont' : '--font'
-          if (family) {
+          if (typeof family === 'string') {
+            const familyString = GENERIC_FONT_NAMES.has(family)
+              ? family
+              : `"${family}"`
             hacks.push({
               component,
               directives: {
-                [variable]: `generic | "${family}"`,
+                [variable]: `generic | ${familyString}`,
               },
             })
           }