Merge branch 'statamic:6.x' into feature/taxonomy-sort-field-direction

Author: finnjsmith

lang/en/permissions.php

@@ -88,6 +88,7 @@
     'assign_user_groups' => 'Assign groups to users',
     'assign_roles' => 'Assign roles to users',
     'impersonate_users' => 'Impersonate users',
+    'impersonate_users_desc' => 'Allows logging in as any user, including super admins. Grant this permission with caution.',
 
     'group_updates' => 'Updates',
     'view_updates' => 'View updates',

resources/js/components/assets/Editor/Editor.vue

@@ -157,8 +157,8 @@
                         </ui-badge>
                     </div>
                     <div class="flex items-center space-x-3 rtl:space-x-reverse">
-                        <ui-button icon="chevron-left" @click="navigateToPreviousAsset" v-tooltip="__('Previous Asset')" />
-                        <ui-button icon="chevron-right" @click="navigateToNextAsset" v-tooltip="__('Next Asset')" />
+                        <ui-button v-if="showNavigation" icon="chevron-left" @click="navigateToPreviousAsset" v-tooltip="__('Previous Asset')" />
+                        <ui-button v-if="showNavigation" icon="chevron-right" @click="navigateToNextAsset" v-tooltip="__('Next Asset')" />
                         <ui-button variant="primary" icon="save" @click="saveAndClose" v-if="!readOnly" :text="__('Save')" />
                     </div>
                 </div>
@@ -239,6 +239,10 @@ export default {
             type: Boolean,
             default: true,
         },
