[6.x] Blueprints fieldtype so we can style the Blueprints setting (#11755)

Co-authored-by: Jason Varga <jason@pixelfear.com>

Author: jackmcdade

resources/js/bootstrap/fieldtypes.js

@@ -14,6 +14,7 @@ import AssetsFieldtype from '../components/fieldtypes/assets/AssetsFieldtype.vue
 import AssetsIndexFieldtype from '../components/fieldtypes/assets/AssetsIndexFieldtype.vue';
 import AssetFolderFieldtype from '../components/fieldtypes/AssetFolderFieldtype.vue';
 import BardButtonsSettingFieldtype from '../components/fieldtypes/bard/BardButtonsSettingFieldtype.vue';
+import BlueprintsFieldtype from '../components/fieldtypes/BlueprintsFieldtype.vue';
 import ButtonGroupFieldtype from '../components/fieldtypes/ButtonGroupFieldtype.vue';
 import CheckboxesFieldtype from '../components/fieldtypes/CheckboxesFieldtype.vue';
 import Routes from '../components/collections/Routes.vue';
@@ -85,6 +86,7 @@ export default function registerFieldtypes(app) {
     );
     app.component('bard_buttons_setting-fieldtype', BardButtonsSettingFieldtype);
     app.component('button_group-fieldtype', ButtonGroupFieldtype);
+    app.component('blueprints-fieldtype', BlueprintsFieldtype);
     app.component('checkboxes-fieldtype', CheckboxesFieldtype);
     app.component(
         'code-fieldtype',

resources/js/components/fieldtypes/BlueprintsFieldtype.vue

@@ -0,0 +1,30 @@
+<script>
+import Fieldtype from './Fieldtype.vue';
+import { Button } from '@statamic/ui';
+
+export default {
+    mixins: [Fieldtype],
+
+    components: {
+        Button,
+    },
+};
+</script>
+
+<template>
+    <div class="mt-4 flex items-center gap-2">
+        <Button
+            v-if="config.options.length > 0"
+            :href="blueprint.edit_url"
+            variant="filled"
+            size="sm"
+            v-for="blueprint in config.options"
+            :key="blueprint.handle"
+        >
+            {{ blueprint.title }}
+        </Button>
+        <Button size="sm" :href="config.all_blueprints_url">
+            {{ __('View All Blueprints') }}
+        </Button>
+    </div>
+</template>

src/Fieldtypes/Blueprints.php

@@ -0,0 +1,10 @@
+<?php
+
+namespace Statamic\Fieldtypes;
+
+use Statamic\Fields\Fieldtype;
+
+class Blueprints extends Fieldtype
+{
+    protected $categories = ['special'];
+}

src/Http/Controllers/CP/Collections/CollectionsController.php

@@ -456,12 +456,13 @@ protected function editFormBlueprint($collection)
                     'blueprints' => [
                         'display' => __('Blueprints'),
                         'instructions' => __('statamic::messages.collections_blueprint_instructions'),
-                        'type' => 'html',
-                        'html' => ''.
-                            '<div class="text-xs">'.
-                            '   <span class="rtl:ml-4 ltr:mr-4">'.$collection->entryBlueprints()->map(fn ($bp) => __($bp->title()))->join(', ').'</span>'.
-                            '   <a href="'.cp_route('collections.blueprints.index', $collection).'" class="text-blue">'.__('Edit').'</a>'.
-                            '</div>',
+                        'type' => 'blueprints',
+                        'options' => $collection->entryBlueprints()->map(fn ($bp) => [
+                            'handle' => $bp->handle(),
+                            'title' => __($bp->title()),
+                            'edit_url' => cp_route('collections.blueprints.edit', [$collection->handle(), $bp->handle()]),
+                        ])->values()->all(),
+                        'all_blueprints_url' => cp_route('collections.blueprints.index', $collection->handle()),
                     ],
                     'default_publish_state' => [
                         'display' => __('Publish by Default'),

src/Providers/ExtensionServiceProvider.php

@@ -66,6 +66,7 @@ class ExtensionServiceProvider extends ServiceProvider
         Fieldtypes\Assets\Assets::class,
         Fieldtypes\Bard::class,
         Fieldtypes\Bard\Buttons::class,
+        Fieldtypes\Blueprints::class,
         Fieldtypes\ButtonGroup::class,
         Fieldtypes\Checkboxes::class,
         Fieldtypes\Code::class,