keystonejs/keystone-classic

Can't show S3 file preview and/or URL on Admin UI

Open

#4,070 opened on Mar 7, 2017

View on GitHub
 (4 comments) (3 reactions) (0 assignees)JavaScript (2,288 forks)batch import
bughelp wanted

Repository metrics

Stars
 (14,656 stars)
PR merge metrics
 (No merged PRs in 30d)

Description

I'm trying to create a model with a S3 file field whose URL I want to show on the Admin UI list. Currently, the list only shows the file name.

I'm using Keystone 4.0.0-beta.5.

Model code:

const keystone = require('keystone');
const storage = require('../config/s3');
const { Types } = keystone.Field;

const Car = new keystone.List('Car', {
  autokey: { path: 'slug', from: 'model', unique: true },
  defaultSort: 'model,year'
});

Car.add({
  model: { type: Types.Text, required: true, initial: true },
  brand: { type: Types.Relationship, ref: 'Brand', required: true, initial: true, index: true },
  year: { type: Types.Text, required: true, initial: true },
  image: {
    type: Types.File,
    storage: storage
  },
  imageUrl: {
    type: Types.Url,
    hidden: true,
    noedit: true,
    watch: true,
    value: () => this.image.url,
    format: url => url
  }
});

Car.defaultColumns = 'brand, model, year|10%, imageUrl';

Car.register();

Storage config:

const keystone = require('keystone');
require('dotenv').load();

module.exports = new keystone.Storage({
  adapter: require('keystone-storage-adapter-s3'),
  s3: {
    key: process.env.AWS_ACCESS_KEY,
    secret: process.env.AWS_SECRET_KEY,
    bucket: process.env.S3_BUCKET,
    path: '/keystone',
    headers: {
      'x-amz-acl': 'public-read'
    }
  },
  schema: {
    path: true,
    url: true
  }
});

I have tried creating that imageUrl field, tried placing a format function inside the image field, none of those options worked and I couldn't see the console.logs placed inside these functions, when I did. Issue #4064 is similar to this one.

Contributor guide