fix: member progress (#8188)

* fix: member progress

* fix: remove question check

* refactor: resource meta

src/components/TeamProgress/MemberProgressModal.tsx

@@ -18,6 +18,9 @@ import { pageProgressMessage } from '../../stores/page';
 import { MemberProgressModalHeader } from './MemberProgressModalHeader';
 import { replaceChildren } from '../../lib/dom.ts';
 import { XIcon } from 'lucide-react';
+import type { PageType } from '../CommandMenu/CommandMenu.tsx';
+import { renderFlowJSON } from '../../../editor/renderer/renderer.ts';
+import { getResourceMeta } from '../../lib/roadmap.ts';
 
 export type ProgressMapProps = {
   member: TeamMember;
@@ -88,14 +91,24 @@ export function MemberProgressModal(props: ProgressMapProps) {
   }
 
   async function renderResource(jsonUrl: string) {
+    const page = await getResourceMeta(resourceType, resourceId);
+    if (!page) {
+      toast.error('Resource not found');
+      return;
+    }
+
+    const renderer = page.renderer || 'balsamiq';
+
     const res = await fetch(jsonUrl, {});
     const json = await res.json();
-    const svg: SVGElement | null = await wireframeJSONToSVG(json, {
-      fontURL: '/fonts/balsamiq.woff2',
-    });
+    const svg =
+      renderer === 'editor'
+        ? await renderFlowJSON(json as any)
+        : await wireframeJSONToSVG(json, {
+            fontURL: '/fonts/balsamiq.woff2',
+          });
 
     replaceChildren(containerEl.current!, svg);
-    // containerEl.current?.replaceChildren(svg);
   }
 
   useKeydown('Escape', () => {
@@ -136,10 +149,10 @@ export function MemberProgressModal(props: ProgressMapProps) {
           skipped = [],
         } = memberProgress;
 
-        done.forEach((id: string) => renderTopicProgress(id, 'done'));
-        learning.forEach((id: string) => renderTopicProgress(id, 'learning'));
-        skipped.forEach((id: string) => renderTopicProgress(id, 'skipped'));
-        removed.forEach((id: string) => renderTopicProgress(id, 'removed'));
+        done.forEach((id) => renderTopicProgress(id, 'done'));
+        learning.forEach((id) => renderTopicProgress(id, 'learning'));
+        skipped.forEach((id) => renderTopicProgress(id, 'skipped'));
+        removed.forEach((id) => renderTopicProgress(id, 'removed'));
       })
       .catch((err) => {
         console.error(err);

src/components/UserProgress/UserProgressModal.tsx

@@ -11,7 +11,6 @@ import { useAuth } from '../../hooks/use-auth';
 import { ModalLoader } from './ModalLoader.tsx';
 import { UserProgressModalHeader } from './UserProgressModalHeader';
 import { X } from 'lucide-react';
-import type { PageType } from '../CommandMenu/CommandMenu.tsx';
 import type { AllowedRoadmapRenderer } from '../../lib/roadmap.ts';
 import { renderFlowJSON } from '../../../editor/renderer/renderer.ts';
 

src/lib/roadmap.ts

@@ -1,4 +1,7 @@
+import type { PageType } from '../components/CommandMenu/CommandMenu';
 import type { MarkdownFileType } from './file';
+import { httpGet } from './http';
+import type { ResourceType } from './resource-progress';
 
 export function resourceTitleFromId(id: string): string {
   if (id === 'devops') {
@@ -150,3 +153,29 @@ export async function getRoadmapFaqsById(roadmapId: string): Promise<string[]> {
 
   return faqs || [];
 }
+
+export async function getResourceMeta(
+  resourceType: ResourceType,
+  resourceId: string,
+) {
+  const { error, response } = await httpGet<PageType[]>(`/pages.json`);
+  if (error || !response) {
+    return null;
+  }
+
+  const page = response.find((page) => {
+    if (resourceType === 'roadmap') {
+      return page.url === `/${resourceId}`;
+    } else if (resourceType === 'best-practice') {
+      return page.url === `/best-practices/${resourceId}`;
+    }
+
+    return false;
+  });
+
+  if (!page) {
+    return null;
+  }
+
+  return page;
+}