From a6120addd8adbdcd253be592676ef45fcae47386 Mon Sep 17 00:00:00 2001
From: CianLR <cian.ruane1@gmail.com>
Date: Mon, 18 Feb 2019 10:31:36 +0000
Subject: [PATCH 1/2] Add ability for user to stick custom CSS into their post
 titles and bodies

---
 chump/src/components/account_edit.tsx        | 42 ++++++++++++++++++
 chump/src/components/create_article_form.tsx |  2 +-
 chump/src/components/feed.tsx                |  2 +-
 chump/src/components/post.tsx                | 11 ++++-
 chump/src/components/search_results.tsx      |  2 +-
 chump/src/components/single_post.tsx         |  2 +-
 chump/src/components/user_feed.tsx           |  2 +-
 chump/src/models/edit_user.ts                |  3 ++
 chump/src/models/posts.ts                    | 45 ++++++++++++++++----
 services/database/rabble_schema.sql          |  2 +
 services/database/users_servicer.py          |  7 ++-
 services/feed/main.go                        |  5 ++-
 services/proto/database.proto                |  3 ++
 services/proto/feed.proto                    |  4 ++
 services/proto/users.proto                   |  2 +
 services/users/update.py                     |  2 +
 skinny/handlers.go                           |  6 +--
 17 files changed, 121 insertions(+), 21 deletions(-)

diff --git a/chump/src/components/account_edit.tsx b/chump/src/components/account_edit.tsx
index d1d82692..1b41000c 100644
--- a/chump/src/components/account_edit.tsx
+++ b/chump/src/components/account_edit.tsx
@@ -9,6 +9,8 @@ interface IAccountEditState {
   displayName: string;
   currentPassword: string;
   newPassword: string;
+  postBodyCss: string;
+  postTitleCss: string;
   privateAccount: boolean;
   cancel: boolean;
 }
@@ -27,6 +29,8 @@ export class AccountEdit extends React.Component<IAccountEditProps, IAccountEdit
       currentPassword: "",
       displayName: "",
       newPassword: "",
+      postBodyCss: "",
+      postTitleCss: "",
       privateAccount: false,
     };
 
@@ -34,6 +38,8 @@ export class AccountEdit extends React.Component<IAccountEditProps, IAccountEdit
     this.handleNewPassword = this.handleNewPassword.bind(this);
     this.handleBio = this.handleBio.bind(this);
     this.handleDisplayName = this.handleDisplayName.bind(this);
+    this.handlePostTitleCss = this.handlePostTitleCss.bind(this);
+    this.handlePostBodyCss = this.handlePostBodyCss.bind(this);
     this.handlePrivate = this.handlePrivate.bind(this);
     this.handleUpdate = this.handleUpdate.bind(this);
     this.handleCancel = this.handleCancel.bind(this);
@@ -63,6 +69,8 @@ export class AccountEdit extends React.Component<IAccountEditProps, IAccountEdit
       this.state.currentPassword,
       this.state.newPassword,
       this.state.privateAccount,
+      this.state.postTitleCss,
+      this.state.postBodyCss
     ).then((response: IEditUserResult) => {
       if (!response.success) {
         alert("Error editing: " + response.error);
@@ -113,6 +121,26 @@ export class AccountEdit extends React.Component<IAccountEditProps, IAccountEdit
                   onChange={this.handleBio}
                 />
             </div>
+            <div className="pure-control-group">
+                <label htmlFor="name">{"Post Title CSS"}</label>
+                <textarea
+                  id="post_title_css"
+                  placeholder='{"color": "red"}'
+                  className="pure-input-2-3 bio-form"
+                  value={this.state.postTitleCss}
+                  onChange={this.handlePostTitleCss}
+                />
+            </div>
+            <div className="pure-control-group">
+                <label htmlFor="name">{"Post Body CSS"}</label>
+                <textarea
+                  id="post_body_css"
+                  placeholder='{"color": "red"}'
+                  className="pure-input-2-3 bio-form"
+                  value={this.state.postBodyCss}
+                  onChange={this.handlePostBodyCss}
+                />
+            </div>
 
             <div className="pure-control-group">
               <label htmlFor="private">{config.private_account}</label>
@@ -203,6 +231,20 @@ export class AccountEdit extends React.Component<IAccountEditProps, IAccountEdit
     });
   }
 
