Merge remote-tracking branch 'origin/develop' into shigusegubu-themes3

changelog.d/emoji-upload.-zip.add

@@ -0,0 +1 @@
+Added a way to upload new packs from a URL or ZIP file via the admin-fe

package.json

@@ -17,7 +17,7 @@
     "lint-fix": "eslint --fix src test/unit/specs test/e2e/specs"
   },
   "dependencies": {
-    "@babel/runtime": "7.27.1",
+    "@babel/runtime": "7.28.2",
     "@chenfengyuan/vue-qrcode": "2.0.0",
     "@fortawesome/fontawesome-svg-core": "6.7.2",
     "@fortawesome/free-regular-svg-icons": "6.7.2",
@@ -54,10 +54,10 @@
     "vuex": "4.1.0"
   },
   "devDependencies": {
-    "@babel/core": "7.27.1",
+    "@babel/core": "7.28.0",
-    "@babel/eslint-parser": "7.27.1",
+    "@babel/eslint-parser": "7.28.0",
-    "@babel/plugin-transform-runtime": "7.27.1",
+    "@babel/plugin-transform-runtime": "7.28.0",
-    "@babel/preset-env": "7.27.2",
+    "@babel/preset-env": "7.28.0",
     "@babel/register": "7.27.1",
     "@ungap/event-target": "0.2.4",
     "@vitejs/plugin-vue": "^5.2.1",
@@ -70,13 +70,13 @@
     "@vue/test-utils": "2.4.6",
     "autoprefixer": "10.4.21",
     "babel-plugin-lodash": "3.3.4",
-    "chai": "5.2.0",
+    "chai": "5.2.1",
     "chalk": "5.4.1",
     "chromedriver": "135.0.4",
     "connect-history-api-fallback": "2.0.0",
     "cross-spawn": "7.0.6",
     "custom-event-polyfill": "1.0.7",
-    "eslint": "9.26.0",
+    "eslint": "9.33.0",
     "vue-eslint-parser": "10.1.3",
     "eslint-config-standard": "17.1.0",
     "eslint-formatter-friendly": "7.0.0",
@@ -91,9 +91,9 @@
     "iso-639-1": "3.1.5",
     "lodash": "4.17.21",
     "msw": "2.10.2",
-    "nightwatch": "3.12.1",
+    "nightwatch": "3.12.2",
     "playwright": "1.52.0",
-    "postcss": "8.5.3",
+    "postcss": "8.5.6",
     "postcss-html": "^1.5.0",
     "postcss-scss": "^4.0.6",
     "sass": "1.89.2",

src/components/settings_modal/admin_tabs/emoji_tab.js

@@ -32,7 +32,10 @@ const EmojiTab = {
       newPackName: '',
       deleteModalVisible: false,
       remotePackInstance: '',
-      remotePackDownloadAs: ''
+      remotePackDownloadAs: '',
+
+      remotePackURL: '',
+      remotePackFile: null
     }
   },
 
