Add project status

src/components/Projects/ProjectCard.tsx

@@ -24,10 +24,8 @@ export function ProjectCard(props: ProjectCardProps) {
   const { project, userCount = 0, status } = props;
   const { frontmatter, id } = project;
 
-  const isAuthed = isLoggedIn();
-  const isLoadingStatus = isAuthed && status === undefined;
-  const userStartedCount =
-    status && status !== 'none' ? userCount + 1 : userCount;
+  const isLoadingStatus = status === undefined;
+  const userStartedCount = status !== 'none' && userCount === 0 ? userCount + 1 : userCount;
 
   return (
     <a
@@ -62,7 +60,7 @@ export function ProjectCard(props: ProjectCardProps) {
               )}
             </span>
 
-            {status !== 'none' && isAuthed && (
+            {status !== 'none' && (
               <span
                 className={cn(
                   'flex items-center gap-1.5 rounded-full border border-current px-2 py-0.5 capitalize',

src/components/Projects/ProjectsList.tsx

@@ -61,6 +61,11 @@ export function ProjectsList(props: ProjectsListProps) {
     useState<ListProjectStatusesResponse>();
 
   const loadProjectStatuses = async () => {
+    if (!isLoggedIn()) {
+      setProjectStatuses({});
+      return;
+    }
+
     const projectIds = projects.map((project) => project.id);
     const { response, error } = await httpPost(
       `${import.meta.env.PUBLIC_API_URL}/v1-list-project-statuses`,
@@ -99,10 +104,6 @@ export function ProjectsList(props: ProjectsListProps) {
     : projects;
 
   useEffect(() => {
-    if (!isLoggedIn()) {
-      return;
-    }
-
     loadProjectStatuses().finally();
   }, []);
 
@@ -172,7 +173,7 @@ export function ProjectsList(props: ProjectsListProps) {
                 userCount={count}
                 status={
                   projectStatuses
-                    ? (projectStatuses?.[matchingProject.id] ?? 'none')
+                    ? (projectStatuses?.[matchingProject.id] || 'none')
                     : undefined
                 }
               />

src/components/Projects/ProjectsPage.tsx

@@ -190,6 +190,7 @@ export function ProjectsPage(props: ProjectsPageProps) {
                 key={project.id}
                 project={project}
                 userCount={userCounts[project.id] || 0}
+                status={'none'}
               />
             ))}
           </div>