diff --git a/frontend/src/component/project/NewProjectCard/NewProjectCard.tsx b/frontend/src/component/project/ProjectCard/LegacyProjectCard.tsx similarity index 98% rename from frontend/src/component/project/NewProjectCard/NewProjectCard.tsx rename to frontend/src/component/project/ProjectCard/LegacyProjectCard.tsx index 43c19f8818..e8e88c06be 100644 --- a/frontend/src/component/project/NewProjectCard/NewProjectCard.tsx +++ b/frontend/src/component/project/ProjectCard/LegacyProjectCard.tsx @@ -9,7 +9,7 @@ import { StyledParagraphInfo, StyledProjectCardBody, StyledIconBox, -} from './NewProjectCard.styles'; +} from './ProjectCard.styles'; import { ProjectCardFooter } from './ProjectCardFooter/ProjectCardFooter'; import { ProjectModeBadge } from './ProjectModeBadge/ProjectModeBadge'; import type { ProjectSchemaOwners } from 'openapi'; diff --git a/frontend/src/component/project/NewProjectCard/ProjectArchiveCard.tsx b/frontend/src/component/project/ProjectCard/ProjectArchiveCard.tsx similarity index 99% rename from frontend/src/component/project/NewProjectCard/ProjectArchiveCard.tsx rename to frontend/src/component/project/ProjectCard/ProjectArchiveCard.tsx index b0123a7a15..2390868722 100644 --- a/frontend/src/component/project/NewProjectCard/ProjectArchiveCard.tsx +++ b/frontend/src/component/project/ProjectCard/ProjectArchiveCard.tsx @@ -8,7 +8,7 @@ import { StyledProjectCardBody, StyledIconBox, StyledActions, -} from './NewProjectCard.styles'; +} from './ProjectCard.styles'; import { ProjectCardFooter } from './ProjectCardFooter/ProjectCardFooter'; import { ProjectModeBadge } from './ProjectModeBadge/ProjectModeBadge'; import type { ProjectSchemaOwners } from 'openapi'; diff --git a/frontend/src/component/project/NewProjectCard/NewProjectCard.styles.ts b/frontend/src/component/project/ProjectCard/ProjectCard.styles.ts similarity index 100% rename from frontend/src/component/project/NewProjectCard/NewProjectCard.styles.ts rename to frontend/src/component/project/ProjectCard/ProjectCard.styles.ts diff --git a/frontend/src/component/project/ProjectCard/ProjectCard.tsx b/frontend/src/component/project/ProjectCard/ProjectCard.tsx new file mode 100644 index 0000000000..e8e88c06be --- /dev/null +++ b/frontend/src/component/project/ProjectCard/ProjectCard.tsx @@ -0,0 +1,85 @@ +import { DEFAULT_PROJECT_ID } from 'hooks/api/getters/useDefaultProject/useDefaultProjectId'; +import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; +import { + StyledProjectCard, + StyledDivHeader, + StyledBox, + StyledCardTitle, + StyledDivInfo, + StyledParagraphInfo, + StyledProjectCardBody, + StyledIconBox, +} from './ProjectCard.styles'; +import { ProjectCardFooter } from './ProjectCardFooter/ProjectCardFooter'; +import { ProjectModeBadge } from './ProjectModeBadge/ProjectModeBadge'; +import type { ProjectSchemaOwners } from 'openapi'; +import { ProjectIcon } from 'component/common/ProjectIcon/ProjectIcon'; +import { FavoriteAction } from './ProjectCardFooter/FavoriteAction/FavoriteAction'; + +interface IProjectCardProps { + name: string; + featureCount: number; + health: number; + memberCount?: number; + id: string; + onHover: () => void; + favorite?: boolean; + mode: string; + owners?: ProjectSchemaOwners; +} + +export const ProjectCard = ({ + name, + featureCount, + health, + memberCount = 0, + onHover, + id, + mode, + favorite = false, + owners, +}: IProjectCardProps) => ( + + + + + + + + {name} + + + + +
+ + {featureCount} + +

{featureCount === 1 ? 'flag' : 'flags'}

+
+ + + {memberCount} + +

+ {memberCount === 1 ? 'member' : 'members'} +

+ + } + /> +
+ + {health}% + +

