feat: minor changes

apps/excalidraw/package.json

@@ -13,7 +13,6 @@
     "with-env": "dotenv -e ../../.env --"
   },
   "dependencies": {
-    "@t3-oss/env-nextjs": "^0.7.1",
     "@t3-oss/env-nextjs": "^0.7.1",
     "@tanstack/react-query": "^4.36.1",
     "@tr/api": "^0.1.0",

apps/hacker-news/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@tr/hacker-news",
+  "name": "@tr/hn",
   "version": "0.1.0",
   "private": true,
   "scripts": {
@@ -16,7 +16,6 @@
     "@tanstack/react-query": "^4.35.3",
     "@tanstack/react-query-devtools": "^4.35.3",
     "@tanstack/react-query-next-experimental": "5.0.0-alpha.80",
-    "@tr/tsconfig": "workspace:^0.1.0",
     "@tr/ui": "workspace:^",
     "link-preview-js": "^3.0.5",
     "next": "^13.5.3",
@@ -27,9 +26,10 @@
     "zod": "^3.21.4"
   },
   "devDependencies": {
-    "@tr/eslint-config": "workspace:^",
-    "@tr/prettier-config": "workspace:^",
-    "@tr/tailwind-config": "workspace:^",
+    "@tr/eslint-config": "workspace:*",
+    "@tr/prettier-config": "workspace:*",
+    "@tr/tailwind-config": "workspace:*",
+    "@tr/tsconfig": "workspace:*",
     "@types/node": "^18.16.5",
     "@types/react": "^18.2.6",
     "@types/react-dom": "^18.2.4",

apps/hacker-news/src/components/stories-list.tsx

@@ -1,9 +1,10 @@
 "use client";
 
+import { QueryFunction, useQuery } from "@tanstack/react-query";
+
 import { StoryItem } from "@/components/story-item";
-import { StoriesList, Story, User } from "@/types";
+import { Story, User, type StoriesList } from "@/types";
 import { fetchUrlMetadata } from "@/utils/fetchUrlMetadata";
-import { QueryFunction, useQuery } from "@tanstack/react-query";
 
 const baseUrl = "https://hacker-news.firebaseio.com/v0";
 const topStoriesUrl = `${baseUrl}/topstories.json`;
@@ -13,49 +14,45 @@ export const getTopStoriesIds = async () => {
   const data = await response.json();
 
   return data as number[];
-}
+};
 
 export const getStories = async (storyIds: number[]) => {
-  const stories = await Promise.all(
+  const stories = (await Promise.all(
     storyIds.map((id) =>
-      fetch(`${baseUrl}/item/${id}.json`).then((story) => story.json())
-    )
-  ) as Story[];
+      fetch(`${baseUrl}/item/${id}.json`).then((story) => story.json()),
+    ),
+  )) as Story[];
 
   const preview = await Promise.all(
-    stories.map((story) =>
-      fetchUrlMetadata(story.url).then((meta) => meta)
-    )
-  )
+    stories.map((story) => fetchUrlMetadata(story.url).then((meta) => meta)),
+  );
 
-  console.log('preview:', preview);
+  console.log("preview:", preview);
 
-  const users = await Promise.all(
+  const users = (await Promise.all(
     stories.map((story) =>
-      fetch(`${baseUrl}/user/${story.by}.json`).then((user) => user.json())
-    )
-  ) as User[]
+      fetch(`${baseUrl}/user/${story.by}.json`).then((user) => user.json()),
+    ),
+  )) as User[];
 
   return stories
     .map((story) => ({
       ...story,
       user: users
         .map((user) => ({ id: user.id, karma: user.karma }))
         .find((user) => user.id === story.by),
-      preview: preview
-        .find((meta) => meta && meta.url === story.url) ?? null,
+      preview: preview.find((meta) => meta && meta.url === story.url) ?? null,
     }))
-    .sort((a, b) => a.score - b.score) as StoriesList
-}
+    .sort((a, b) => a.score - b.score) as StoriesList;
+};
 
 export const getTopStories: QueryFunction<StoriesList> = async () => {
   const storyIds = (await getTopStoriesIds()).slice(0, 10);
-  const stories = await getStories(storyIds)
+  const stories = await getStories(storyIds);
 
-  console.log('stories', stories);
+  console.log("stories", stories);
   return stories;
-}
-
+};
 
 export function StoriesList() {
   const { data: stories } = useQuery<StoriesList>({
@@ -67,9 +64,7 @@ export function StoriesList() {
 
   return (
     <div className="flex flex-col space-y-4">
-      {stories?.map(story => (
-        <StoryItem key={story.id} story={story} />
-      ))}
+      {stories?.map((story) => <StoryItem key={story.id} story={story} />)}
     </div>
-  )
-}
+  );
+}

apps/hacker-news/src/components/story-item.tsx

@@ -5,8 +5,14 @@ import { StoriesListItem } from "@/types/stories";
 export const StoryItem: React.FC<{ story: StoriesListItem }> = ({ story }) => {
   return (
     <div className="flex flex-row space-x-6 rounded-2xl border p-4 shadow-md">
-      <div className="w-full whitespace-pre-wrap break-words">
+      <div className="flex w-full flex-col whitespace-pre-wrap break-words">
+        <h1 className="text-base font-semibold">{story.title}</h1>
         {JSON.stringify(story)}
+        <div className="flex justify-end">
+          <div className="w-min rounded-full bg-secondary px-3 py-1.5 text-xs">
+            {story.type}
+          </div>
+        </div>
       </div>
       <div className="w-40">
         <StoryItemPreview story={story} />

apps/hacker-news/src/types/stories.ts

@@ -7,6 +7,7 @@ export type Story = {
   time: number;
   title: string;
   url: string;
+  type: string;
 };
 
 export type StoriesListItem = Story & {

package.json

@@ -17,7 +17,7 @@
     "dev:web": "turbo dev --parallel --filter=web...",
     "dev:tools": "turbo dev --parallel --filter=tools...",
     "dev:portfolio": "turbo dev --parallel --filter=portfolio...",
-    "dev:hn": "turbo dev --parallel --filter=hacker-news...",
+    "dev:hn": "turbo dev --parallel --filter=hn...",
     "format": "prettier --write \"**/*.{js,cjs,mjs,ts,tsx,md,json}\" --ignore-path .gitignore",
     "lint": "turbo lint && manypkg check",
     "lint:fix": "turbo lint:fix && manypkg fix",