+  private handlePostTitleCss(event: React.ChangeEvent<HTMLTextAreaElement>) {
+    const target = event.target;
+    this.setState({
+      postTitleCss: target.value,
+    });
+  }
+
+  private handlePostBodyCss(event: React.ChangeEvent<HTMLTextAreaElement>) {
+    const target = event.target;
+    this.setState({
+      postBodyCss: target.value,
+    });
+  }
+
   private handleUpdateError() {
     alert("Error attempting to update.");
   }
diff --git a/chump/src/components/create_article_form.tsx b/chump/src/components/create_article_form.tsx
index e81bca16..cf74db87 100644
--- a/chump/src/components/create_article_form.tsx
+++ b/chump/src/components/create_article_form.tsx
@@ -82,7 +82,7 @@ export class CreateArticleForm extends React.Component<IFormProps, IFormState> {
           </div>
           <div className="pure-g" key={1}>
             <HashRouter>
-            <Post username={this.props.username} blogPost={this.state.post} preview={true}/>
+            <Post username={this.props.username} blogPost={this.state.post} preview={true} customCss={true}/>
             </HashRouter>
           </div>
         </RModal>
diff --git a/chump/src/components/feed.tsx b/chump/src/components/feed.tsx
index 7db06eee..07f2f952 100644
--- a/chump/src/components/feed.tsx
+++ b/chump/src/components/feed.tsx
@@ -41,7 +41,7 @@ export class Feed extends React.Component<IFeedProps, IFeedState> {
     return this.state.publicBlog.map((e: IParsedPost, i: number) => {
       return (
         <div className="pure-g" key={i}>
-          <Post username={this.props.username} blogPost={e} preview={false}/>
+          <Post username={this.props.username} blogPost={e} preview={false} customCss={false}/>
         </div>
       );
     });
diff --git a/chump/src/components/post.tsx b/chump/src/components/post.tsx
index 58720886..4d1175eb 100644
--- a/chump/src/components/post.tsx
+++ b/chump/src/components/post.tsx
@@ -10,6 +10,7 @@ interface IPostProps {
   blogPost: IParsedPost;
   username: string;
   preview: boolean;
+  customCss: boolean;
 }
 
 interface IPostState {
@@ -47,6 +48,9 @@ export class Post extends React.Component<IPostProps, IPostState> {
         this.props.preview === true) {
       LikeButton = false;
     }
+    // Set custom CSS for user if enabled.
+    let bodyStyle = this.props.customCss ? this.props.blogPost.body_css : undefined;
+    let titleStyle = this.props.customCss ? this.props.blogPost.title_css : undefined;
     return (
       <div className="blog-post-holder">
         <div className="pure-u-5-24"/>
@@ -55,10 +59,15 @@ export class Post extends React.Component<IPostProps, IPostState> {
           <Link
             to={`/@${this.props.blogPost.author}/${this.props.blogPost.global_id}`}
             className="article-title"
+            style={titleStyle}
           >
             {this.props.blogPost.title}
           </Link>
-          <p className="article-body" dangerouslySetInnerHTML={{ __html: this.props.blogPost.body }}/>
+          <p
+            className="article-body"
+            style={bodyStyle}
+            dangerouslySetInnerHTML={{ __html: this.props.blogPost.body }}
+          />
         </div>
         <div className="pure-u-1-24"/>
         <div className="pure-u-3-24">
diff --git a/chump/src/components/search_results.tsx b/chump/src/components/search_results.tsx
index 6ac2cf9e..52a44f36 100644
--- a/chump/src/components/search_results.tsx
+++ b/chump/src/components/search_results.tsx
@@ -105,7 +105,7 @@ export class SearchResults extends React.Component<ISearchResultsProps, ISearchR
     return this.state.foundPosts.map((e: IParsedPost, i: number) => {
       return (
         <div className="pure-g pure-u-1" key={i}>
-          <Post username={this.props.username} blogPost={e} preview={false}/>
+          <Post username={this.props.username} blogPost={e} preview={false} customCss={false}/>
         </div>
       );
     });
diff --git a/chump/src/components/single_post.tsx b/chump/src/components/single_post.tsx
index 4df3bfc8..0fea967d 100644
--- a/chump/src/components/single_post.tsx
+++ b/chump/src/components/single_post.tsx
@@ -57,7 +57,7 @@ export class SinglePost extends React.Component<ISinglePostProps, ISinglePostSta
 
     return (
       <div className="pure-g" key={1}>
-        <Post username={this.props.username} blogPost={this.state.posts[0]} preview={false}/>
+        <Post username={this.props.username} blogPost={this.state.posts[0]} preview={false} customCss={true}/>
       </div>
     );
   }
diff --git a/chump/src/components/user_feed.tsx b/chump/src/components/user_feed.tsx
index 28068668..8142ee96 100644
--- a/chump/src/components/user_feed.tsx
+++ b/chump/src/components/user_feed.tsx
@@ -94,7 +94,7 @@ export class User extends React.Component<IUserProps, IUserState> {
     return this.state.publicBlog.map((e: IParsedPost, i: number) => {
       return (
         <div className="pure-g" key={i}>
-          <Post username={this.props.username} blogPost={e} preview={false}/>
+          <Post username={this.props.username} blogPost={e} preview={false} customCss={true}/>
         </div>
       );
     });
diff --git a/chump/src/models/edit_user.ts b/chump/src/models/edit_user.ts
index 21af2d32..9e1b9b07 100644
--- a/chump/src/models/edit_user.ts
+++ b/chump/src/models/edit_user.ts
@@ -10,6 +10,7 @@ export function EditUserPromise(
   bio: string, displayName: string,
   currentPassword: string,  newPassword: string,
   privateAccount: boolean,
+  postTitleCss: string, postBodyCss: string
 ) {
   const url = "/c2s/update/user";
   const postBody = {
@@ -17,6 +18,8 @@ export function EditUserPromise(
     current_password: currentPassword,
     display_name: displayName,
     new_password: newPassword,
+    post_body_css: postBodyCss,
+    post_title_css: postTitleCss,
     private: privateAccount,
   };
   return new Promise<IEditUserResult>((resolve, reject) => {
diff --git a/chump/src/models/posts.ts b/chump/src/models/posts.ts
index c6d3fac7..971e5908 100644
--- a/chump/src/models/posts.ts
+++ b/chump/src/models/posts.ts
@@ -14,39 +14,66 @@ interface IBlogPost {
   is_followed: boolean;
 }
 
+interface IFeedResponse {
+  post_body_css: string;
+  post_title_css: string;
+  results: IBlogPost[];
+}
+
 export interface IParsedPost extends IBlogPost {
   // parsed_date is a javascript Date object built from published key in
   // IBlogPost
   parsed_date: Date;
+  body_css?: React.CSSProperties;
+  title_css?: React.CSSProperties;
 }
 
 const feedApiURL = "/c2s/feed";
 const perUserApiURL = "/c2s/@";
 
-export function ParsePosts(b: IBlogPost[]) {
-  b = b as IParsedPost[];
+function ParseCSSJson(j: string) {
+  if (j === "") {
+    return undefined;
+  }
+  let p = {};
+  try {
+    p = JSON.parse(j);
+  } catch (err) {
+    // Invalid JSON.
+    return undefined;
+  }
+  // TODO(CianLR): Check if p is an instace of React.CSSProperties  
+  return p as React.CSSProperties;
+}
+
+export function ParsePosts(b: IFeedResponse) {
+  let res : IParsedPost[] = b.results as IParsedPost[];
   // convert published string to js datetime obj
-  b.map((e: IParsedPost) => {
+  let body_css = ParseCSSJson(b.post_body_css);
+  let title_css = ParseCSSJson(b.post_title_css);
+  res.map((e: IParsedPost) => {
     e.parsed_date = new Date(e.published);
+    e.body_css = body_css
+    e.title_css = title_css
     if (e.bio === undefined || e.bio === "") {
       e.bio = "Nowadays everybody wanna talk like they got something to say. \
       But nothing comes out when they move their lips; just a bunch of gibberish.";
     }
     return e;
   });
-  return b;
+  return res;
 }
 
-export function SortPosts(b: IBlogPost[]) {
-  b = ParsePosts(b);
-  b.sort((n: IParsedPost, m: IParsedPost) => {
+export function SortPosts(b: IFeedResponse) {
+  let p : IParsedPost[] = ParsePosts(b);
+  p.sort((n: IParsedPost, m: IParsedPost) => {
     return m.parsed_date.getTime() - n.parsed_date.getTime();
   });
-  return b;
+  return p;
 }
 
 export function PostsAPIPromise(url: string) {
-  return new Promise<IBlogPost[]>((resolve, reject) => {
+  return new Promise<IParsedPost[]>((resolve, reject) => {
     superagent
       .get(url)
       .set("Accept", "application/json")
diff --git a/services/database/rabble_schema.sql b/services/database/rabble_schema.sql
index db587ab4..5f545df3 100644
--- a/services/database/rabble_schema.sql
+++ b/services/database/rabble_schema.sql
@@ -21,6 +21,8 @@ CREATE TABLE IF NOT EXISTS users (
   /* account_type refers to the account_type enum in the database.proto file.
    * In normal cases, this will be 0, a normal user. */
   private           boolean NOT NULL,
+  post_title_css    text    NOT NULL DEFAULt '',
+  post_body_css     text    NOT NULL DEFAULT '',
   UNIQUE (handle, host)
 );
 
diff --git a/services/database/users_servicer.py b/services/database/users_servicer.py
index 4ba9bf35..0b76cebb 100644
--- a/services/database/users_servicer.py
+++ b/services/database/users_servicer.py
@@ -18,7 +18,8 @@ def __init__(self, db, logger):
         self._select_base = (
             "SELECT u.global_id, u.handle, u.host, u.display_name, "
             "u.password, u.bio, u.rss, u.private, "
-            "f.follower IS NOT NULL FROM users u "
+            "f.follower IS NOT NULL, "
+            "u.post_title_css, u.post_body_css FROM users u "
             "LEFT OUTER JOIN follows f ON "
             "f.followed=u.global_id AND f.follower=? "
         )
@@ -30,7 +31,7 @@ def __init__(self, db, logger):
         }
 
     def _db_tuple_to_entry(self, tup, entry):
-        if len(tup) != 9:
+        if len(tup) != 11:
             self._logger.warning(
                 "Error converting tuple to UsersEntry: " +
                 "Wrong number of elements " + str(tup))
@@ -46,6 +47,8 @@ def _db_tuple_to_entry(self, tup, entry):
             entry.rss = tup[6]
             entry.private = tup[7]
             entry.is_followed = tup[8]
+            entry.post_title_css = tup[9]
+            entry.post_body_css = tup[10]
         except Exception as e:
             self._logger.warning(
                 "Error converting tuple to UsersEntry: " +
diff --git a/services/feed/main.go b/services/feed/main.go
index faa01759..b4739d0e 100644
--- a/services/feed/main.go
+++ b/services/feed/main.go
@@ -160,8 +160,9 @@ func (s *server) PerArticle(ctx context.Context, r *pb.ArticleRequest) (*pb.Feed
 		return &pb.FeedResponse{}, nil
 	}
 	fp := &pb.FeedResponse{}
+	fp.PostTitleCss = author.PostTitleCss
+	fp.PostBodyCss = author.PostBodyCss
 	fp.Results = utils.ConvertDBToFeed(ctx, resp, s.db)
-
 	return fp, nil
 }
 
@@ -197,6 +198,8 @@ func (s *server) PerUser(ctx context.Context, r *pb.FeedRequest) (*pb.FeedRespon
 		return nil, fmt.Errorf("feed.PerUser failed: db.Posts(%v) error: %v", *pr, err)
 	}
 	fp := &pb.FeedResponse{}
+	fp.PostTitleCss = author.PostTitleCss
+	fp.PostBodyCss = author.PostBodyCss
 	fp.Results = utils.ConvertDBToFeed(ctx, resp, s.db)
 	return fp, nil
 }
diff --git a/services/proto/database.proto b/services/proto/database.proto
index d6a2030e..a9d2f440 100644
--- a/services/proto/database.proto
+++ b/services/proto/database.proto
@@ -81,6 +81,9 @@ message UsersEntry {
   // True if the user in the request is following the author of this post (and
   // this follow is accepted and not pending).
   bool is_followed = 9;
+  // Custom CSS the user has given. Empty string if not set.
+  string post_title_css = 10;
+  string post_body_css = 11;
 }
 
 message UsersRequest {
diff --git a/services/proto/feed.proto b/services/proto/feed.proto
index 5871d661..11bef9d5 100644
--- a/services/proto/feed.proto
+++ b/services/proto/feed.proto
@@ -42,6 +42,10 @@ message FeedResponse {
 
   repeated Post results = 1;
   FeedError error = 2;
+
+  // Custom CSS a user may have defined. Empty string if not.
+  string post_title_css = 3;
+  string post_body_css = 4;
 }
 
 service Feed {
diff --git a/services/proto/users.proto b/services/proto/users.proto
index 9e01e8c4..80035c6c 100644
--- a/services/proto/users.proto
+++ b/services/proto/users.proto
@@ -50,6 +50,8 @@ message UpdateUserRequest {
   string display_name = 4;
   string bio = 5;
   bool private = 6;
+  string post_title_css = 7;
+  string post_body_css = 8;
 }
 
 message UpdateUserResponse {
diff --git a/services/users/update.py b/services/users/update.py
index f1e1e254..452ba007 100644
--- a/services/users/update.py
+++ b/services/users/update.py
@@ -43,6 +43,8 @@ def Update(self, request, context):
                 password=pw,
                 bio=request.bio,
                 private=request.private,
+                post_title_css=request.post_title_css,
+                post_body_css=request.post_body_css,
             ),
         )
 
diff --git a/skinny/handlers.go b/skinny/handlers.go
index 7722035f..5db859f6 100644
--- a/skinny/handlers.go
+++ b/skinny/handlers.go
@@ -107,7 +107,7 @@ func (s *serverWrapper) handleFeed() http.HandlerFunc {
 		w.Header().Set("Content-Type", "application/json")
 		enc := json.NewEncoder(w)
 		enc.SetEscapeHTML(false)
-		err = enc.Encode(resp.Results)
+		err = enc.Encode(resp)
 		if err != nil {
 			log.Printf("could not marshal blogs: %v", err)
 			w.WriteHeader(http.StatusInternalServerError)
@@ -151,7 +151,7 @@ func (s *serverWrapper) handleFeedPerUser() http.HandlerFunc {
 		w.Header().Set("Content-Type", "application/json")
 		enc := json.NewEncoder(w)
 		enc.SetEscapeHTML(false)
-		err = enc.Encode(resp.Results)
+		err = enc.Encode(resp)
 		if err != nil {
 			log.Printf("could not marshal blogs: %v", err)
 			w.WriteHeader(http.StatusInternalServerError)
@@ -232,7 +232,7 @@ func (s *serverWrapper) handlePerArticlePage() http.HandlerFunc {
 		w.Header().Set("Content-Type", "application/json")
 		enc := json.NewEncoder(w)
 		enc.SetEscapeHTML(false)
-		err = enc.Encode(resp.Results)
+		err = enc.Encode(resp)
 		if err != nil {
 			log.Printf("Could not marshal article: %v", err)
 			w.WriteHeader(http.StatusInternalServerError)

From ab75bf6f169c813f06bd76757c23f0fde543bd50 Mon Sep 17 00:00:00 2001
From: CianLR <cian.ruane1@gmail.com>
Date: Mon, 18 Feb 2019 15:38:03 +0000
Subject: [PATCH 2/2] Lint and fix tests

---
 chump/src/components/account_edit.tsx |  2 +-
 chump/src/components/post.tsx         |  4 ++--
 chump/src/models/edit_user.ts         |  2 +-
 chump/src/models/posts.ts             | 28 ++++++++++++------------
 chump/test/models/posts.spec.ts       | 31 +++++++++++++++++++++------
 skinny/main_test.go                   |  5 +++--
 6 files changed, 46 insertions(+), 26 deletions(-)

diff --git a/chump/src/components/account_edit.tsx b/chump/src/components/account_edit.tsx
index 1b41000c..d60dc669 100644
--- a/chump/src/components/account_edit.tsx
+++ b/chump/src/components/account_edit.tsx
@@ -70,7 +70,7 @@ export class AccountEdit extends React.Component<IAccountEditProps, IAccountEdit
       this.state.newPassword,
       this.state.privateAccount,
       this.state.postTitleCss,
-      this.state.postBodyCss
+      this.state.postBodyCss,
     ).then((response: IEditUserResult) => {
       if (!response.success) {
         alert("Error editing: " + response.error);
diff --git a/chump/src/components/post.tsx b/chump/src/components/post.tsx
index 4d1175eb..0fa0d8d0 100644
--- a/chump/src/components/post.tsx
+++ b/chump/src/components/post.tsx
@@ -49,8 +49,8 @@ export class Post extends React.Component<IPostProps, IPostState> {
       LikeButton = false;
     }
     // Set custom CSS for user if enabled.
-    let bodyStyle = this.props.customCss ? this.props.blogPost.body_css : undefined;
-    let titleStyle = this.props.customCss ? this.props.blogPost.title_css : undefined;
+    const bodyStyle = this.props.customCss ? this.props.blogPost.body_css : undefined;
+    const titleStyle = this.props.customCss ? this.props.blogPost.title_css : undefined;
     return (
       <div className="blog-post-holder">
         <div className="pure-u-5-24"/>
diff --git a/chump/src/models/edit_user.ts b/chump/src/models/edit_user.ts
index 9e1b9b07..f6769b51 100644
--- a/chump/src/models/edit_user.ts
+++ b/chump/src/models/edit_user.ts
@@ -10,7 +10,7 @@ export function EditUserPromise(
   bio: string, displayName: string,
   currentPassword: string,  newPassword: string,
   privateAccount: boolean,
-  postTitleCss: string, postBodyCss: string
+  postTitleCss: string, postBodyCss: string,
 ) {
   const url = "/c2s/update/user";
   const postBody = {
diff --git a/chump/src/models/posts.ts b/chump/src/models/posts.ts
index 971e5908..e8f3847d 100644
--- a/chump/src/models/posts.ts
+++ b/chump/src/models/posts.ts
@@ -14,7 +14,7 @@ interface IBlogPost {
   is_followed: boolean;
 }
 
-interface IFeedResponse {
+export interface IFeedResponse {
   post_body_css: string;
   post_title_css: string;
   results: IBlogPost[];
@@ -31,8 +31,8 @@ export interface IParsedPost extends IBlogPost {
 const feedApiURL = "/c2s/feed";
 const perUserApiURL = "/c2s/@";
 
-function ParseCSSJson(j: string) {
-  if (j === "") {
+function ParseCSSJson(j?: string) {
+  if (j === undefined || j === "") {
     return undefined;
   }
   let p = {};
@@ -42,30 +42,30 @@ function ParseCSSJson(j: string) {
     // Invalid JSON.
     return undefined;
   }
-  // TODO(CianLR): Check if p is an instace of React.CSSProperties  
+  // TODO(CianLR): Check if p is actually an instace of React.CSSProperties.
   return p as React.CSSProperties;
 }
 
-export function ParsePosts(b: IFeedResponse) {
-  let res : IParsedPost[] = b.results as IParsedPost[];
+export function ParsePosts(b: IBlogPost[], bodyCssJson?: string, titleCssJson?: string) {
+  const bodyCss = ParseCSSJson(bodyCssJson);
+  const titleCss = ParseCSSJson(titleCssJson);
   // convert published string to js datetime obj
-  let body_css = ParseCSSJson(b.post_body_css);
-  let title_css = ParseCSSJson(b.post_title_css);
-  res.map((e: IParsedPost) => {
+  b = b as IParsedPost[];
+  b.map((e: IParsedPost) => {
     e.parsed_date = new Date(e.published);
-    e.body_css = body_css
-    e.title_css = title_css
+    e.body_css = bodyCss;
+    e.title_css = titleCss;
     if (e.bio === undefined || e.bio === "") {
       e.bio = "Nowadays everybody wanna talk like they got something to say. \
       But nothing comes out when they move their lips; just a bunch of gibberish.";
     }
     return e;
   });
-  return res;
+  return b as IParsedPost[];
 }
 
 export function SortPosts(b: IFeedResponse) {
-  let p : IParsedPost[] = ParsePosts(b);
+  const p: IParsedPost[] = ParsePosts(b.results, b.post_body_css, b.post_title_css);
   p.sort((n: IParsedPost, m: IParsedPost) => {
     return m.parsed_date.getTime() - n.parsed_date.getTime();
   });
@@ -85,7 +85,7 @@ export function PostsAPIPromise(url: string) {
         // Feed will respond with an empty response if no blogs are avaiable.
         let posts = res!.body;
         if (posts === null) {
-          posts = [];
+          posts = {results: []};
         }
         const parsedPosts = SortPosts(posts);
         resolve(parsedPosts);
diff --git a/chump/test/models/posts.spec.ts b/chump/test/models/posts.spec.ts
index a643ecc5..25213059 100644
--- a/chump/test/models/posts.spec.ts
+++ b/chump/test/models/posts.spec.ts
@@ -4,12 +4,12 @@ import { expect } from "chai";
 import * as sinon from "sinon";
 import * as superagent from "superagent";
 
-import { GetPublicPosts, GetSinglePost, IParsedPost } from "../../src/models/posts";
+import { GetPublicPosts, GetSinglePost, IFeedResponse, IParsedPost } from "../../src/models/posts";
 
 const sandbox: sinon.SinonSandbox = sinon.createSandbox();
 const now: Date = new Date();
 
-function createFakeResponse(body: IParsedPost[] | Error | null) {
+function createFakeResponse(body: IFeedResponse | Error | null) {
   const end = (cb: any) => {
       cb(null, {ok: true, body });
   };
@@ -18,10 +18,28 @@ function createFakeResponse(body: IParsedPost[] | Error | null) {
   return sandbox.stub(superagent, "get").returns(root);
 }
 
-const validBody: IParsedPost[] = [{
+const validBody: IFeedResponse = {
+ post_body_css: "",
+ post_title_css: "",
+ results: [{
+   author: "aaron",
+   bio: "bio",
+   body: "rm -rf steely/",
+   global_id: 2,
+   image: "",
+   is_followed: false,
+   is_liked: false,
+   likes_count: 1,
+   published: "",
+   title: "how to write a plugin",
+ }],
+};
+
+const evalidBody: IParsedPost[] = [{
   author: "aaron",
   bio: "bio",
   body: "rm -rf steely/",
+  body_css: undefined,
   global_id: 2,
   image: "",
   is_followed: false,
@@ -30,6 +48,7 @@ const validBody: IParsedPost[] = [{
   parsed_date: now,
   published: "",
   title: "how to write a plugin",
+  title_css: undefined,
 }];
 
 describe("GetPublicPosts", () => {
@@ -43,7 +62,7 @@ describe("GetPublicPosts", () => {
     GetPublicPosts().then((posts: IParsedPost[]) => {
       expect(getRequest).to.have.property("callCount", 1);
       expect(getRequest.calledWith("/c2s/feed")).to.be.ok;
-      expect(posts).to.eql(validBody);
+      expect(posts).to.eql(validBody.results);
       done();
     });
   });
@@ -53,7 +72,7 @@ describe("GetPublicPosts", () => {
     GetPublicPosts("username").then((posts: IParsedPost[]) => {
       expect(getRequest).to.have.property("callCount", 1);
       expect(getRequest.calledWith("/c2s/feed/username")).to.be.ok;
-      expect(posts).to.eql(validBody);
+      expect(posts).to.eql(validBody.results);
       done();
     });
   });
@@ -85,7 +104,7 @@ describe("GetPublicPosts", () => {
     GetSinglePost("username", "id").then((posts: IParsedPost[]) => {
       expect(getRequest).to.have.property("callCount", 1);
       expect(getRequest.calledWith("/c2s/@username/id")).to.be.ok;
-      expect(posts).to.eql(validBody);
+      expect(posts).to.eql(validBody.results);
       done();
     });
   });
diff --git a/skinny/main_test.go b/skinny/main_test.go
index 5518f3d2..3ecda290 100644
--- a/skinny/main_test.go
+++ b/skinny/main_test.go
@@ -355,10 +355,11 @@ func TestFeed(t *testing.T) {
 		t.Errorf("Expected 200 OK, got %#v", res.Code)
 	}
 
-	var r []pb.Post
-	if err := json.Unmarshal(res.Body.Bytes(), &r); err != nil {
+	var resp pb.FeedResponse
+	if err := json.Unmarshal(res.Body.Bytes(), &resp); err != nil {
 		t.Fatalf("json.Unmarshal(%#v) unexpected error: %v", res.Body.String(), err)
 	}
+	r := resp.Results
 
 	if len(r) != 1 {
 		t.Fatalf("Expected one result, got %v", len(r))