send data to Lambda via API Gateway async-labs#18

msahin12 · Apr 23, 2019 · 1ef1e2a · 1ef1e2a
1 parent a23eebf
commit 1ef1e2a
Show file tree

Hide file tree

Showing 8 changed files with 86 additions and 66 deletions.
diff --git a/README.md b/README.md
@@ -177,7 +177,8 @@ To deploy the two apps (`api` and `app`), follow the instructions below.
         "PRODUCTION_URL_APP": "https://your-app-url.com",
         "PRODUCTION_URL_API": "https://your-api-url.com",
         "BUCKET_FOR_POSTS": "xxxxxx",
-        "BUCKET_FOR_TEAM_AVATARS": "xxxxxx"
+        "BUCKET_FOR_TEAM_AVATARS": "xxxxxx",
+        "LAMBDA_API_ENDPOINT": "xxxxxx",
         
     },
     "alias": "your-app-url.com",

diff --git a/app/components/discussions/CreateDiscussionForm.tsx b/app/components/discussions/CreateDiscussionForm.tsx
@@ -14,7 +14,7 @@ import NProgress from 'nprogress';
 import React from 'react';
 
 import notify from '../../lib/notifier';
-import { Discussion, Post, Store } from '../../lib/store';
+import { Store } from '../../lib/store';
 import PostEditor from '../posts/PostEditor';
 import MemberChooser from '../users/MemberChooser';
 
