From 8996a360dec012684d4d3a6c57bc05d4af181c49 Mon Sep 17 00:00:00 2001
From: Michael Brusegard <56915010+michaelbrusegard@users.noreply.github.com>
Date: Fri, 26 Jan 2024 14:38:07 +0100
Subject: [PATCH] refactor: updated news component names

---
 src/app/[locale]/(dashboard)/news/page.tsx        |  8 ++++----
 .../news/{NewsCard.tsx => ArticleCard.tsx}        |  8 ++++----
 .../news/{NewsItem.tsx => ArticleItem.tsx}        |  8 ++++----
 ...wsItemSkeleton.tsx => ArticleItemSkeleton.tsx} |  4 ++--
 .../news/{NewsCardGrid.tsx => CardGrid.tsx}       | 10 +++++-----
 ...sCardGridSuspense.tsx => CardGridSuspense.tsx} | 11 ++++-------
 .../news/{NewsItemGrid.tsx => ItemGrid.tsx}       | 10 +++++-----
 ...sItemGridSuspense.tsx => ItemGridSuspense.tsx} | 15 ++++++---------
 8 files changed, 34 insertions(+), 40 deletions(-)
 rename src/components/news/{NewsCard.tsx => ArticleCard.tsx} (94%)
 rename src/components/news/{NewsItem.tsx => ArticleItem.tsx} (94%)
 rename src/components/news/{NewsItemSkeleton.tsx => ArticleItemSkeleton.tsx} (88%)
 rename src/components/news/{NewsCardGrid.tsx => CardGrid.tsx} (81%)
 rename src/components/news/{NewsCardGridSuspense.tsx => CardGridSuspense.tsx} (77%)
 rename src/components/news/{NewsItemGrid.tsx => ItemGrid.tsx} (87%)
 rename src/components/news/{NewsItemGridSuspense.tsx => ItemGridSuspense.tsx} (60%)

diff --git a/src/app/[locale]/(dashboard)/news/page.tsx b/src/app/[locale]/(dashboard)/news/page.tsx
index 7e69b78..aea6cb0 100644
--- a/src/app/[locale]/(dashboard)/news/page.tsx
+++ b/src/app/[locale]/(dashboard)/news/page.tsx
@@ -4,8 +4,8 @@ import { getTranslations, unstable_setRequestLocale } from 'next-intl/server';
 
 import { Link } from '@/lib/navigation';
 
-import { NewsCardGridSuspense } from '@/components/news/NewsCardGridSuspense';
-import { NewsItemGridSuspense } from '@/components/news/NewsItemGridSuspense';
+import { CardGridSuspense } from '@/components/news/CardGridSuspense';
+import { ItemGridSuspense } from '@/components/news/ItemGridSuspense';
 import { Button } from '@/components/ui/Button';
 import { Separator } from '@/components/ui/Separator';
 
