[5.x] Conditional fields in asset blueprints

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

@@ -330,11 +330,6 @@ export default {
  this.$axios.get(url).then(response => {
  const data = response.data.data;
  this.asset = data;
-
- // If there are no fields, it will be an empty array when PHP encodes
- // it into JSON on the server. We'll ensure it's always an object.
- this.values = _.isArray(data.values) ? {} : data.values;
-
  this.meta = data.meta;
  this.actionUrl = data.actionUrl;
  this.actions = data.actions;
@@ -347,10 +342,41 @@ export default {
  .flatten(true)
  .value();
 
+ // If there are no fields, it will be an empty array when PHP encodes
+ // it into JSON on the server. We'll ensure it's always an object.
+ const blueprintValues = _.isArray(data.values) ? {} : data.values;
+ const assetValues = _.chain(this.asset)
+ .pick(['filename', 'basename', 'extension', 'path', 'mimeType', 'width', 'height', 'duration'])
+ .omit(_.pluck(this.fields, 'handle'))
+ .value();
+
+ // Merge asset file data with asset blueprint data
+ this.values = { ...assetValues, ...blueprintValues };
+
+ // Append hidden fields to blueprint to allow field conditions
+ const hiddenFields = Object.keys(assetValues).map(handle => this.createHiddenField(handle));
+ this.fieldset = this.extendBlueprintFields(this.fieldset, hiddenFields);
+
  this.loading = false;
  });
  },
 
+ createHiddenField(handle) {
+ return {
+ handle,
+ display: handle,
+ type: 'text',
+ if: { 'internal_should_not_exist_in_blueprint': 'equals true' }
+ };
+ },
+
+ extendBlueprintFields(blueprint, fields) {
+ const extended = clone(blueprint);
+ const existingFields = data_get(extended, 'tabs.0.sections.0.fields');
+ existingFields?.push(...fields);
+ return extended;
+ },
+
  openFocalPointEditor() {
  this.showFocalPointEditor = true;
  },

src/Assets/Asset.php

@@ -1071,12 +1071,12 @@ protected function defaultAugmentedRelations()
  return $this->selectedQueryRelations;
  }
 
- private function hasDimensions()
+ public function hasDimensions()
  {
  return $this->isImage() || $this->isSvg() || $this->isVideo();
  }
 
- private function hasDuration()
+ public function hasDuration()
  {
  return $this->isAudio() || $this->isVideo();
  }

src/Http/Resources/CP/Assets/Asset.php

@@ -23,6 +23,7 @@ public function toArray($request)
  'size' => Str::fileSizeForHumans($this->size()),
  'lastModified' => $this->lastModified()->inPreferredFormat(),
  'lastModifiedRelative' => $this->lastModified()->diffForHumans(),
+ 'mimeType' => $this->mimeType(),
  'isImage' => $this->isImage(),
  'isSvg' => $this->isSvg(),
  'isAudio' => $this->isAudio(),
@@ -31,10 +32,21 @@ public function toArray($request)
  'isPdf' => $this->isPdf(),
  'isPreviewable' => $this->isPreviewable(),
 
- $this->mergeWhen($this->isImage() || $this->isSvg(), function () {
+ $this->mergeWhen($this->hasDimensions(), function () {
  return [
  'width' => $this->width(),
  'height' => $this->height(),
+ ];
+ }),
+
+ $this->mergeWhen($this->hasDuration(), function () {
+ return [
+ 'duration' => $this->duration(),
+ ];
+ }),
+
+ $this->mergeWhen($this->isImage() || $this->isSvg(), function () {
+ return [
  'preview' => $this->previewUrl(),
  'thumbnail' => $this->thumbnailUrl('small'),
  ];