Clean up

Author: Milan Pavlik

app/src/App.css

@@ -38,6 +38,7 @@ class Stories extends React.Component<StoriesProps, {}> {
         <Grid columns={2} stackable={true} divided={'vertically'}>
           <Grid.Column width={4}>
             <StoryList
+              selected={this.props.selected}
               stories={this.props.stories}
               onStorySelect={(id: number) => this.props.dispatch(selectStory(id))}
             />

app/src/Stories.tsx

@@ -1,28 +1,34 @@
 import * as React from 'react';
-import { Item } from 'semantic-ui-react';
+import { Item, Icon } from 'semantic-ui-react';
 import {Item as Story } from './proto/hackernews_pb';
 
 type StoryListProps = {
   stories: Story.AsObject[],
+  selected: Story.AsObject | null,
   onStorySelect: (id: number) => void
 };
 
 const StoryList: React.SFC<StoryListProps> = (props) => {
   return (
-    <Item.Group>
+    <Item.Group divided={true}>
       {props.stories.map((story, i) =>
         <Item
+          style={story.id && props.selected && props.selected.id && story.id.id === props.selected.id.id
+            ? {'backgroundColor': 'rgba(0, 0, 0, 0.08)'}
+            : {}
+          }
           key={i}
           onClick={() => {
             if (story.id && story.id.id) {
               props.onStorySelect(story.id.id);
             }
           }}
         >
-          <Item.Content>
+          <Item.Content
+
+          >
             <Item.Header as="a">{story.title}</Item.Header>
-            <Item.Meta>By: {story.by}</Item.Meta>
-            <Item.Extra>{story.score} {story.time}</Item.Extra>
+            <Item.Extra><Icon  name="star" />{story.score} | <Icon  name="user" />{story.by}</Item.Extra>
           </Item.Content>
         </Item>
       )}

app/src/StoryList.tsx

@@ -6,14 +6,15 @@ type StoryViewProps = {
 };
 
 const StoryView: React.SFC<StoryViewProps> = (props) => {
+  const url = `http://localhost:8900/article-proxy?q=${encodeURIComponent(props.story.url)}`;
   return (
     <iframe
       frameBorder="0"
       style={{
         height: '100vh',
         width: '100%',
       }}
-      src={props.story.url}
+      src={url}
     />
   );
 };

app/src/StoryView.tsx

@@ -3,28 +3,11 @@ import { Item, ListStoriesRequest, ListStoriesResponse } from '../proto/hackerne
 import { GrpcAction, grpcRequest } from '../middleware/grpc';
 import { Code, Metadata } from 'grpc-web-client';
 import { HackerNewsService } from '../proto/hackernews_pb_service';
-import { PingRequest, PingResponse } from '../proto/ping_pb';
-import { PingService } from '../proto/ping_pb_service';
 
 export const STORIES_INIT = 'STORIES_INIT';
 export const ADD_STORY = 'ADD_STORY';
 export const SELECT_STORY = 'SELECT_STORY';
 
-export const ping = () => {
-  return grpcRequest<PingRequest, PingResponse>({
-    request: new PingRequest(),
-    onEnd: (code: Code, message: string | undefined, trailers: Metadata): Action | void => {
-      return;
-    },
-    host: 'http://localhost:8900',
-    methodDescriptor: PingService.Ping,
-    onMessage: (message) => {
-      console.log(message);
-      return;
-    }
-  });
-};
-
 type AddStory = {
   type: typeof ADD_STORY,
   payload: Item,

app/src/actions/stories.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
 import { Provider } from 'react-redux';
-import registerServiceWorker from './registerServiceWorker';
 import './index.css';
 import store from './store';
 import Stories from './Stories';
@@ -14,4 +13,3 @@ ReactDOM.render(
   </Provider>,
   document.getElementById('root') as HTMLElement
 );
-registerServiceWorker();

app/src/index.tsx

@@ -3,32 +3,10 @@
 
 import * as jspb from "google-protobuf";
 
-export class ItemId extends jspb.Message {
+export class Story extends jspb.Message {
   getId(): number;
   setId(value: number): void;
 
-  serializeBinary(): Uint8Array;
-  toObject(includeInstance?: boolean): ItemId.AsObject;
-  static toObject(includeInstance: boolean, msg: ItemId): ItemId.AsObject;
-  static extensions: {[key: number]: jspb.ExtensionFieldInfo<jspb.Message>};
-  static extensionsBinary: {[key: number]: jspb.ExtensionFieldBinaryInfo<jspb.Message>};
-  static serializeBinaryToWriter(message: ItemId, writer: jspb.BinaryWriter): void;
-  static deserializeBinary(bytes: Uint8Array): ItemId;
-  static deserializeBinaryFromReader(message: ItemId, reader: jspb.BinaryReader): ItemId;
-}
-
-export namespace ItemId {
-  export type AsObject = {
-    id: number,
-  }
-}
-
-export class Item extends jspb.Message {
-  hasId(): boolean;
-  clearId(): void;
-  getId(): ItemId | undefined;
-  setId(value?: ItemId): void;
-
   getScore(): number;
   setScore(value: number): void;
 
@@ -44,36 +22,32 @@ export class Item extends jspb.Message {
   getUrl(): string;
   setUrl(value: string): void;
 
-  getType(): ItemType;
-  setType(value: ItemType): void;
-
   serializeBinary(): Uint8Array;
-  toObject(includeInstance?: boolean): Item.AsObject;
-  static toObject(includeInstance: boolean, msg: Item): Item.AsObject;
+  toObject(includeInstance?: boolean): Story.AsObject;
+  static toObject(includeInstance: boolean, msg: Story): Story.AsObject;
   static extensions: {[key: number]: jspb.ExtensionFieldInfo<jspb.Message>};
   static extensionsBinary: {[key: number]: jspb.ExtensionFieldBinaryInfo<jspb.Message>};
-  static serializeBinaryToWriter(message: Item, writer: jspb.BinaryWriter): void;
-  static deserializeBinary(bytes: Uint8Array): Item;
-  static deserializeBinaryFromReader(message: Item, reader: jspb.BinaryReader): Item;
+  static serializeBinaryToWriter(message: Story, writer: jspb.BinaryWriter): void;
+  static deserializeBinary(bytes: Uint8Array): Story;
+  static deserializeBinaryFromReader(message: Story, reader: jspb.BinaryReader): Story;
 }
 
-export namespace Item {
+export namespace Story {
   export type AsObject = {
-    id?: ItemId.AsObject,
+    id: number,
     score: number,
     title: string,
     by: string,
     time: number,
     url: string,
-    type: ItemType,
   }
 }
 
 export class ListStoriesResponse extends jspb.Message {
   hasStory(): boolean;
   clearStory(): void;
-  getStory(): Item | undefined;
-  setStory(value?: Item): void;
+  getStory(): Story | undefined;
+  setStory(value?: Story): void;
 
   serializeBinary(): Uint8Array;
   toObject(includeInstance?: boolean): ListStoriesResponse.AsObject;
@@ -87,7 +61,7 @@ export class ListStoriesResponse extends jspb.Message {
 
 export namespace ListStoriesResponse {
   export type AsObject = {
-    story?: Item.AsObject,
+    story?: Story.AsObject,
   }
 }
 
@@ -107,62 +81,3 @@ export namespace ListStoriesRequest {
   }
 }
 
-export class GetStoryRequest extends jspb.Message {
-  hasId(): boolean;
-  clearId(): void;
-  getId(): ItemId | undefined;
-  setId(value?: ItemId): void;
-
-  serializeBinary(): Uint8Array;
-  toObject(includeInstance?: boolean): GetStoryRequest.AsObject;
-  static toObject(includeInstance: boolean, msg: GetStoryRequest): GetStoryRequest.AsObject;
-  static extensions: {[key: number]: jspb.ExtensionFieldInfo<jspb.Message>};
-  static extensionsBinary: {[key: number]: jspb.ExtensionFieldBinaryInfo<jspb.Message>};
-  static serializeBinaryToWriter(message: GetStoryRequest, writer: jspb.BinaryWriter): void;
-  static deserializeBinary(bytes: Uint8Array): GetStoryRequest;
-  static deserializeBinaryFromReader(message: GetStoryRequest, reader: jspb.BinaryReader): GetStoryRequest;
-}
-
-export namespace GetStoryRequest {
-  export type AsObject = {
-    id?: ItemId.AsObject,
-  }
-}
-
-export class GetStoryResponse extends jspb.Message {
-  hasStory(): boolean;
-  clearStory(): void;
-  getStory(): Item | undefined;
-  setStory(value?: Item): void;
-
-  getHtml(): Uint8Array | string;
-  getHtml_asU8(): Uint8Array;
-  getHtml_asB64(): string;
-  setHtml(value: Uint8Array | string): void;
-
-  serializeBinary(): Uint8Array;
-  toObject(includeInstance?: boolean): GetStoryResponse.AsObject;
-  static toObject(includeInstance: boolean, msg: GetStoryResponse): GetStoryResponse.AsObject;
-  static extensions: {[key: number]: jspb.ExtensionFieldInfo<jspb.Message>};
-  static extensionsBinary: {[key: number]: jspb.ExtensionFieldBinaryInfo<jspb.Message>};
-  static serializeBinaryToWriter(message: GetStoryResponse, writer: jspb.BinaryWriter): void;
-  static deserializeBinary(bytes: Uint8Array): GetStoryResponse;
-  static deserializeBinaryFromReader(message: GetStoryResponse, reader: jspb.BinaryReader): GetStoryResponse;
-}
-
-export namespace GetStoryResponse {
-  export type AsObject = {
-    story?: Item.AsObject,
-    html: Uint8Array | string,
-  }
-}
-
-export enum ItemType {
-  UNKNOWN = 0,
-  JOB = 1,
-  STORY = 2,
-  COMMENT = 3,
-  POLL = 4,
-  POLLOPT = 5,
-}
-