Keystone cloud files (#5868)

* Added support for integration with Keystone Cloud files

.changeset/sixty-grapes-roll.md

@@ -0,0 +1,8 @@
+---
+'@keystone-next/example-assets-cloud': minor
+'@keystone-next/fields': minor
+'@keystone-next/keystone': minor
+'@keystone-next/types': minor
+---
+
+Added experimental support for the integration with keystone cloud files

examples-staging/assets-cloud/keystone.ts

@@ -20,6 +20,9 @@ export default config({
   images: {
     upload: 'keystone-cloud',
   },
+  files: {
+    upload: 'keystone-cloud',
+  },
   experimental: {
     keystoneCloud: {
       apiKey: KEYSTONE_CLOUD_API_KEY,

examples-staging/assets-cloud/schema.graphql

@@ -9,6 +9,7 @@ type Post {
   publishDate: String
   author: Author
   hero: ImageFieldOutput
+  attachment: FileFieldOutput
 }
 
 enum PostStatusType {
@@ -33,6 +34,13 @@ enum ImageExtension {
   gif
 }
 
+interface FileFieldOutput {
+  filename: String!
+  filesize: Int!
+  ref: String!
+  src: String!
+}
+
 type LocalImageFieldOutput implements ImageFieldOutput {
   id: ID!
   filesize: Int!
@@ -43,6 +51,13 @@ type LocalImageFieldOutput implements ImageFieldOutput {
   src: String!
 }
 
+type LocalFileFieldOutput implements FileFieldOutput {
+  filename: String!
+  filesize: Int!
+  ref: String!
+  src: String!
+}
+
 input PostWhereInput {
   AND: [PostWhereInput!]
   OR: [PostWhereInput!]
@@ -119,6 +134,7 @@ input PostUpdateInput {
   publishDate: String
   author: AuthorRelateToOneInput
   hero: ImageFieldInput
+  attachment: FileFieldInput
 }
 
 input AuthorRelateToOneInput {
@@ -138,6 +154,11 @@ The `Upload` scalar type represents a file upload.
 """
 scalar Upload
 
+input FileFieldInput {
+  upload: Upload
+  ref: String
+}
+
 input PostsUpdateInput {
   id: ID!
   data: PostUpdateInput
@@ -150,6 +171,7 @@ input PostCreateInput {
   publishDate: String
   author: AuthorRelateToOneInput
   hero: ImageFieldInput
+  attachment: FileFieldInput
 }
 
 input PostsCreateInput {

examples-staging/assets-cloud/schema.prisma

@@ -9,19 +9,22 @@ generator client {
 }
 
 model Post {
-  id             Int       @id @default(autoincrement())
-  title          String?
-  status         String?
-  content        String?
-  publishDate    DateTime?
-  author         Author?   @relation("Post_author", fields: [authorId], references: [id])
-  authorId       Int?      @map("author")
-  hero_filesize  Int?
-  hero_extension String?
-  hero_width     Int?
-  hero_height    Int?
-  hero_mode      String?
-  hero_id        String?
+  id                  Int       @id @default(autoincrement())
+  title               String?
+  status              String?
+  content             String?
+  publishDate         DateTime?
+  author              Author?   @relation("Post_author", fields: [authorId], references: [id])
+  authorId            Int?      @map("author")
+  hero_filesize       Int?
+  hero_extension      String?
+  hero_width          Int?
+  hero_height         Int?
+  hero_mode           String?
+  hero_id             String?
+  attachment_filesize Int?
+  attachment_mode     String?
+  attachment_filename String?
 
   @@index([authorId])
 }

examples-staging/assets-cloud/schema.ts

@@ -1,5 +1,5 @@
 import { createSchema, list } from '@keystone-next/keystone/schema';
-import { select, relationship, text, timestamp, image } from '@keystone-next/fields';
+import { select, relationship, text, timestamp, image, file } from '@keystone-next/fields';
 
 export const lists = createSchema({
   Post: list({
@@ -16,6 +16,7 @@ export const lists = createSchema({
       publishDate: timestamp(),
       author: relationship({ ref: 'Author.posts', many: false }),
       hero: image(),
+      attachment: file(),
     },
   }),
   Author: list({

packages-next/keystone/src/lib/context/createContext.ts

@@ -27,7 +27,7 @@ export function makeCreateContext({
   gqlNamesByList: Record<string, GqlNames>;
 }) {
   const images = createImagesContext(config);
-  const files = createFilesContext(config.files);
+  const files = createFilesContext(config);
   // We precompute these helpers here rather than every time createContext is called
   // because they involve creating a new GraphQLSchema, creating a GraphQL document AST(programmatically, not by parsing) and validating the
   // note this isn't as big of an optimisation as you would imagine(at least in comparison with the rest of the system),

packages-next/keystone/src/lib/context/createFilesContext.ts

@@ -2,11 +2,16 @@ import path from 'path';
 import crypto from 'crypto';
 import { pipeline } from 'stream';
 import filenamify from 'filenamify';
-import { FilesConfig, FilesContext } from '@keystone-next/types';
+import { KeystoneConfig, FilesContext } from '@keystone-next/types';
 import fs from 'fs-extra';
 
-import { parseFileRef } from '@keystone-next/utils-legacy';
+import { parseFileRef, isLocalAsset, isKeystoneCloudAsset } from '@keystone-next/utils-legacy';
 import slugify from '@sindresorhus/slugify';
+import {
+  buildKeystoneCloudFileSrc,
+  uploadFileToKeystoneCloud,
+  getFileFromKeystoneCloud,
+} from '../keystone-cloud/assets';
 
 const DEFAULT_BASE_URL = '/files';
 const DEFAULT_STORAGE_PATH = './public/files';
@@ -41,31 +46,70 @@ const generateSafeFilename = (
   return `${urlSafeName}-${id}`;
 };
 
-export function createFilesContext(config?: FilesConfig): FilesContext | undefined {
-  if (!config) {
+export function createFilesContext(config: KeystoneConfig): FilesContext | undefined {
+  if (!config.files) {
     return;
   }
 
-  const { baseUrl = DEFAULT_BASE_URL, storagePath = DEFAULT_STORAGE_PATH } = config.local || {};
+  const { files, experimental } = config;
+  const { baseUrl = DEFAULT_BASE_URL, storagePath = DEFAULT_STORAGE_PATH } = files.local || {};
+  const {
+    apiKey = '',
+    graphqlApiEndpoint = '',
+    restApiEndpoint = '',
+  } = experimental?.keystoneCloud || {};
 
-  fs.mkdirSync(storagePath, { recursive: true });
+  if (isLocalAsset(files.upload)) {
+    fs.mkdirSync(storagePath, { recursive: true });
+  }
 
   return {
-    getSrc: (mode, filename) => {
+    getSrc: async (mode, filename) => {
+      if (isKeystoneCloudAsset(mode)) {
+        return await buildKeystoneCloudFileSrc({ apiKey, graphqlApiEndpoint, filename });
+      }
+
       return `${baseUrl}/${filename}`;
     },
     getDataFromRef: async (ref: string) => {
       const fileRef = parseFileRef(ref);
+
       if (!fileRef) {
         throw new Error('Invalid file reference');
       }
+
+      const { mode, filename } = fileRef;
+
+      if (isKeystoneCloudAsset(mode)) {
+        const { filesize } = await getFileFromKeystoneCloud({
+          apiKey,
+          filename,
+          restApiEndpoint,
+        });
+
+        return { filesize, ...fileRef };
+      }
+
       const { size: filesize } = await fs.stat(path.join(storagePath, fileRef.filename));
+
       return { filesize, ...fileRef };
     },
-    getDataFromStream: async (stream, filename) => {
-      const { upload: mode } = config;
-      const safeFilename = generateSafeFilename(filename, config.transformFilename);
-      const writeStream = fs.createWriteStream(path.join(storagePath, safeFilename));
+    getDataFromStream: async (stream, originalFilename) => {
+      const { upload: mode } = files;
+      const filename = generateSafeFilename(originalFilename, files.transformFilename);
+
+      if (isKeystoneCloudAsset(mode)) {
+        const { filesize } = await uploadFileToKeystoneCloud({
+          apiKey,
+          stream,
+          filename,
+          restApiEndpoint,
+        });
+
+        return { mode, filesize, filename };
+      }
+
+      const writeStream = fs.createWriteStream(path.join(storagePath, filename));
       const pipeStreams: Promise<void> = new Promise((resolve, reject) => {
         pipeline(stream, writeStream, err => {
           if (err) {
@@ -78,10 +122,10 @@ export function createFilesContext(config?: FilesConfig): FilesContext | undefin
 
       try {
         await pipeStreams;
-        const { size: filesize } = await fs.stat(path.join(storagePath, safeFilename));
-        return { mode, filesize, filename: safeFilename };
+        const { size: filesize } = await fs.stat(path.join(storagePath, filename));
+        return { mode, filesize, filename };
       } catch (e) {
-        await fs.remove(path.join(storagePath, safeFilename));
+        await fs.remove(path.join(storagePath, filename));
         throw e;
       }
     },