Refactor image uploading

flow-typed/npm/shortid_vx.x.x.js

@@ -0,0 +1,108 @@
+// flow-typed signature: 7b3061d921714787fed00295ae4e0433
+// flow-typed version: <<STUB>>/shortid_v2.2.8/flow_v0.66.0
+
+/**
+ * This is an autogenerated libdef stub for:
+ *
+ *   'shortid'
+ *
+ * Fill this stub out by replacing all the `any` types.
+ *
+ * Once filled out, we encourage you to share your work with the
+ * community by sending a pull request to:
+ * https://github.com/flowtype/flow-typed
+ */
+
+declare module 'shortid' {
+  declare module.exports: any;
+}
+
+/**
+ * We include stubs for each file inside this npm package in case you need to
+ * require those files directly. Feel free to delete any files that aren't
+ * needed.
+ */
+declare module 'shortid/lib/alphabet' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/build' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/decode' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/encode' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/index' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/is-valid' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/random/random-byte-browser' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/random/random-byte' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/random/random-from-seed' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/util/cluster-worker-id-browser' {
+  declare module.exports: any;
+}
+
+declare module 'shortid/lib/util/cluster-worker-id' {
+  declare module.exports: any;
+}
+
+// Filename aliases
+declare module 'shortid/index' {
+  declare module.exports: $Exports<'shortid'>;
+}
+declare module 'shortid/index.js' {
+  declare module.exports: $Exports<'shortid'>;
+}
+declare module 'shortid/lib/alphabet.js' {
+  declare module.exports: $Exports<'shortid/lib/alphabet'>;
+}
+declare module 'shortid/lib/build.js' {
+  declare module.exports: $Exports<'shortid/lib/build'>;
+}
+declare module 'shortid/lib/decode.js' {
+  declare module.exports: $Exports<'shortid/lib/decode'>;
+}
+declare module 'shortid/lib/encode.js' {
+  declare module.exports: $Exports<'shortid/lib/encode'>;
+}
+declare module 'shortid/lib/index.js' {
+  declare module.exports: $Exports<'shortid/lib/index'>;
+}
+declare module 'shortid/lib/is-valid.js' {
+  declare module.exports: $Exports<'shortid/lib/is-valid'>;
+}
+declare module 'shortid/lib/random/random-byte-browser.js' {
+  declare module.exports: $Exports<'shortid/lib/random/random-byte-browser'>;
+}
+declare module 'shortid/lib/random/random-byte.js' {
+  declare module.exports: $Exports<'shortid/lib/random/random-byte'>;
+}
+declare module 'shortid/lib/random/random-from-seed.js' {
+  declare module.exports: $Exports<'shortid/lib/random/random-from-seed'>;
+}
+declare module 'shortid/lib/util/cluster-worker-id-browser.js' {
+  declare module.exports: $Exports<'shortid/lib/util/cluster-worker-id-browser'>;
+}
+declare module 'shortid/lib/util/cluster-worker-id.js' {
+  declare module.exports: $Exports<'shortid/lib/util/cluster-worker-id'>;
+}

iris/models/thread.js

@@ -10,7 +10,7 @@ const { NEW_DOCUMENTS, parseRange, createChangefeed } = require('./utils');
 import { deleteMessagesInThread } from '../models/message';
 import { turnOffAllThreadNotifications } from '../models/usersThreads';
 import type { PaginationOptions } from '../utils/paginate-arrays';
-import type { DBThread } from 'shared/types';
+import type { DBThread, FileUpload } from 'shared/types';
 import type { Timeframe } from './utils';
 
 export const getThread = (threadId: string): Promise<DBThread> => {
@@ -401,12 +401,7 @@ export const deleteThread = (threadId: string): Promise<Boolean> => {
     });
 };
 
