diff options
Diffstat (limited to 'frontend/src')
| -rw-r--r-- | frontend/src/components/ArticleItem.tsx | 35 | ||||
| -rw-r--r-- | frontend/src/components/ArticleList.tsx | 9 | ||||
| -rw-r--r-- | frontend/src/pages/ReadArticles.tsx | 4 | ||||
| -rw-r--r-- | frontend/src/pages/UnreadArticles.tsx | 4 |
4 files changed, 20 insertions, 32 deletions
diff --git a/frontend/src/components/ArticleItem.tsx b/frontend/src/components/ArticleItem.tsx index 8fb00b0..faa86fe 100644 --- a/frontend/src/components/ArticleItem.tsx +++ b/frontend/src/components/ArticleItem.tsx @@ -18,10 +18,9 @@ type Article = NonNullable< interface Props { article: Article; - showReadStatus?: boolean; } -export function ArticleItem({ article, showReadStatus = true }: Props) { +export function ArticleItem({ article }: Props) { const [, markArticleRead] = useMutation(MarkArticleReadDocument); const [, markArticleUnread] = useMutation(MarkArticleUnreadDocument); @@ -66,23 +65,21 @@ export function ArticleItem({ article, showReadStatus = true }: Props) { : "border-blue-200 bg-blue-50" }`} > - {showReadStatus && ( - <button - type="button" - onClick={() => handleToggleRead(article.id, optimisticArticle.isRead)} - className={`flex-shrink-0 rounded p-1 transition-colors ${ - optimisticArticle.isRead - ? "text-gray-400 hover:text-gray-600" - : "text-blue-600 hover:text-blue-700" - }`} - title={optimisticArticle.isRead ? "Mark as unread" : "Mark as read"} - > - <FontAwesomeIcon - icon={optimisticArticle.isRead ? faCheck : faCircle} - className="w-4 h-4" - /> - </button> - )} + <button + type="button" + onClick={() => handleToggleRead(article.id, optimisticArticle.isRead)} + className={`flex-shrink-0 rounded p-1 transition-colors ${ + optimisticArticle.isRead + ? "text-gray-400 hover:text-gray-600" + : "text-blue-600 hover:text-blue-700" + }`} + title={optimisticArticle.isRead ? "Mark as unread" : "Mark as read"} + > + <FontAwesomeIcon + icon={optimisticArticle.isRead ? faCheck : faCircle} + className="w-4 h-4" + /> + </button> <div className="flex-1 min-w-0"> <button type="button" diff --git a/frontend/src/components/ArticleList.tsx b/frontend/src/components/ArticleList.tsx index 5d508c5..2ea94f0 100644 --- a/frontend/src/components/ArticleList.tsx +++ b/frontend/src/components/ArticleList.tsx @@ -9,10 +9,9 @@ interface Props { | GetUnreadArticlesQuery["unreadArticles"] | GetReadArticlesQuery["readArticles"] >; - showReadStatus?: boolean; } -export function ArticleList({ articles, showReadStatus = true }: Props) { +export function ArticleList({ articles }: Props) { if (articles.length === 0) { return ( <div className="p-4 text-center text-gray-500">No articles found.</div> @@ -51,11 +50,7 @@ export function ArticleList({ articles, showReadStatus = true }: Props) { </h3> <div className="space-y-1"> {feedArticles.map((article) => ( - <ArticleItem - key={article.id} - article={article} - showReadStatus={showReadStatus} - /> + <ArticleItem key={article.id} article={article} /> ))} </div> </div> diff --git a/frontend/src/pages/ReadArticles.tsx b/frontend/src/pages/ReadArticles.tsx index 4863d63..44ae834 100644 --- a/frontend/src/pages/ReadArticles.tsx +++ b/frontend/src/pages/ReadArticles.tsx @@ -26,9 +26,7 @@ export function ReadArticles() { </p> )} </div> - {data?.readArticles && ( - <ArticleList articles={data.readArticles} showReadStatus={true} /> - )} + {data?.readArticles && <ArticleList articles={data.readArticles} />} </div> ); } diff --git a/frontend/src/pages/UnreadArticles.tsx b/frontend/src/pages/UnreadArticles.tsx index 38bf077..f82d4dc 100644 --- a/frontend/src/pages/UnreadArticles.tsx +++ b/frontend/src/pages/UnreadArticles.tsx @@ -26,9 +26,7 @@ export function UnreadArticles() { </p> )} </div> - {data?.unreadArticles && ( - <ArticleList articles={data.unreadArticles} showReadStatus={true} /> - )} + {data?.unreadArticles && <ArticleList articles={data.unreadArticles} />} </div> ); } |