fix: 🐛 qr code disappear for projects that have it and new tabs mapping for url params (#818)

Author: phoebus-84

.beads/deletions.jsonl

@@ -2,3 +2,4 @@
 {"id":"interfacer-gui-9lv.13","ts":"2025-12-11T13:40:28.675257Z","by":"git-history-backfill","reason":"recovered from git history (pruned from manifest)"}
 {"id":"interfacer-gui-9lv.12","ts":"2025-12-11T13:40:28.681444Z","by":"git-history-backfill","reason":"recovered from git history (pruned from manifest)"}
 {"id":"interfacer-gui-9lv.14","ts":"2025-12-11T13:40:28.687578Z","by":"git-history-backfill","reason":"recovered from git history (pruned from manifest)"}
+{"id":"interfacer-gui-yig.14","ts":"2026-02-06T15:05:42.2713Z","by":"git-history-backfill","reason":"recovered from git history (pruned from manifest)"}

components/partials/project/[id]/ProjectTabs.tsx

@@ -83,13 +83,13 @@ const ProjectTabs = () => {
   // Map tab IDs to their indices for URL parameter handling
   const allTabsMap: Record<string, number> = {
     overview: 0,
-    relationships: 1,
-    included: 1,
-    graph: 2,
-    contributors: 3,
-    contributions: 4,
-    dpp: 5,
-    gc1dpp: 5,
+    relationships: 0,
+    included: 0,
+    graph: 1,
+    contributors: 2,
+    contributions: 3,
+    dpp: 4,
+    gc1dpp: 4,
   };
 
   // Mark page as loaded after client-side mount and check for tab parameter

components/partials/project/[id]/sidebar/ContributionsCard.tsx

@@ -1,4 +1,4 @@
-import { useQuery } from "@apollo/client";
+import { gql, useQuery } from "@apollo/client";
 import { Button, Card, Stack, Text } from "@bbtgnn/polaris-interfacer";
 import { ListBoxes, MagicWand } from "@carbon/icons-react";
 import { useProject } from "components/layout/FetchProjectLayout";
@@ -9,8 +9,42 @@ import { ResourceProposalsQuery, ResourceProposalsQueryVariables } from "lib/typ
 import { useTranslation } from "next-i18next";
 import { useRouter } from "next/router";
 import { useProjectTabs } from "pages/project/[id]";
+import { useMemo } from "react";
 import QRCode from "react-qr-code";
 
+// Query to get traceDpp for extracting DPP service ULID
+const QUERY_TRACE_DPP = gql`
+  query getTraceDpp($id: ID!) {
+    economicResource(id: $id) {
+      traceDpp
+    }
+  }
+`;
+
+// Helper function to recursively find DPP service ULID from traceDpp tree
+function extractDppServiceUlid(traceDpp: any[]): string | undefined {
+  let dppServiceUlid: string | undefined;
+
+  function traverse(node: any) {
+    if (!node || dppServiceUlid) return;
+
+    if (node.type === "EconomicResource" && node.node?.metadata?.dppServiceUlid) {
+      dppServiceUlid = node.node.metadata.dppServiceUlid;
+      return;
+    }
+
+    if (node.children && Array.isArray(node.children)) {
+      node.children.forEach(traverse);
+    }
+  }
+
+  if (Array.isArray(traceDpp)) {
+    traceDpp.forEach(traverse);
+  }
+
+  return dppServiceUlid;
+}
+
 const ContributionsCard = () => {
   const { project } = useProject();
   const { setSelected } = useProjectTabs();
@@ -25,11 +59,19 @@ const ContributionsCard = () => {
       variables: { id: id as string },
     }
   );
+  const { data: traceDppData } = useQuery(QUERY_TRACE_DPP, {
+    variables: { id: project?.id },
+    skip: !project?.id,
+  });
   const url = window.location.protocol + "//" + window.location.host + `/project/${project.id}?tab=gc1dpp`;
+  const dppServiceUlid = useMemo(() => {
+    if (!traceDppData?.economicResource?.traceDpp) return undefined;
+    return extractDppServiceUlid(traceDppData.economicResource.traceDpp);
+  }, [traceDppData]);
+  const dppUlid = dppServiceUlid || project.metadata?.dpp;
+  const showDppQr = project.conformsTo?.name === "Product" && !!dppUlid;
 
   const contributionsCount = contributions?.proposals.edges.length || 0;
-  const isProduct = project.conformsTo?.name === "Product";
-  const hasDpp = !!project.metadata?.dpp;
 
   return (
     <Card sectioned>
@@ -72,7 +114,7 @@ const ContributionsCard = () => {
         >
           {t("Make a contribution")}
         </Button>
-        {isProduct && hasDpp && (
+        {showDppQr && (
           <>
             <Text as="h2" variant="headingMd">
               {t("DPP QR-Code")}