From 774d4234bbb625fb0cb254cca869caa3d2c7205b Mon Sep 17 00:00:00 2001
From: sjaanus <sellinjaanus@gmail.com>
Date: Wed, 5 Oct 2022 10:51:47 +0200
Subject: [PATCH] Remove member count for default project (#2131)

* Remove member count from default project

* Remove dependencies
---
 .../Project/ProjectInfo/ProjectInfo.tsx       | 64 ++++++++++---------
 .../project/ProjectCard/ProjectCard.tsx       | 18 ++++--
 2 files changed, 46 insertions(+), 36 deletions(-)

diff --git a/frontend/src/component/project/Project/ProjectInfo/ProjectInfo.tsx b/frontend/src/component/project/Project/ProjectInfo/ProjectInfo.tsx
index 5c031eeed8..29e7c244b2 100644
--- a/frontend/src/component/project/Project/ProjectInfo/ProjectInfo.tsx
+++ b/frontend/src/component/project/Project/ProjectInfo/ProjectInfo.tsx
@@ -16,6 +16,7 @@ import {
     AccordionSummary,
 } from '@mui/material';
 import { UPDATE_PROJECT } from 'component/providers/AccessProvider/permissions';
+import { DEFAULT_PROJECT_ID } from '../../../../hooks/api/getters/useDefaultProject/useDefaultProjectId';
 
 interface IProjectInfoProps {
     id: string;
@@ -125,7 +126,6 @@ const ProjectInfo = ({
                         <p>projectId: {id}</p>
                     </div>
                 </div>
-
                 <div className={styles.infoSection}>
                     <div data-loading className={styles.percentageContainer}>
                         <PercentageCircle percentage={health} />
@@ -154,35 +154,39 @@ const ProjectInfo = ({
                         />
                     </Link>
                 </div>
-
-                <div
-                    className={styles.infoSection}
-                    style={{ marginBottom: '0' }}
-                >
-                    <p className={styles.subtitle} data-loading>
-                        Project members
-                    </p>
-                    <p data-loading className={styles.emphazisedText}>
-                        {memberCount}
-                    </p>
-                    <Link
-                        data-loading
-                        className={classnames(
-                            themeStyles.flexRow,
-                            themeStyles.justifyCenter,
-                            styles.infoLink
-                        )}
-                        to={link}
-                    >
-                        <span className={styles.linkText} data-loading>
-                            view more{' '}
-                        </span>
-                        <ArrowForwardIcon
-                            data-loading
-                            className={styles.arrowIcon}
-                        />
-                    </Link>
-                </div>
+                <ConditionallyRender
+                    condition={id !== DEFAULT_PROJECT_ID}
+                    show={
+                        <div
+                            className={styles.infoSection}
+                            style={{ marginBottom: '0' }}
+                        >
+                            <p className={styles.subtitle} data-loading>
+                                Project members
+                            </p>
+                            <p data-loading className={styles.emphazisedText}>
+                                {memberCount}
+                            </p>
+                            <Link
+                                data-loading
+                                className={classnames(
+                                    themeStyles.flexRow,
+                                    themeStyles.justifyCenter,
+                                    styles.infoLink
+                                )}
+                                to={link}
+                            >
+                                <span className={styles.linkText} data-loading>
+                                    view more{' '}
+                                </span>
+                                <ArrowForwardIcon
+                                    data-loading
+                                    className={styles.arrowIcon}
+                                />
+                            </Link>
+                        </div>
+                    }
+                />
             </div>
         </aside>
     );
diff --git a/frontend/src/component/project/ProjectCard/ProjectCard.tsx b/frontend/src/component/project/ProjectCard/ProjectCard.tsx
index 3c4bc2cd43..37e916bbd6 100644
--- a/frontend/src/component/project/ProjectCard/ProjectCard.tsx
+++ b/frontend/src/component/project/ProjectCard/ProjectCard.tsx
@@ -15,6 +15,7 @@ import AccessContext from 'contexts/AccessContext';
 import { DEFAULT_PROJECT_ID } from 'hooks/api/getters/useDefaultProject/useDefaultProjectId';
 import useUiConfig from 'hooks/api/getters/useUiConfig/useUiConfig';
 import { DeleteProjectDialogue } from '../Project/DeleteProject/DeleteProjectDialogue';
+import { ConditionallyRender } from '../../common/ConditionallyRender/ConditionallyRender';
 
 interface IProjectCardProps {
     name: string;
@@ -120,12 +121,17 @@ export const ProjectCard = ({
                     <p data-loading>health</p>
                 </div>
 
-                <div className={classes.infoBox}>
-                    <p className={classes.infoStats} data-loading>
-                        {memberCount}
-                    </p>
-                    <p data-loading>members</p>
-                </div>
+                <ConditionallyRender
+                    condition={id !== DEFAULT_PROJECT_ID}
+                    show={
+                        <div className={classes.infoBox}>
+                            <p className={classes.infoStats} data-loading>
+                                {memberCount}
+                            </p>
+                            <p data-loading>members</p>
+                        </div>
+                    }
+                />
             </div>
             <DeleteProjectDialogue
                 project={id}