@@ -204,14 +204,14 @@ export default function News({
           </Link>
         </Button>
       </div>
-      <NewsCardGridSuspense
+      <CardGridSuspense
         newsData={mockData}
         t={{
           internalArticle: t('internalArticle'),
         }}
       />
       <Separator className='my-6' />
-      <NewsItemGridSuspense
+      <ItemGridSuspense
         newsData={mockData}
         t={{
           morePages: useTranslations('ui')('morePages'),
diff --git a/src/components/news/NewsCard.tsx b/src/components/news/ArticleCard.tsx
similarity index 94%
rename from src/components/news/NewsCard.tsx
rename to src/components/news/ArticleCard.tsx
index d599ca6..5c68bc2 100644
--- a/src/components/news/NewsCard.tsx
+++ b/src/components/news/ArticleCard.tsx
@@ -12,7 +12,7 @@ import {
   CardTitle,
 } from '@/components/ui/Card';
 
-type NewsCardProps = {
+type ArticleCardProps = {
   className?: string;
   id: number;
   internal: boolean;
@@ -24,7 +24,7 @@ type NewsCardProps = {
   };
 };
 
-function NewsCard({
+function ArticleCard({
   className,
   id,
   internal,
@@ -32,7 +32,7 @@ function NewsCard({
   date,
   photoUrl,
   t,
-}: NewsCardProps) {
+}: ArticleCardProps) {
   return (
     <Button
       className={cx('group whitespace-normal font-normal', className)}
@@ -68,4 +68,4 @@ function NewsCard({
   );
 }
 
-export { NewsCard };
+export { ArticleCard };
diff --git a/src/components/news/NewsItem.tsx b/src/components/news/ArticleItem.tsx
similarity index 94%
rename from src/components/news/NewsItem.tsx
rename to src/components/news/ArticleItem.tsx
index a0652bc..0bc1bf5 100644
--- a/src/components/news/NewsItem.tsx
+++ b/src/components/news/ArticleItem.tsx
@@ -6,7 +6,7 @@ import { cx } from '@/lib/utils';
 import { InternalBadge } from '@/components/news/InternalBadge';
 import { Button } from '@/components/ui/Button';
 
-type NewsCardProps = {
+type ArticleItemProps = {
   className?: string;
   id: number;
   internal: boolean;
@@ -18,7 +18,7 @@ type NewsCardProps = {
   };
 };
 
-function NewsItem({
+function ArticleItem({
   className,
   id,
   internal,
@@ -26,7 +26,7 @@ function NewsItem({
   date,
   photoUrl,
   t,
-}: NewsCardProps) {
+}: ArticleItemProps) {
   return (
     <Button
       className={cx('group block whitespace-normal font-normal', className)}
@@ -64,4 +64,4 @@ function NewsItem({
   );
 }
 
-export { NewsItem };
+export { ArticleItem };
diff --git a/src/components/news/NewsItemSkeleton.tsx b/src/components/news/ArticleItemSkeleton.tsx
similarity index 88%
rename from src/components/news/NewsItemSkeleton.tsx
rename to src/components/news/ArticleItemSkeleton.tsx
index c32ca21..d90e40b 100644
--- a/src/components/news/NewsItemSkeleton.tsx
+++ b/src/components/news/ArticleItemSkeleton.tsx
@@ -1,6 +1,6 @@
 import { Skeleton } from '@/components/ui/Skeleton';
 
-function NewsItemSkeleton() {
+function ArticleItemSkeleton() {
   return (
     <div className='flex gap-4 overflow-hidden rounded-lg'>
       <div className='relative h-28 w-28 flex-shrink-0'>
@@ -14,4 +14,4 @@ function NewsItemSkeleton() {
   );
 }
 
-export { NewsItemSkeleton };
+export { ArticleItemSkeleton };
diff --git a/src/components/news/NewsCardGrid.tsx b/src/components/news/CardGrid.tsx
similarity index 81%
rename from src/components/news/NewsCardGrid.tsx
rename to src/components/news/CardGrid.tsx
index 385350b..35b6d2c 100644
--- a/src/components/news/NewsCardGrid.tsx
+++ b/src/components/news/CardGrid.tsx
@@ -1,8 +1,8 @@
 import { cx } from '@/lib/utils';
 
-import { NewsCard } from '@/components/news/NewsCard';
+import { ArticleCard } from '@/components/news/ArticleCard';
 
-type NewsCardGridProps = {
+type CardGridProps = {
   newsData: {
     id: number;
     internal: boolean;
@@ -15,11 +15,11 @@ type NewsCardGridProps = {
   };
 };
 
-function NewsCardGrid({ newsData, t }: NewsCardGridProps) {
+function CardGrid({ newsData, t }: CardGridProps) {
   return (
     <div className='grid h-192 grid-rows-4 gap-4 xs:h-96 xs:grid-cols-3 xs:grid-rows-2 md:grid-cols-4 lg:h-112'>
       {newsData.slice(0, 4).map((data, index) => (
-        <NewsCard
+        <ArticleCard
           className={cx(
             index === 0 && 'row-span-1 xs:col-span-2 md:row-span-2',
             index === 1 && 'col-span-1 row-span-1 md:col-span-2',
@@ -40,4 +40,4 @@ function NewsCardGrid({ newsData, t }: NewsCardGridProps) {
   );
 }
 
-export { NewsCardGrid, type NewsCardGridProps };
+export { CardGrid, type CardGridProps };
diff --git a/src/components/news/NewsCardGridSuspense.tsx b/src/components/news/CardGridSuspense.tsx
similarity index 77%
rename from src/components/news/NewsCardGridSuspense.tsx
rename to src/components/news/CardGridSuspense.tsx
index 2bb9412..f65ba27 100644
--- a/src/components/news/NewsCardGridSuspense.tsx
+++ b/src/components/news/CardGridSuspense.tsx
@@ -2,13 +2,10 @@ import * as React from 'react';
 
 import { cx } from '@/lib/utils';
 
-import {
-  NewsCardGrid,
-  type NewsCardGridProps,
-} from '@/components/news/NewsCardGrid';
+import { CardGrid, type CardGridProps } from '@/components/news/CardGrid';
 import { Skeleton } from '@/components/ui/Skeleton';
 
-function NewsCardGridSuspense({ ...props }: NewsCardGridProps) {
+function CardGridSuspense({ ...props }: CardGridProps) {
   return (
     <React.Suspense
       fallback={
@@ -27,9 +24,9 @@ function NewsCardGridSuspense({ ...props }: NewsCardGridProps) {
         </div>
       }
     >
-      <NewsCardGrid {...props} />
+      <CardGrid {...props} />
     </React.Suspense>
   );
 }
 
-export { NewsCardGridSuspense };
+export { CardGridSuspense };
diff --git a/src/components/news/NewsItemGrid.tsx b/src/components/news/ItemGrid.tsx
similarity index 87%
rename from src/components/news/NewsItemGrid.tsx
rename to src/components/news/ItemGrid.tsx
index bb0926d..4818839 100644
--- a/src/components/news/NewsItemGrid.tsx
+++ b/src/components/news/ItemGrid.tsx
@@ -3,9 +3,9 @@
 import { parseAsInteger, useQueryState } from 'nuqs';
 
 import { PaginationCarousel } from '@/components/layout/PaginationCarousel';
-import { NewsItem } from '@/components/news/NewsItem';
+import { ArticleItem } from '@/components/news/ArticleItem';
 
-type NewsItemGridProps = {
+type ItemGridProps = {
   newsData: {
     id: number;
     internal: boolean;
@@ -24,7 +24,7 @@ type NewsItemGridProps = {
   };
 };
 
-function NewsItemGrid({ newsData, t }: NewsItemGridProps) {
+function ItemGrid({ newsData, t }: ItemGridProps) {
   const itemsDisplayedAsCards = 4;
   const itemsPerPage = 6;
   const [page, setPage] = useQueryState(t.page, parseAsInteger.withDefault(1));
@@ -41,7 +41,7 @@ function NewsItemGrid({ newsData, t }: NewsItemGridProps) {
     <>
       <div className='grid min-h-[752px] grid-cols-1 gap-4 sm:min-h-[368px] sm:grid-cols-2 lg:min-h-[240px] lg:grid-cols-3'>
         {currentData.map((data) => (
-          <NewsItem
+          <ArticleItem
             key={data.id}
             id={data.id}
             internal={data.internal}
@@ -65,4 +65,4 @@ function NewsItemGrid({ newsData, t }: NewsItemGridProps) {
   );
 }
 
-export { NewsItemGrid, type NewsItemGridProps };
+export { ItemGrid, type ItemGridProps };
diff --git a/src/components/news/NewsItemGridSuspense.tsx b/src/components/news/ItemGridSuspense.tsx
similarity index 60%
rename from src/components/news/NewsItemGridSuspense.tsx
rename to src/components/news/ItemGridSuspense.tsx
index d89cc4d..af0db0b 100644
--- a/src/components/news/NewsItemGridSuspense.tsx
+++ b/src/components/news/ItemGridSuspense.tsx
@@ -1,29 +1,26 @@
 import * as React from 'react';
 
 import { PaginationCarouselSkeleton } from '@/components/layout/PaginationCarouselSkeleton';
-import {
-  NewsItemGrid,
-  type NewsItemGridProps,
-} from '@/components/news/NewsItemGrid';
-import { NewsItemSkeleton } from '@/components/news/NewsItemSkeleton';
+import { ArticleItemSkeleton } from '@/components/news/ArticleItemSkeleton';
+import { ItemGrid, type ItemGridProps } from '@/components/news/ItemGrid';
 
-function NewsItemGridSuspense({ ...props }: NewsItemGridProps) {
+function ItemGridSuspense({ ...props }: ItemGridProps) {
   return (
     <React.Suspense
       fallback={
         <>
           <div className='grid min-h-[752px] grid-cols-1 gap-4 sm:min-h-[368px] sm:grid-cols-2 lg:min-h-[240px] lg:grid-cols-3'>
             {Array.from({ length: 6 }).map((_, index) => (
-              <NewsItemSkeleton key={index} />
+              <ArticleItemSkeleton key={index} />
             ))}
           </div>
           <PaginationCarouselSkeleton className='my-6' t={props.t} />
         </>
       }
     >
-      <NewsItemGrid {...props} />
+      <ItemGrid {...props} />
     </React.Suspense>
   );
 }
 
-export { NewsItemGridSuspense };
+export { ItemGridSuspense };