+        showNavigation: {
+            type: Boolean,
+            default: true,
+        },
         allowDeleting: {
             type: Boolean,
             default() {

resources/js/components/blueprints/Section.vue

@@ -54,7 +54,18 @@
                             class="font-mono text-sm"
                             v-model="editingSection.handle"
                             @input="handleSyncedWithDisplay = false"
-                        />
+                        >
+                            <template #append>
+                                <ui-button
+                                    icon="sync"
+                                    size="sm"
+                                    variant="ghost"
+                                    :aria-label="__('Regenerate from: :field', { field: __('Display') })"
+                                    @click="regenerateHandle"
+                                    v-tooltip="__('Regenerate from: :field', { field: __('Display') })"
+                                />
+                            </template>
+                        </ui-input>
                     </ui-field>
                     <ui-field :label="__('Instructions')">
                         <ui-input type="text" v-model="editingSection.instructions" />
@@ -219,15 +230,15 @@ export default {
         },
     },
 
-    created() {
-        // This logic isn't ideal, but it was better than passing along a 'isNew' boolean and having
-        // to deal with stripping it out and making it not new, etc. Good enough for a quick win.
-        if (!this.section.handle || this.section.handle == 'new_section' || this.section.handle == 'new_set') {
-            this.handleSyncedWithDisplay = true;
-        }
-    },
-
     methods: {
+        regenerateHandle() {
+            if (!this.editingSection) {
+                return;
+            }
+
+            this.editingSection.handle = snake_case(this.editingSection.display);
+        },
+
         fieldLinked(field) {
             this.section.fields.push(field);
             this.$toast.success(__('Field added'));
@@ -250,6 +261,7 @@ export default {
         },
 
         edit() {
+            this.handleSyncedWithDisplay = !this.section.handle || ['new_section', 'new_set'].includes(this.section.handle);
             this.editingSection = {
                 display: this.section.display,
                 handle: this.section.handle,

resources/js/components/blueprints/Tab.vue

@@ -32,7 +32,18 @@
                         <Input ref="title" :model-value="display" @update:model-value="fieldUpdated('display', $event)" />
                     </Field>
                     <Field :label="__('Handle')" class="form-group field-w-100">
-                        <Input class="font-mono" :model-value="handle" @update:model-value="fieldUpdated('handle', $event)" />
+                        <Input class="font-mono" :model-value="handle" @update:model-value="fieldUpdated('handle', $event)">
+                            <template #append>
+                                <Button
+                                    icon="sync"
+                                    size="sm"
+                                    variant="ghost"
+                                    :aria-label="__('Regenerate from: :field', { field: __('Title') })"
+                                    @click="regenerateHandle"
+                                    v-tooltip="__('Regenerate from: :field', { field: __('Title') })"
+                                />
+                            </template>
+                        </Input>
                     </Field>
                     <Field v-if="showInstructions" :label="__('Instructions')" class="form-group field-w-100">
                         <Input :model-value="instructions" @update:model-value="fieldUpdated('instructions', $event)" />
@@ -103,14 +114,6 @@ export default {
         };
     },
 
-    created() {
-        // This logic isn't ideal, but it was better than passing along a 'isNew' boolean and having
-        // to deal with stripping it out and making it not new, etc. Good enough for a quick win.
-        if (!this.handle || this.handle == 'new_tab' || this.handle == 'new_set_group') {
-            this.handleSyncedWithDisplay = true;
-        }
-    },
-
     computed: {
         isActive() {
             return this.currentTab === this.tab._id;
@@ -149,7 +152,16 @@ export default {
     },
 
     methods: {
+        regenerateHandle() {
+            this.handle = snake_case(this.display);
+        },
+
         edit() {
+            this.display = this.tab.display;
+            this.handle = this.tab.handle;
+            this.instructions = this.tab.instructions;
+            this.icon = this.tab.icon;
+            this.handleSyncedWithDisplay = !this.tab.handle || ['new_tab', 'new_set_group'].includes(this.tab.handle);
             this.editing = true;
         },
 

resources/js/components/fieldtypes/assets/Asset.js

@@ -16,11 +16,16 @@ export default {
             type: Boolean,
             default: true,
         },
+        siblings: {
+            type: Array,
+            default: () => [],
+        },
     },
 
     data() {
         return {
             editing: false,
+            editingId: null,
         };
     },
 
@@ -73,9 +78,10 @@ export default {
 
         edit() {
             if (this.readOnly) return;
-            if (this.asset.invalid) return;
+            if (this.asset?.invalid) return;
 
             this.editing = true;
+            this.editingId = this.asset?.id ?? null;
         },
 
         remove() {
@@ -98,6 +104,7 @@ export default {
 
         closeEditor() {
             this.editing = false;
+            this.editingId = null;
         },
 
         assetSaved(asset) {
@@ -108,10 +115,28 @@ export default {
         actionCompleted(successful, response) {
             if (successful === false) return;
             const id = response.ids[0] || null;
-            if (id && id !== this.asset.id) {
-                this.$emit('id-changed', id);
+            if (id && id !== this.editingId) {
+                this.$emit('id-changed', this.editingId, id);
             }
             this.closeEditor();
         },
+
+        navigateToPrevious() {
+            const index = this.siblings.findIndex((asset) => asset.id === this.editingId);
+            if (index <= 0) return;
+
+            const previousId = this.siblings[index - 1].id;
+            this.editingId = null;
+            this.$nextTick(() => (this.editingId = previousId));
+        },
+
+        navigateToNext() {
+            const index = this.siblings.findIndex((asset) => asset.id === this.editingId);
+            if (index === -1 || index >= this.siblings.length - 1) return;
+
+            const nextId = this.siblings[index + 1].id;
+            this.editingId = null;
+            this.$nextTick(() => (this.editingId = nextId));
+        },
     },
 };

resources/js/components/fieldtypes/assets/AssetRow.vue

@@ -57,9 +57,12 @@
                 />
 
                 <asset-editor
-                    v-if="editing"
-                    :id="asset.id"
+                    v-if="editingId"
+                    :id="editingId"
                     :allow-deleting="false"
+                    :show-navigation="siblings.length > 1"
+                    @previous="navigateToPrevious"
+                    @next="navigateToNext"
                     @closed="closeEditor"
                     @saved="assetSaved"
                     @action-completed="actionCompleted"

resources/js/components/fieldtypes/assets/AssetTile.vue

@@ -9,9 +9,12 @@
         :title="asset.invalid ? invalidLabel : label"
     >
         <asset-editor
-            v-if="editing"
-            :id="asset.id"
+            v-if="editingId"
+            :id="editingId"
             :allow-deleting="false"
+            :show-navigation="siblings.length > 1"
+            @previous="navigateToPrevious"
+            @next="navigateToNext"
             @closed="closeEditor"
             @saved="assetSaved"
             @action-completed="actionCompleted"

resources/js/components/fieldtypes/assets/AssetsFieldtype.vue

@@ -116,13 +116,14 @@
                                 v-for="asset in assets"
                                 :key="asset.id"
                                 :asset="asset"
+                                :siblings="assets"
                                 :read-only="isReadOnly"
                                 :show-filename="config.show_filename"
                                 :show-set-alt="showSetAlt"
                                 :checkerboard-mode="checkerboardMode"
                                 @updated="assetUpdated"
                                 @removed="assetRemoved"
-                                @id-changed="idChanged(asset.id, $event)"
+                                @id-changed="idChanged"
                             >
                             </asset-tile>
                         </div>
@@ -156,12 +157,13 @@
                                         v-for="asset in assets"
                                         :key="asset.id"
                                         :asset="asset"
+                                        :siblings="assets"
                                         :read-only="isReadOnly"
                                         :show-filename="config.show_filename"
                                         :show-set-alt="showSetAlt"
                                         @updated="assetUpdated"
                                         @removed="assetRemoved"
-                                        @id-changed="idChanged(asset.id, $event)"
+                                        @id-changed="idChanged"
                                     />
                                 </tbody>
                             </sortable-list>

resources/js/components/fieldtypes/bard/Image.vue

@@ -55,6 +55,7 @@
                 :id="assetId"
                 :showToolbar="false"
                 :allow-deleting="false"
+                :show-navigation="false"
                 @closed="closeEditor"
                 @saved="editorAssetSaved"
                 @actionCompleted="actionCompleted"

resources/views/graphql/graphiql.blade.php

@@ -23,11 +23,11 @@
         </style>
         <link
             rel="stylesheet"
-            href="https://esm.sh/graphiql/dist/style.css"
+            href="https://esm.sh/graphiql@5.2.2/dist/style.css"
         >
         <link
             rel="stylesheet"
-            href="https://esm.sh/@graphiql/plugin-explorer/dist/style.css"
+            href="https://esm.sh/@graphiql/plugin-explorer@5.1.1/dist/style.css"
         >
 
         @if (!$introspection)
@@ -39,19 +39,19 @@
         <script type="importmap">
             {
               "imports": {
-                "react": "https://esm.sh/react@19.1.0",
-                "react/": "https://esm.sh/react@19.1.0/",
+                "react": "https://esm.sh/react@19.2.5",
+                "react/": "https://esm.sh/react@19.2.5/",
 
-                "react-dom": "https://esm.sh/react-dom@19.1.0",
-                "react-dom/": "https://esm.sh/react-dom@19.1.0/",
+                "react-dom": "https://esm.sh/react-dom@19.2.5",
+                "react-dom/": "https://esm.sh/react-dom@19.2.5/",
 
-                "graphiql": "https://esm.sh/graphiql?standalone&external=react,react-dom,@graphiql/react,graphql",
-                "graphiql/": "https://esm.sh/graphiql/",
-                "@graphiql/plugin-explorer": "https://esm.sh/@graphiql/plugin-explorer?standalone&external=react,@graphiql/react,graphql",
-                "@graphiql/react": "https://esm.sh/@graphiql/react?standalone&external=react,react-dom,graphql,@graphiql/toolkit,@emotion/is-prop-valid",
+                "graphiql": "https://esm.sh/graphiql@5.2.2?standalone&external=react,react-dom,@graphiql/react,graphql",
+                "graphiql/": "https://esm.sh/graphiql@5.2.2/",
+                "@graphiql/plugin-explorer": "https://esm.sh/@graphiql/plugin-explorer@5.1.1?standalone&external=react,@graphiql/react,graphql",
+                "@graphiql/react": "https://esm.sh/@graphiql/react@0.37.3?standalone&external=react,react-dom,graphql,@graphiql/toolkit,@emotion/is-prop-valid",
 
-                "@graphiql/toolkit": "https://esm.sh/@graphiql/toolkit?standalone&external=graphql",
-                "graphql": "https://esm.sh/graphql@16.11.0",
+                "@graphiql/toolkit": "https://esm.sh/@graphiql/toolkit@0.11.3?standalone&external=graphql",
+                "graphql": "https://esm.sh/graphql@16.13.2",
                 "@emotion/is-prop-valid": "data:text/javascript,"
               }
             }