-type File = {
-  name: string,
-  type: string,
-  size: number,
-  path: string,
-};
+type File = FileUpload;
 
 type Attachment = {
   attachmentType: string,

iris/models/user.js

@@ -4,7 +4,7 @@ import { uploadImage } from '../utils/s3';
 import { createNewUsersSettings } from './usersSettings';
 import { sendNewUserWelcomeEmailQueue } from 'shared/bull/queues';
 import type { PaginationOptions } from '../utils/paginate-arrays';
-import type { DBUser } from 'shared/types';
+import type { DBUser, FileUpload } from 'shared/types';
 
 type GetUserInput = {
   id?: string,
@@ -246,11 +246,11 @@ const getUsersThreadCount = (
 
 export type EditUserInput = {
   input: {
-    file?: any,
+    file?: FileUpload,
     name?: string,
     description?: string,
     website?: string,
-    coverFile?: string,
+    coverFile?: FileUpload,
     username?: string,
     timezone?: number,
   },

iris/mutations/directMessageThread/createDirectMessageThread.js

@@ -12,6 +12,7 @@ import {
   setUserLastSeenInDirectMessageThread,
   createMemberInDirectMessageThread,
 } from '../../models/usersDirectMessageThreads';
+import type { FileUpload } from 'shared/types';
 
 type DMThreadInput = {
   input: {
@@ -22,12 +23,7 @@ type DMThreadInput = {
       content: {
         body: string,
       },
-      file?: {
-        name: string,
-        type: string,
-        size: number,
-        path: string,
-      },
+      file?: FileUpload,
     },
   },
 };
@@ -84,7 +80,7 @@ export default async (
       };
 
       return await storeMessage(messageWithThread, currentUser.id);
-    } else if (message.messageType === 'media') {
+    } else if (message.messageType === 'media' && message.file) {
       const url = await uploadImage(message.file, 'threads', threadId);
 
       // build a new message object with a new file field with metadata
@@ -95,9 +91,9 @@ export default async (
           body: url,
         },
         file: {
-          name: message.file && message.file.name,
-          size: message.file && message.file.size,
-          type: message.file && message.file.type,
+          name: message.file && message.file.filename,
+          size: null,
+          type: message.file && message.file.mimetype,
         },
       });
 

iris/mutations/message/addMessage.js

@@ -11,6 +11,7 @@ import {
   createParticipantWithoutNotificationsInThread,
 } from '../../models/usersThreads';
 import addCommunityMember from '../communityMember/addCommunityMember';
+import type { FileUpload } from 'shared/types';
 
 type AddMessageInput = {
   message: {
@@ -20,12 +21,7 @@ type AddMessageInput = {
     content: {
       body: string,
     },
-    file?: {
-      name: string,
-      type: string,
-      size: number,
-      path: string,
-    },
+    file?: FileUpload,
   },
 };
 
@@ -57,12 +53,21 @@ export default async (
   // construct the shape of the object to be stored in the db
   let messageForDb = Object.assign({}, message);
   if (message.file && message.messageType === 'media') {
+    const { file } = message;
+
     const fileMetaData = {
-      name: message.file.name,
-      size: message.file.size,
-      type: message.file.type,
+      name: file.filename,
+      size: null,
+      type: file.mimetype,
     };
-    const url = await uploadImage(message.file, 'threads', message.threadId);
+
+    const url = await uploadImage(file, 'threads', message.threadId);
+
+    if (!url)
+      return new UserError(
+        "We weren't able to upload this image, please try again"
+      );
+
     messageForDb = Object.assign({}, messageForDb, {
       content: {
         body: url,

iris/mutations/thread/publishThread.js

@@ -8,18 +8,14 @@ import { getCommunityRecurringPayments } from '../../models/recurringPayment';
 import { getChannels } from '../../models/channel';
 import { publishThread, editThread } from '../../models/thread';
 import { createParticipantInThread } from '../../models/usersThreads';
+import type { FileUpload } from 'shared/types';
 
 type Attachment = {
   attachmentType: string,
   data: string,
 };
 
-type File = {
-  name: string,
-  type: string,
-  size: number,
-  path: string,
-};
+type File = FileUpload;
 
 type PublishThreadInput = {
   thread: {
@@ -157,7 +153,9 @@ export default async (
   // if the original mutation input contained files to upload
   const urls = await Promise.all(
     // upload each of the files to s3
-    thread.filesToUpload.map(file => uploadImage(file, 'threads', dbThread.id))
+    thread.filesToUpload.map(
+      file => file && uploadImage(file, 'threads', dbThread.id)
+    )
   );
 
   // Replace the local image srcs with the remote image src

iris/package.json

@@ -3,8 +3,9 @@
     "algoliasearch": "^3.24.7",
     "apollo-engine": "1.x",
     "apollo-local-query": "^0.3.0",
-    "apollo-upload-client": "^5.1.0",
-    "apollo-upload-server": "^2.0.4",
+    "apollo-upload-client": "^8.0.0",
+    "apollo-upload-server": "^5.0.0",
+    "aws-sdk": "2.200.0",
     "axios": "^0.16.2",
     "babel-plugin-replace-dynamic-import-runtime": "^1.0.2",
     "babel-plugin-styled-components": "^1.1.7",
@@ -105,9 +106,9 @@
     "rethinkdb-inspector": "^0.3.3",
     "rethinkdb-migrate": "^1.1.0",
     "rethinkdbdash": "^2.3.29",
-    "s3-image-uploader": "^1.0.7",
     "serialize-javascript": "^1.4.0",
     "session-rethinkdb": "^2.0.0",
+    "shortid": "^2.2.8",
     "slate": "^0.20.1",
     "slate-markdown": "0.1.0",
     "slugg": "^1.1.0",

iris/routes/middlewares/index.js

@@ -37,7 +37,11 @@ import bodyParser from 'body-parser';
 middlewares.use(bodyParser.json());
 
 import { apolloUploadExpress } from 'apollo-upload-server';
-middlewares.use(apolloUploadExpress());
+middlewares.use(
+  apolloUploadExpress({
+    maxFileSize: 52428800, // 50mb
+  })
+);
 
 import session from 'shared/middlewares/session';
 middlewares.use(session);

iris/types/Community.js

@@ -124,16 +124,16 @@ const Community = /* GraphQL */ `
 		slug: String!
 		description: String!
 		website: String
-		file: File
-		coverFile: File
+		file: Upload
+		coverFile: Upload
 	}
 
 	input EditCommunityInput {
 		name: String
 		description: String
 		website: String
-		file: File
-		coverFile: File
+		file: Upload
+		coverFile: Upload
 		communityId: ID!
 	}
 

iris/types/DirectMessageThread.js

@@ -47,7 +47,7 @@ const DirectMessageThread = /* GraphQL */ `
 		messageType: MessageType!
 		threadType: String!
 		content: ContentInput!
-		file: File
+		file: Upload
 	}
 
 	input DirectMessageThreadInput {

iris/types/Message.js

@@ -41,7 +41,7 @@ const Message = /* GraphQL */ `
 		threadType: ThreadTypes!
 		messageType: MessageTypes!
 		content: MessageContentInput!
-		file: File
+		file: Upload
 	}
 
 	extend type Query {