@@ -116,22 +116,33 @@ class CreateDiscussionForm extends React.Component<Props, State> {
               </FormControl>
               <p />
               <br />
-              <PostEditor
-                content={this.state.content}
-                onChanged={content => this.setState({ content })}
-                members={Array.from(store.currentTeam.members.values())}
-              />
-              <p />
-              <br />
-              <div style={{ margin: '20px 0px' }}>
+              <div>
+                <Button
+                  type="submit"
+                  variant="contained"
+                  color="primary"
+                  disabled={this.state.disabled}
+                >
+                  Create Discussion
+                </Button>
+                {isMobile ? <p /> : null}
                 <Button
                   variant="outlined"
                   onClick={this.handleClose}
                   disabled={this.state.disabled}
+                  style={{ marginLeft: isMobile ? '0px' : '20px' }}
                 >
                   Cancel
                 </Button>{' '}
-                <p />
+              </div>
+              <p />
+              <PostEditor
+                content={this.state.content}
+                onChanged={content => this.setState({ content })}
+                members={Array.from(store.currentTeam.members.values())}
+              />
+              <p />
+              <div>
                 <Button
                   type="submit"
                   variant="contained"
@@ -141,6 +152,17 @@ class CreateDiscussionForm extends React.Component<Props, State> {
                   Create Discussion
                 </Button>
                 {isMobile ? <p /> : null}
+                <Button
+                  variant="outlined"
+                  onClick={this.handleClose}
+                  disabled={this.state.disabled}
+                  style={{ marginLeft: isMobile ? '0px' : '20px' }}
+                >
+                  Cancel
+                </Button>{' '}
+                <p />
+                <br />
+                <br />
               </div>
             </form>
           </div>
@@ -180,27 +202,28 @@ class CreateDiscussionForm extends React.Component<Props, State> {
       return;
     }
 
-    if (!memberIds || memberIds.length < 1) {
-      notify('Please assign at least one person to this Discussion.');
-      return;
-    }
-
+    // if (!memberIds || memberIds.length < 1) {
+    //   notify('Please assign at least one person to this Discussion.');
+    //   return;
+    // }
+    this.setState({ disabled: true });
     NProgress.start();
-    try {
-      this.setState({ disabled: true });
 
+    try {
       const discussion = await currentTeam.addDiscussion({
         name,
         memberIds,
         notificationType,
       });
 
+      // await discussion.addPost(content);
+
       const post = await discussion.addPost(content);
 
       if (discussion.notificationType === 'email') {
-        const userIdsForLambda = discussion.memberIds.filter(d => d !== discussion.createdUserId);
-        console.log(userIdsForLambda);
-        await discussion.sendUserIdsToLambda({
+        const userIdsForLambda = discussion.memberIds.filter(m => m !== discussion.createdUserId);
+        console.log(discussion.notificationType, userIdsForLambda);
+        await discussion.sendDataToLambdaApiMethod({
           discussionName: discussion.name,
           postContent: post.content,
           authorName: post.user.displayName,

diff --git a/app/components/discussions/EditDiscussionForm.tsx b/app/components/discussions/EditDiscussionForm.tsx
@@ -157,10 +157,10 @@ class EditDiscussionForm extends React.Component<Props, State> {
       memberIds.push(discussion.store.currentUser._id);
     }
 
-    if (!memberIds || memberIds.length < 1) {
-      notify('Please assign at least one person to this Issue.');
-      return;
-    }
+    // if (!memberIds || memberIds.length < 1) {
+    //   notify('Please assign at least one person to this Issue.');
+    //   return;
+    // }
 
     if (!notificationType) {
       notify('Please select notification type.');

diff --git a/app/components/posts/PostForm.tsx b/app/components/posts/PostForm.tsx
@@ -115,22 +115,6 @@ class PostForm extends React.Component<MyProps, MyState> {
           />
           <p />
           <div style={{ margin: '20px 0px' }}>
-            {readOnly ? null : (
-              <React.Fragment>
-                <Button
-                  type="submit"
-                  variant="contained"
-                  color="primary"
-                  disabled={this.state.disabled}
-                  onClick={() => {
-                    this.setState({ isDraft: false });
-                  }}
-                >
-                  {isEditing && !post.isDraft ? 'Save changes' : 'Publish Post'}
-                </Button>
-                {isMobile ? <p /> : null}
-              </React.Fragment>
-            )}
             {post ? (
               <Button
                 variant="outlined"
@@ -223,4 +207,4 @@ class PostForm extends React.Component<MyProps, MyState> {
   };
 }
 
-export default withStyles(styles)<MyProps>(inject('store')(observer(PostForm)));
+export default withStyles(styles)(inject('store')(observer(PostForm)));
diff --git a/app/lib/api/sendRequestAndGetResponse.ts b/app/lib/api/sendRequestAndGetResponse.ts
@@ -24,6 +24,8 @@ export default async function sendRequestAndGetResponse(path, opts: any = {}) {
 
   const qs = (opts.qs && `?${makeQueryString(opts.qs)}`) || '';
 
+  console.log(`${path}${qs}`);
+
   const response = await fetch(
     externalServer ? `${path}${qs}` : `${getRootUrl()}${path}${qs}`,
     Object.assign({ method: 'POST', credentials: 'include' }, opts, { headers }),

diff --git a/app/lib/api/team-member.ts b/app/lib/api/team-member.ts
@@ -102,7 +102,7 @@ export const toggleTheme = data =>
     body: JSON.stringify(data),
   });
 
-export const sendUserIdsToLambda = data =>
+export const sendDataToLambda = data =>
   sendRequestAndGetResponse(`${LAMBDA_API_ENDPOINT}/`, {
     externalServer: true,
     body: JSON.stringify(data),

diff --git a/app/lib/store/discussion.ts b/app/lib/store/discussion.ts
@@ -6,7 +6,7 @@ import {
   deletePost,
   editDiscussion,
   getPostList,
-  sendUserIdsToLambda,
+  sendDataToLambda,
 } from '../api/team-member';
 import { Post, Store, Team } from './index';
 
@@ -33,6 +33,7 @@ class Discussion {
     this.name = params.name;
     this.slug = params.slug;
     this.memberIds.replace(params.memberIds || []);
+    this.notificationType = params.notificationType;
 
     if (params.initialPosts) {
       this.setInitialPosts(params.initialPosts);
@@ -45,8 +46,7 @@ class Discussion {
 
   public setInitialPosts(posts) {
     const postObjs = posts.map(t => new Post({ discussion: this, store: this.store, ...t }));
-
-    this.posts.replace(postObjs);
+    this.posts.replace(postObjs.filter(p => p.createdUserId === this.store.currentUser._id));
   }
 
   public async loadPosts() {
@@ -62,11 +62,8 @@ class Discussion {
 
       runInAction(() => {
         const postObjs = posts.map(t => new Post({ discussion: this, store: this.store, ...t }));
-        this.posts.replace(postObjs);
+        this.posts.replace(postObjs.filter(p => p.createdUserId === this.store.currentUser._id));
       });
-    } catch (error) {
-      console.error(error);
-      throw error;
     } finally {
       runInAction(() => {
         this.isLoadingPosts = false;
@@ -99,19 +96,28 @@ class Discussion {
     }
   }
 
-  public addPostToLocalCache(data): Post {
+  public addPostToLocalCache(data) {
+    const oldPost = this.posts.find(t => t._id === data._id);
+    if (oldPost) {
+      this.posts.remove(oldPost);
+    }
+
     const postObj = new Post({ discussion: this, store: this.store, ...data });
 
-    if (postObj.discussion.memberIds.includes(this.store.currentUser._id)) {
-      this.posts.push(postObj);
+    if (postObj.createdUserId !== this.store.currentUser._id) {
+      return;
     }
 
+    this.posts.push(postObj);
+
     return postObj;
   }
 
   public editPostFromLocalCache(data) {
-    const post = this.posts.find(t => t._id === data.id);
-    post.changeLocalCache(data);
+    const post = this.posts.find(t => t._id === data._id);
+    if (post) {
+      post.changeLocalCache(data);
+    }
   }
 
   public removePostFromLocalCache(postId) {
@@ -125,10 +131,6 @@ class Discussion {
       content,
     });
 
-    runInAction(() => {
-      this.addPostToLocalCache(post);
-    });
-
     return new Promise<Post>(resolve => {
       runInAction(() => {
         const obj = this.addPostToLocalCache(post);
@@ -148,13 +150,19 @@ class Discussion {
     });
   }
 
-  public async sendUserIdsToLambda({ discussionName, postContent, authorName, userIds }) {
-    await sendUserIdsToLambda({
-      discussionName,
-      postContent,
-      authorName,
-      userIds,
-    });
+  public async sendDataToLambdaApiMethod({ discussionName, postContent, authorName, userIds }) {
+    console.log(discussionName, authorName, postContent, userIds);
+    try {
+      await sendDataToLambda({
+        discussionName,
+        postContent,
+        authorName,
+        userIds,
+      });
+    } catch (error) {
+      console.error(error);
+      throw error;
+    }
   }
 }
 

diff --git a/app/pages/_document.tsx b/app/pages/_document.tsx
@@ -10,6 +10,7 @@ const {
   StripePublishableKey,
   BUCKET_FOR_POSTS,
   BUCKET_FOR_TEAM_AVATARS,
+  LAMBDA_API_ENDPOINT,
 } = process.env;
 
 const env = {
@@ -19,6 +20,7 @@ const env = {
   StripePublishableKey,
   BUCKET_FOR_POSTS,
   BUCKET_FOR_TEAM_AVATARS,
+  LAMBDA_API_ENDPOINT,
 };
 
 class MyDocument extends Document {