feature: PR 2/8 — models, Promise-based HN API and comment util

src/react/api/hackernews.ts

@@ -0,0 +1,46 @@
+import { FeedName } from '../models/feed-name.type';
+import { PollResult } from '../models/poll-result';
+import { Story } from '../models/story';
+import { User } from '../models/user';
+
+const BASE_URL = 'https://node-hnapi.herokuapp.com';
+
+async function getJson<T>(path: string): Promise<T> {
+    const response = await fetch(`${BASE_URL}${path}`);
+
+    if (!response.ok) {
+        throw new Error(`Request failed with status ${response.status}`);
+    }
+
+    return response.json() as Promise<T>;
+}
+
+export function fetchFeed(feedName: FeedName, page: number): Promise<Story[]> {
+    return getJson<Story[]>(`/${feedName}?page=${page}`);
+}
+
+export async function fetchItemContent(id: number): Promise<Story> {
+    const story = await getJson<Story>(`/item/${id}`);
+
+    if (story.type === 'poll') {
+        story.poll_votes_count = 0;
+        const pollResults = await Promise.all(
+            story.poll.map((_, index) => fetchPollContent(story.id + index + 1))
+        );
+
+        pollResults.forEach((pollResult, index) => {
+            story.poll[index] = pollResult;
+            story.poll_votes_count += pollResult.points;
+        });
+    }
+
+    return story;
+}
+
+export function fetchPollContent(id: number): Promise<PollResult> {
+    return getJson<PollResult>(`/item/${id}`);
+}
+
+export function fetchUser(id: string): Promise<User> {
+    return getJson<User>(`/user/${id}`);
+}

src/react/models/comment.ts

@@ -0,0 +1,10 @@
+export class Comment {
+    id: number;
+    level: number;
+    user: string;
+    time: number;
+    time_ago: string;
+    content: string;
+    deleted: boolean;
+    comments: Comment[];
+}

src/react/models/feed-name.type.ts

@@ -0,0 +1 @@
+export type FeedName = 'news' | 'newest' | 'show' | 'ask' | 'jobs';

src/react/models/feed-type.type.ts

@@ -0,0 +1 @@
+export type FeedType = 'poll' | 'story' | 'job';

src/react/models/poll-result.ts

@@ -0,0 +1,4 @@
+export class PollResult {
+    points: number;
+    content: string;
+}

src/react/models/settings.ts

@@ -0,0 +1,7 @@
+export interface Settings {
+    showSettings: boolean;
+    openLinkInNewTab: boolean;
+    theme: string;
+    titleFontSize: string;
+    listSpacing: string;
+}

src/react/models/story.ts

@@ -0,0 +1,21 @@
+import { Comment } from './comment';
+import { FeedType } from './feed-type.type';
+import { PollResult } from './poll-result';
+
+export class Story {
+    id: number;
+    title: string;
+    points: number;
+    user: string;
+    time: number;
+    time_ago: number;
+    type: FeedType;
+    url: string;
+    domain: string;
+    comments: Comment[];
+    comments_count: number;
+    poll: PollResult[];
+    poll_votes_count: number;
+    deleted: boolean;
+    dead: boolean;
+}

src/react/models/user.ts

@@ -0,0 +1,8 @@
+export class User {
+    id: string;
+    crated_time: number;
+    created: string;
+    karma: number;
+    avg: number;
+    about: string;
+}

src/react/utils/comments.ts

@@ -0,0 +1,8 @@
+export function formatComments(count?: number): string {
+    if (count !== undefined && count > 0) {
+        const label = count === 1 ? 'comment' : 'comments';
+        return `${count} ${label}`;
+    }
+
+    return 'discuss';
+}

tsconfig.react.json

@@ -14,8 +14,9 @@
         "isolatedModules": true,
         "noEmit": true,
         "jsx": "react-jsx",
-        "types": ["react", "react-dom"]
+        "types": ["react", "react-dom"],
+        "strictPropertyInitialization": false
     },
-    "include": ["src/main.tsx", "src/react/**/*.tsx"],
+    "include": ["src/main.tsx", "src/react/**/*.ts", "src/react/**/*.tsx"],
     "exclude": ["node_modules"]
 }