Shared:Components:ArticleItem: add link

packages/shared/components/article-item/ArticleItem.tsx

@@ -26,6 +26,7 @@
 
 import React from "react";
 import { ReactSVG } from "react-svg";
+import { Link } from "react-router-dom";
 
 import { Text } from "../text";
 
@@ -69,6 +70,7 @@ export const ArticleItemPure = (props: ArticleItemProps) => {
     badgeTitle,
     $currentColorScheme,
     title,
+    linkData,
   } = props;
 
   const onClickAction = (e: React.MouseEvent) => {
@@ -105,6 +107,11 @@ export const ArticleItemPure = (props: ArticleItemProps) => {
 
   const renderItem = () => {
     return (
+      <Link
+        style={{ textDecoration: "none" }}
+        to={linkData?.path}
+        state={linkData?.state}
+      >
         <StyledArticleItemTheme
           className={className}
           style={style}
@@ -161,6 +168,7 @@ export const ArticleItemPure = (props: ArticleItemProps) => {
             </StyledArticleItemBadgeWrapper>
           )}
         </StyledArticleItemTheme>
+      </Link>
     );
   };
 

packages/shared/components/article-item/ArticleItem.types.ts

@@ -26,6 +26,21 @@
 
 import { TColorScheme } from "../../themes";
 
+export type TArticleLinkDataState =
+  | {
+      title: string;
+      isRoot: boolean;
+      isPublicRoomType: boolean;
+      rootFolderType: number;
+      canCreate: boolean;
+    }
+  | {};
+
+export type TArticleLinkData = {
+  path: string;
+  state: TArticleLinkDataState;
+};
+
 export interface ArticleItemProps {
   /** Accepts className */
   className?: string;
@@ -70,4 +85,5 @@ export interface ArticleItemProps {
   badgeTitle?: string;
   $currentColorScheme?: TColorScheme;
   title?: string;
+  linkData: TArticleLinkData;
 }