Adding a few promise.all concurrent fetches to FetchInitialData. #2234 (#2270)

src/shared/components/community/community.tsx

@@ -253,8 +253,10 @@ export class Community extends Component<
 
     const sort = getSortTypeFromQuery(urlSort);
 
-    let postsResponse: RequestState<GetPostsResponse> = EMPTY_REQUEST;
+    let postsFetch: Promise<RequestState<GetPostsResponse>> =
-    let commentsResponse: RequestState<GetCommentsResponse> = EMPTY_REQUEST;
+      Promise.resolve(EMPTY_REQUEST);
+    let commentsFetch: Promise<RequestState<GetCommentsResponse>> =
+      Promise.resolve(EMPTY_REQUEST);
 
     if (dataType === DataType.Post) {
       const getPostsForm: GetPosts = {
@@ -266,7 +268,7 @@ export class Community extends Component<
         saved_only: false,
       };
 
-      postsResponse = await client.getPosts(getPostsForm);
+      postsFetch = client.getPosts(getPostsForm);
     } else {
       const getCommentsForm: GetComments = {
         community_name: communityName,
@@ -276,13 +278,21 @@ export class Community extends Component<
         saved_only: false,
       };
 
-      commentsResponse = await client.getComments(getCommentsForm);
+      commentsFetch = client.getComments(getCommentsForm);
     }
 
+    const communityFetch = client.getCommunity(communityForm);
+
+    const [communityRes, commentsRes, postsRes] = await Promise.all([
+      communityFetch,
+      commentsFetch,
+      postsFetch,
+    ]);
+
     return {
-      communityRes: await client.getCommunity(communityForm),
+      communityRes,
-      commentsRes: commentsResponse,
+      commentsRes,
-      postsRes: postsResponse,
+      postsRes,
     };
   }
 

src/shared/components/home/home.tsx

@@ -323,8 +323,10 @@ export class Home extends Component<any, HomeState> {
       site.site_view.local_site.default_post_listing_type;
     const sort = getSortTypeFromQuery(urlSort, site.my_user);
 
-    let postsRes: RequestState<GetPostsResponse> = EMPTY_REQUEST;
+    let postsFetch: Promise<RequestState<GetPostsResponse>> =
-    let commentsRes: RequestState<GetCommentsResponse> = EMPTY_REQUEST;
+      Promise.resolve(EMPTY_REQUEST);
+    let commentsFetch: Promise<RequestState<GetCommentsResponse>> =
+      Promise.resolve(EMPTY_REQUEST);
 
     if (dataType === DataType.Post) {
       const getPostsForm: GetPosts = {
@@ -335,7 +337,7 @@ export class Home extends Component<any, HomeState> {
         saved_only: false,
       };
 
-      postsRes = await client.getPosts(getPostsForm);
+      postsFetch = client.getPosts(getPostsForm);
     } else {
       const getCommentsForm: GetComments = {
         limit: fetchLimit,
@@ -344,7 +346,7 @@ export class Home extends Component<any, HomeState> {
         saved_only: false,
       };
 
-      commentsRes = await client.getComments(getCommentsForm);
+      commentsFetch = client.getComments(getCommentsForm);
     }
 
     const trendingCommunitiesForm: ListCommunities = {
@@ -353,10 +355,18 @@ export class Home extends Component<any, HomeState> {
       limit: trendingFetchLimit,
     };
 
-    return {
+    const trendingCommunitiesFetch = client.listCommunities(
-      trendingCommunitiesRes: await client.listCommunities(
       trendingCommunitiesForm,
-      ),
+    );
+
+    const [postsRes, commentsRes, trendingCommunitiesRes] = await Promise.all([
+      postsFetch,
+      commentsFetch,
+      trendingCommunitiesFetch,
+    ]);
+
+    return {
+      trendingCommunitiesRes,
       commentsRes,
       postsRes,
     };

src/shared/components/post/post-listing.tsx

@@ -165,16 +165,21 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
   constructor(props: any, context: any) {
     super(props, context);
 
-    if (UserService.Instance.myUserInfo) {
-      this.state.imageExpanded =
-        UserService.Instance.myUserInfo.local_user_view.local_user.auto_expand;
-    }
-
     this.handleEditPost = this.handleEditPost.bind(this);
     this.handleEditCancel = this.handleEditCancel.bind(this);
     this.handleReportSubmit = this.handleReportSubmit.bind(this);
   }
 
+  componentDidMount(): void {
+    if (UserService.Instance.myUserInfo) {
+      this.setState({
+        imageExpanded:
+          UserService.Instance.myUserInfo.local_user_view.local_user
+            .auto_expand,
+      });
+    }
+  }
+
   componentWillReceiveProps(nextProps: PostListingProps) {
     if (this.props !== nextProps) {
       this.setState({

src/shared/components/post/post.tsx

@@ -263,9 +263,14 @@ export class Post extends Component<any, PostState> {
       commentsForm.parent_id = id;
     }
 
+    const [postRes, commentsRes] = await Promise.all([
+      client.getPost(postForm),
+      client.getComments(commentsForm),
+    ]);
+
     return {
-      postRes: await client.getPost(postForm),
+      postRes,
-      commentsRes: await client.getComments(commentsForm),
+      commentsRes,
     };
   }