[ui] resource-tree on large apps causes `RangeError: Maximum call stack size exceeded`

[WesleyCharlesBlake]

Checklist:

• [x] I've searched in the docs and FAQ for my answer: https://bit.ly/argocd-faq.
• [x] I've included steps to reproduce the bug.
• [x] I've pasted the output of argocd version.

Describe the bug

When viewing an application that has a large number of annotations or resources, the UI crashes view this app in resource-tree. when viewing the app in Network or resource list view, I can see the application without the UI crashing

To Reproduce

Im running a storage provisioner that adds multiple PVCs to a stateful set, and in turn adds multiple annotations to each PVC.

Something went wrong!

Consider submitting an issue [here](https://github.com/argoproj/argo-cd/issues/new?labels=bug&template=bug_report.md).

Stacktrace:

RangeError: Maximum call stack size exceeded
    at e.exports (https://foodomain.com/main.08bea4d9f3b3774bfab7.js:2:371302)
    at e.exports (https://foodomain.com/main.08bea4d9f3b3774bfab7.js:2:361022)
    at e.exports (https://foodomain.com/main.08bea4d9f3b3774bfab7.js:2:368614)
    at e.exports [as has] (https://foodomain.com/main.08bea4d9f3b3774bfab7.js:2:378426)
    at s.setEdge (https://foodomain.com/main.08bea4d9f3b3774bfab7.js:2:297789)
    at https://foodomain.com/main.08bea4d9f3b3774bfab7.js:2:1664861
    at Array.forEach (<anonymous>)
    at k (https://foodomain.com/main.08bea4d9f3b3774bfab7.js:2:1664803)
    at https://foodomain.com/main.08bea4d9f3b3774bfab7.js:2:1664893
    at Array.forEach (<anonymous>)

Expected behavior

UI should be able to render application in resource-tree with throwing the stack size exception

Screenshots

Version

Argo CD: v2.11.0+d3f33c0
Build Date: 2024-05-07T16:01:41Z
Go Version: go1.21.9
Go Compiler: gc
Platform: linux/amd64
jsonnet: v0.20.0
kustomize: v5.2.1 2023-10-19T20:13:51Z
Helm: v3.14.3+gf03cc04
kubectl: v0.26.11

Logs argocd-server logs dont show any errors:

time="2024-05-15T10:43:32Z" level=info msg="received unary call /application.ApplicationService/GetApplicationSyncWindows" grpc.method=GetApplicationSyncWindows grpc.request.claims="{\"exp\":1715856206,\"iat\":1715769806,\"iss\":\"argocd\",\"jti\":\"39f1a5d3-dcaa-4f48-9257-a0babac9464c\",\"nbf\":1715769806,\"sub\":\"admin\"}" grpc.request.content="name:\"ONLY_THIS_APP_FAILS\" appNamespace:\"argocd\" " grpc.service=application.ApplicationService grpc.start_time="2024-05-15T10:43:32Z" span.kind=server system=grpc
time="2024-05-15T10:43:32Z" level=info msg="finished unary call with code OK" grpc.code=OK grpc.method=GetApplicationSyncWindows grpc.service=application.ApplicationService grpc.start_time="2024-05-15T10:43:32Z" grpc.time_ms=12.556 span.kind=server system=grpc

Browser console:

main.08bea4d….js:2 RangeError: Maximum call stack size exceeded
    at e.exports (main.<SCRUBBED>….js:2:371407)
    at e.exports (main.<SCRUBBED>….js:2:361022)
    at e.exports (main.<SCRUBBED>….js:2:368614)
    at e.exports [as has] (main.<SCRUBBED>….js:2:378426)
    at s.setEdge (main.<SCRUBBED>….js:2:297789)
    at main.<SCRUBBED>….js:2:1664861
    at Array.forEach (<anonymous>)
    at k (main.08bea4d….js:2:1664803)
    at main.08bea4d….js:2:1664893
    at Array.forEach (<anonymous>

** From degbugging in browser/console logs

The error "RangeError: Maximum call stack size exceeded" indicates that the code is recursively calling itself, resulting in an infinite loop. This is likely caused by a circular reference or an infinite loop in the code. In this case, the error is occurring in the ss function, which is called recursively due to the switch statement. The switch statement is missing a break statement after each case, causing the function to continue executing the following cases even after a match is found. To fix this issue, you should add break statements after each case in the switch statement. This will ensure that the function exits after handling the appropriate case and prevent the recursive loop.

function ss(e, t) {
  switch (t.tag) {
    case 0:
    case 11:
    case 15:
    case 22:
    case 3:
    case 5:
    case 6:
    case 4:
    case 17:
      return;
    case 1:
      if (256 & t.effectTag && null !== e) {
        var n = e.memoizedProps,
          r = e.memoizedState;
        t = (e = t.stateNode).getSnapshotBeforeUpdate(
          t.elementType === t.type ? n : Qo(t.type, n),
          r
        );
        e.__reactInternalSnapshotBeforeUpdate = t;
      }
      break;
  }
  throw Error(i(163));
}```

[WesleyCharlesBlake]

Anybody?

[Marvin9]

Is it possible for you to provide minimal reproducible application?