@@ -220,7 +223,7 @@ const EmojiTab = {
         .then(data => data.json())
         .then(resp => {
           if (resp === 'ok') {
-            this.$refs.dlPackPopover.hidePopover()
+            this.$refs.downloadPackPopover.hidePopover()
 
             return this.refreshPackList()
           } else {
@@ -232,6 +235,47 @@ const EmojiTab = {
           this.remotePackDownloadAs = ''
         })
     },
+    downloadRemoteURLPack () {
+      this.$store.state.api.backendInteractor.downloadRemoteEmojiPackZIP({
+        url: this.remotePackURL, packName: this.newPackName
+      })
+        .then(data => data.json())
+        .then(resp => {
+          if (resp === 'ok') {
+            this.$refs.additionalRemotePopover.hidePopover()
+
+            return this.refreshPackList()
+          } else {
+            this.displayError(resp.error)
+            return Promise.reject(resp)
+          }
+        }).then(() => {
+          this.packName = this.newPackName
+          this.newPackName = ''
+          this.remotePackURL = ''
+        })
+    },
+    downloadRemoteFilePack () {
+      this.$store.state.api.backendInteractor.downloadRemoteEmojiPackZIP({
+        file: this.remotePackFile[0], packName: this.newPackName
+      })
+        .then(data => data.json())
+        .then(resp => {
+          if (resp === 'ok') {
+            this.$refs.additionalRemotePopover.hidePopover()
+
+            return this.refreshPackList()
+          } else {
+            this.displayError(resp.error)
+            return Promise.reject(resp)
+          }
+        }).then(() => {
+          this.packName = this.newPackName
+          this.newPackName = ''
+          this.remotePackURL = ''
+        })
+    },
+
     displayError (msg) {
       useInterfaceStore().pushGlobalNotice({
         messageKey: 'admin_dash.emoji.error',

src/components/settings_modal/admin_tabs/emoji_tab.vue

@@ -62,6 +62,64 @@
               </template>
             </Popover>
           </button>
+          <button
+            class="button button-default emoji-panel-additional-actions"
+            @click="$refs.additionalRemotePopover.showPopover"
+          >
+            <FAIcon
+              icon="chevron-down"
+            />
+
+            <Popover
+              ref="additionalRemotePopover"
+              popover-class="emoji-tab-edit-popover popover-default"
+              trigger="click"
+              placement="bottom"
+              bound-to-selector=".emoji-tab"
+              :bound-to="{ x: 'container' }"
+              :offset="{ y: 5 }"
+            >
+              <template #content>
+                <div class="emoji-tab-popover-input">
+                  <h3>{{ $t('admin_dash.emoji.new_pack_name') }}</h3>
+                  <input
+                    v-model="newPackName"
+                    :placeholder="$t('admin_dash.emoji.new_pack_name')"
+                    class="input"
+                  >
+                  <h3>Import pack from URL</h3>
+                  <input
+                    v-model="remotePackURL"
+                    class="input"
+                    placeholder="Pack .zip URL"
+                  >
+                  <button
+                    class="button button-default btn emoji-tab-popover-button"
+                    type="button"
+                    :disabled="newPackName.trim() === '' || remotePackURL.trim() === ''"
+                    @click="downloadRemoteURLPack"
+                  >
+                    Import
+                  </button>
+                  <h3>Import pack from a file</h3>
+                  <input
+                    type="file"
+                    accept="application/zip"
+                    class="emoji-tab-popover-file input"
+                    @change="remotePackFile = $event.target.files"
+                  >
+                  <button
+                    class="button button-default btn emoji-tab-popover-button"
+                    type="button"
+                    :disabled="newPackName.trim() === '' || remotePackFile === null || remotePackFile.length === 0"
+                    @click="downloadRemoteFilePack"
+                  >
+                    Import
+                  </button>
+                </div>
+              </template>
+            </Popover>
+          </button>
         </li>
 
         <h3>{{ $t('admin_dash.emoji.emoji_packs') }}</h3>
@@ -240,12 +298,12 @@
                 v-if="pack.remote !== undefined"
                 class="button button-default btn"
                 type="button"
-                @click="$refs.dlPackPopover.showPopover"
+                @click="$refs.downloadPackPopover.showPopover"
               >
                 {{ $t('admin_dash.emoji.download_pack') }}
 
                 <Popover
-                  ref="dlPackPopover"
+                  ref="downloadPackPopover"
                   trigger="click"
                   placement="bottom"
                   bound-to-selector=".emoji-tab"

src/components/user_card/user_card.scss

@@ -423,11 +423,6 @@
 
   --emoji-size: 1.8em;
 
-  img {
-    object-fit: contain;
-    vertical-align: middle;
-  }
-
   .user-profile-field-add,
   .user-profile-field {
     display: flex;

src/components/user_card/user_card.vue

@@ -458,7 +458,8 @@
             >
               <template #default="inputProps">
                 <input
-                  v-model="newFields[i].name" :placeholder="$t('settings.profile_fields.name')"
+                  v-model="newFields[i].name"
+                  :placeholder="$t('settings.profile_fields.name')"
                   v-bind="propsToNative(inputProps)"
                   class="input"
                 >

src/services/api/api.service.js

@@ -122,6 +122,7 @@ const PLEROMA_EMOJI_IMPORT_FS_URL = '/api/pleroma/emoji/packs/import'
 const PLEROMA_EMOJI_PACKS_URL = (page, pageSize) => `/api/v1/pleroma/emoji/packs?page=${page}&page_size=${pageSize}`
 const PLEROMA_EMOJI_PACK_URL = (name) => `/api/v1/pleroma/emoji/pack?name=${name}`
 const PLEROMA_EMOJI_PACKS_DL_REMOTE_URL = '/api/v1/pleroma/emoji/packs/download'
+const PLEROMA_EMOJI_PACKS_DL_REMOTE_ZIP_URL = '/api/v1/pleroma/emoji/packs/download_zip'
 const PLEROMA_EMOJI_PACKS_LS_REMOTE_URL =
   (url, page, pageSize) => `/api/v1/pleroma/emoji/packs/remote?url=${url}&page=${page}&page_size=${pageSize}`
 const PLEROMA_EMOJI_UPDATE_FILE_URL = (name) => `/api/v1/pleroma/emoji/packs/files?name=${name}`
@@ -224,6 +225,9 @@ const updateProfile = ({ credentials, params }) => {
         formData.append(name + `[${i}][value]`, param.value)
       })
     } else {
+      if (typeof params[name] === 'object') {
+        console.warning('Object detected in updateProfile API call. This will not work, use updateProfileJSON instead.')
+      }
       formData.append(name, params[name]);
     }
   }
@@ -237,6 +241,17 @@ const updateProfile = ({ credentials, params }) => {
     .then((data) => parseUser(data))
 }
 
+const updateProfileJSON = ({ credentials, params }) => {
+  return promisedRequest({
+    url: MASTODON_PROFILE_UPDATE_URL,
+    credentials,
+    payload: params ,
+    method: 'PATCH'
+  })
+    .then((data) => data.json())
+    .then((data) => parseUser(data))
+}
+
 // Params needed:
 // nickname
 // email
@@ -1932,6 +1947,18 @@ const downloadRemoteEmojiPack = ({ instance, packName, as }) => {
   )
 }
 
+const downloadRemoteEmojiPackZIP = ({ url, packName, file }) => {
+  const data = new FormData()
+  if (file) data.set('file', file)
+  if (url) data.set('url', url)
+  data.set('name', packName)
+
+  return fetch(
+    PLEROMA_EMOJI_PACKS_DL_REMOTE_ZIP_URL,
+    { method: 'POST', body: data }
+  )
+}
+
 const saveEmojiPackMetadata = ({ name, newData }) => {
   return fetch(
     PLEROMA_EMOJI_PACK_URL(name),
@@ -2060,6 +2087,7 @@ const apiService = {
   getCaptcha,
   updateProfileImages,
   updateProfile,
+  updateProfileJSON,
   importMutes,
   importBlocks,
   importFollows,
@@ -2137,6 +2165,7 @@ const apiService = {
   deleteEmojiFile,
   listRemoteEmojiPacks,
   downloadRemoteEmojiPack,
+  downloadRemoteEmojiPackZIP,
   fetchBookmarkFolders,
   createBookmarkFolder,
   updateBookmarkFolder,

src/stores/serverSideStorage.js

@@ -508,7 +508,7 @@ export const useServerSideStorageStore = defineStore('serverSideStorage', {
       this.updateCache({ username: window.vuex.state.users.currentUser.fqn })
       const params = { pleroma_settings_store: { 'pleroma-fe': this.cache } }
       window.vuex.state.api.backendInteractor
-        .updateProfile({ params })
+        .updateProfileJSON({ params })
         .then((user) => {
           this.setServerSideStorage(user)
           this.dirty = false