healthy

+
+
+
+ + + +
+); diff --git a/frontend/src/component/project/NewProjectCard/ProjectCardFooter/FavoriteAction/FavoriteAction.tsx b/frontend/src/component/project/ProjectCard/ProjectCardFooter/FavoriteAction/FavoriteAction.tsx similarity index 100% rename from frontend/src/component/project/NewProjectCard/ProjectCardFooter/FavoriteAction/FavoriteAction.tsx rename to frontend/src/component/project/ProjectCard/ProjectCardFooter/FavoriteAction/FavoriteAction.tsx diff --git a/frontend/src/component/project/NewProjectCard/ProjectCardFooter/ProjectCardFooter.tsx b/frontend/src/component/project/ProjectCard/ProjectCardFooter/ProjectCardFooter.tsx similarity index 100% rename from frontend/src/component/project/NewProjectCard/ProjectCardFooter/ProjectCardFooter.tsx rename to frontend/src/component/project/ProjectCard/ProjectCardFooter/ProjectCardFooter.tsx diff --git a/frontend/src/component/project/NewProjectCard/ProjectModeBadge/ProjectModeBadge.tsx b/frontend/src/component/project/ProjectCard/ProjectModeBadge/ProjectModeBadge.tsx similarity index 100% rename from frontend/src/component/project/NewProjectCard/ProjectModeBadge/ProjectModeBadge.tsx rename to frontend/src/component/project/ProjectCard/ProjectModeBadge/ProjectModeBadge.tsx diff --git a/frontend/src/component/project/NewProjectCard/ProjectOwners/ProjectOwners.tsx b/frontend/src/component/project/ProjectCard/ProjectOwners/ProjectOwners.tsx similarity index 100% rename from frontend/src/component/project/NewProjectCard/ProjectOwners/ProjectOwners.tsx rename to frontend/src/component/project/ProjectCard/ProjectOwners/ProjectOwners.tsx diff --git a/frontend/src/component/project/ProjectList/ArchiveProjectList.tsx b/frontend/src/component/project/ProjectList/ArchiveProjectList.tsx index 1134c3a7a9..84c3897f90 100644 --- a/frontend/src/component/project/ProjectList/ArchiveProjectList.tsx +++ b/frontend/src/component/project/ProjectList/ArchiveProjectList.tsx @@ -11,7 +11,7 @@ import { ProjectGroup } from './ProjectGroup'; import { ProjectArchiveCard, type ProjectArchiveCardProps, -} from '../NewProjectCard/ProjectArchiveCard'; +} from '../ProjectCard/ProjectArchiveCard'; import useProjects from 'hooks/api/getters/useProjects/useProjects'; import { ReviveProjectDialog } from './ReviveProjectDialog/ReviveProjectDialog'; import { DeleteProjectDialogue } from '../Project/DeleteProject/DeleteProjectDialogue'; diff --git a/frontend/src/component/project/ProjectList/ProjectGroup.tsx b/frontend/src/component/project/ProjectList/ProjectGroup.tsx index da58c08eb9..787344efd5 100644 --- a/frontend/src/component/project/ProjectList/ProjectGroup.tsx +++ b/frontend/src/component/project/ProjectList/ProjectGroup.tsx @@ -1,7 +1,7 @@ import type { ComponentType } from 'react'; import { Link } from 'react-router-dom'; import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; -import { ProjectCard } from '../NewProjectCard/NewProjectCard'; +import { ProjectCard as LegacyProjectCard } from '../ProjectCard/LegacyProjectCard'; import type { IProjectCard } from 'interfaces/project'; import loadingData from './loadingData'; @@ -40,7 +40,7 @@ export const ProjectGroup = ({ loading, searchValue, placeholder = 'No projects available.', - ProjectCardComponent = ProjectCard, + ProjectCardComponent = LegacyProjectCard, link = true, }: ProjectGroupProps) => { return ( @@ -82,7 +82,7 @@ export const ProjectGroup = ({ <> {loadingData.map( (project: IProjectCard) => ( - {}} key={project.id}