Merge pull request #48 from YukiOnishi1129/feature/YL-87

Feature/yl 87
YukiOnishi1129 · May 5, 2024 · 71a507c · 71a507c
2 parents c108eb3 + d625e9b
commit 71a507c
Show file tree

Hide file tree

Showing 12 changed files with 378 additions and 84 deletions.
diff --git a/batch-service/internal/crawler/article_contents_crawler.go b/batch-service/internal/crawler/article_contents_crawler.go
@@ -131,7 +131,7 @@ func CreateArticle(ctx context.Context, tx *sql.Tx, arg CreateArticleArg) error
 		ArticleURL:   arg.ArticleURL,
 		PublishedAt:  null.TimeFrom(publishedAt),
 		IsEng:        arg.IsEng,
-		IsPrivate:    true,
+		IsPrivate:    false,
 	}
 	if arg.AuthorName != nil {
 		article.AuthorName = null.StringFromPtr(arg.AuthorName)

diff --git a/web/client/src/features/articles/components/ArticleCardWrapper.tsx b/web/client/src/features/articles/components/ArticleCardWrapper.tsx
@@ -392,7 +392,18 @@ export const ArticleCardWrapper: FC<ArticleCardWrapperProps> = ({
           </>
         </div>
 
-        <ArticleDetailSheet article={showArticle} user={user}>
+        <ArticleDetailSheet
+          article={showArticle}
+          user={user}
+          bookmarkId={bookmarkId}
+          isFollowing={isFollowing}
+          favoriteArticleFolders={showFavoriteArticleFolders}
+          handleAddBookmark={handleAddBookmark}
+          handleRemoveBookmark={handleRemoveBookmark}
+          handleCreateFavoriteArticle={handleCreateFavoriteArticle}
+          handleRemoveFavoriteArticle={handleRemoveFavoriteArticle}
+          handleCreateFavoriteArticleFolder={handleCreateFavoriteArticleFolder}
+        >
           <ArticleCard article={showArticle} user={user} tab={tab} />
         </ArticleDetailSheet>
       </div>

diff --git a/web/client/src/features/articles/components/ArticleDetailDialog.tsx b/web/client/src/features/articles/components/ArticleDetailDialog.tsx
@@ -196,9 +196,9 @@ const ArticleContent = ({
           <Link href={article.articleUrl} target="_blank">
             <Button
               size={"lg"}
-              className="w-1/2 bg-blue-700 text-xl hover:bg-blue-900"
+              className="w-1/2 bg-blue-700 text-xl text-white hover:bg-blue-900"
             >
-              本文を読む
+              READ MORE
             </Button>
           </Link>
         </div>
@@ -211,9 +211,9 @@ const ArticleContent = ({
           <Link href={article.articleUrl} target="_blank">
             <Button
               size={"lg"}
-              className="w-1/2 bg-blue-700 text-xl hover:bg-blue-900"
+              className="w-1/2 bg-blue-700 text-xl text-white hover:bg-blue-900"
             >
-              本文を読む
+              READ MORE
             </Button>
           </Link>
         </div>

diff --git a/web/client/src/features/articles/components/ArticleDetailSheet.tsx b/web/client/src/features/articles/components/ArticleDetailSheet.tsx
@@ -23,18 +23,43 @@ import { useParseHtml } from "@/hooks/useParseHtml";
 import { showDiffDateToCurrentDate } from "@/lib/date";
 
 import { ArticleType } from "@/types/article";
+import { FavoriteArticleFolderType } from "@/types/favoriteArticleFolder";
 
-import { useArticleBookmark } from "../hooks/useArticleBookmark";
+import { FollowFavoriteArticleDropdownMenu } from "./DropdownMenu";
 
 type ArticleDetailSheetProps = {
   article: ArticleType;
   user: User | undefined;
+  bookmarkId?: string;
+  isFollowing: boolean;
+  favoriteArticleFolders: Array<FavoriteArticleFolderType>;
+  handleAddBookmark: (articleId: string) => Promise<void>;
+  handleRemoveBookmark: (bookmarkId: string) => Promise<void>;
+  handleCreateFavoriteArticle: (
+    favoriteArticleFolderId: string,
+    createdFavoriteArticleFolder?: FavoriteArticleFolderType
+  ) => Promise<string | undefined>;
+  handleRemoveFavoriteArticle: (
+    favoriteArticleId: string,
+    favoriteArticleFolderId: string
+  ) => Promise<string | undefined>;
+  handleCreateFavoriteArticleFolder: (
+    favoriteArticleFolderId: string
+  ) => Promise<void>;
   children: React.ReactNode;
 };
 
 export const ArticleDetailSheet: FC<ArticleDetailSheetProps> = ({
   article,
   user,
+  bookmarkId,
+  isFollowing,
+  favoriteArticleFolders,
+  handleAddBookmark,
+  handleRemoveBookmark,
+  handleCreateFavoriteArticle,
+  handleRemoveFavoriteArticle,
+  handleCreateFavoriteArticleFolder,
   children,
 }: ArticleDetailSheetProps) => {
   const [open, setOpen] = useState(false);
@@ -56,23 +81,62 @@ export const ArticleDetailSheet: FC<ArticleDetailSheetProps> = ({
         </div>
       </SheetTrigger>
       <SheetContent className="w-[360px] sm:w-[700px] sm:max-w-[700px]">
-        {open && <ArticleContent article={article} user={user} />}
+        {open && (
+          <ArticleDetailSheetContent
+            article={article}
+            user={user}
+            bookmarkId={bookmarkId}
+            isFollowing={isFollowing}
+            favoriteArticleFolders={favoriteArticleFolders}
+            handleAddBookmark={handleAddBookmark}
+            handleRemoveBookmark={handleRemoveBookmark}
+            handleCreateFavoriteArticle={handleCreateFavoriteArticle}
+            handleRemoveFavoriteArticle={handleRemoveFavoriteArticle}
+            handleCreateFavoriteArticleFolder={
+              handleCreateFavoriteArticleFolder
+            }
+          />
+        )}
       </SheetContent>
     </Sheet>
   );
 };
 
-const ArticleContent = ({
+type ArticleDetailSheetContentProps = {
+  article: ArticleType;
+  user?: User;
+  bookmarkId?: string;
+  isFollowing: boolean;
+  favoriteArticleFolders: Array<FavoriteArticleFolderType>;
+  handleAddBookmark: (articleId: string) => Promise<void>;
+  handleRemoveBookmark: (bookmarkId: string) => Promise<void>;
+  handleCreateFavoriteArticle: (
+    favoriteArticleFolderId: string,
+    createdFavoriteArticleFolder?: FavoriteArticleFolderType
+  ) => Promise<string | undefined>;
+  handleRemoveFavoriteArticle: (
+    favoriteArticleId: string,
+    favoriteArticleFolderId: string
+  ) => Promise<string | undefined>;
+  handleCreateFavoriteArticleFolder: (
+    favoriteArticleFolderId: string
+  ) => Promise<void>;
+};
+
+const ArticleDetailSheetContent: FC<ArticleDetailSheetContentProps> = ({
   article,
   user,
-}: {
-  article: ArticleType;
-  user: User | undefined;
+  bookmarkId,
+  isFollowing,
+  favoriteArticleFolders,
+  handleAddBookmark,
+  handleRemoveBookmark,
+  handleCreateFavoriteArticle,
+  handleRemoveFavoriteArticle,
+  handleCreateFavoriteArticleFolder,
 }) => {
   const imageUrl = useCheckImageExist(article.thumbnailURL);
   const { convertParseHtml } = useParseHtml();
-  const { bookmarkId, handleAddBookmark, handleRemoveBookmark } =
-    useArticleBookmark({ article });
 
   const shareUrl = `${process.env.NEXT_PUBLIC_SITE_DOMAIN}/article/${article.id}`;
   const shareTitle = article.title;
@@ -111,7 +175,7 @@ const ArticleContent = ({
           </Link>
           {user && (
             <div className="flex justify-between">
-              <TwitterShareButton title={shareTitle} url={shareUrl}>
+              <TwitterShareButton title={shareTitle} url={article.articleUrl}>
                 <XIcon className="inline-block" size={36} />
               </TwitterShareButton>
               {bookmarkId ? (
@@ -131,6 +195,18 @@ const ArticleContent = ({
                   <MdOutlineBookmarkAdd className="inline-block" size={36} />
                 </Button>
               )}
+              <div className="mx-4  mt-2">
+                <FollowFavoriteArticleDropdownMenu
+                  isFollowing={isFollowing}
+                  articleId={article.id}
+                  favoriteArticleFolders={favoriteArticleFolders}
+                  handleCreateFavoriteArticle={handleCreateFavoriteArticle}
+                  handleRemoveFavoriteArticle={handleRemoveFavoriteArticle}
+                  handleCreateFavoriteArticleFolder={
+                    handleCreateFavoriteArticleFolder
+                  }
+                />
+              </div>
             </div>
           )}
         </div>
@@ -152,7 +228,7 @@ const ArticleContent = ({
         </div>
       </SheetHeader>
 
-      <div className="h-[400px] overflow-y-scroll md:h-[400px]">
+      <div className="h-[500px] overflow-y-scroll">
         <Link href={article.articleUrl} target="_blank">
           {/* eslint-disable-next-line @next/next/no-img-element */}
           <img

diff --git a/web/client/src/features/articles/repository/article.ts b/web/client/src/features/articles/repository/article.ts
@@ -164,6 +164,11 @@ export const getArticles = async ({
     ];
   }
 
+  where = {
+    ...where,
+    isPrivate: false,
+  };
+
   try {
     const res = await prisma.article.findMany({
       take: LIMIT,

diff --git a/web/client/src/features/bookmarks/components/BookmarkCardWrapper.tsx b/web/client/src/features/bookmarks/components/BookmarkCardWrapper.tsx
@@ -347,7 +347,16 @@ export const BookmarkCardWrapper: FC<BookmarkCardWrapperProps> = ({
           </div>
         </div>
 
-        <BookmarkDetailSheet bookmark={bookmark}>
+        <BookmarkDetailSheet
+          user={user}
+          bookmark={bookmark}
+          isFollowing={isFollowing}
+          articleId={showBookmark.articleId || ""}
+          favoriteArticleFolders={showFavoriteArticleFolders}
+          handleCreateFavoriteArticle={handleCreateFavoriteArticle}
+          handleRemoveFavoriteArticle={handleRemoveFavoriteArticle}
+          handleCreateFavoriteArticleFolder={handleCreateFavoriteArticleFolder}
+        >
           <BookmarkCard bookmark={bookmark} />
         </BookmarkDetailSheet>
       </div>