ref(router): Align route params with semantic conventions (#16828)

Rename based on
https://getsentry.github.io/sentry-conventions/generated/attributes/url.html#urlpathparameterkey

Author: s1gr1d

packages/react/src/tanstackrouter.ts

@@ -119,7 +119,9 @@ function routeMatchToParamSpanAttributes(match: VendoredTanstackRouterRouteMatch
 
   const paramAttributes: Record<string, string> = {};
   Object.entries(match.params).forEach(([key, value]) => {
-    paramAttributes[`url.path.params.${key}`] = value;
+    paramAttributes[`url.path.params.${key}`] = value; // todo(v10): remove attribute which does not adhere to Sentry's semantic convention
+    paramAttributes[`url.path.parameter.${key}`] = value;
+    paramAttributes[`params.${key}`] = value; // params.[key] is an alias
   });
 
   return paramAttributes;

packages/vue/src/router.ts

@@ -61,7 +61,8 @@ export function instrumentVueRouter(
     const attributes: SpanAttributes = {};
 
     for (const key of Object.keys(to.params)) {
-      attributes[`params.${key}`] = to.params[key];
+      attributes[`url.path.parameter.${key}`] = to.params[key];
+      attributes[`params.${key}`] = to.params[key]; // params.[key] is an alias
     }
     for (const key of Object.keys(to.query)) {
       const value = to.query[key];

packages/vue/test/router.test.ts

@@ -423,6 +423,7 @@ function getAttributesForRoute(route: Route): SpanAttributes {
   const attributes: SpanAttributes = {};
 
   for (const key of Object.keys(params)) {
+    attributes[`url.path.parameter.${key}`] = params[key];
     attributes[`params.${key}`] = params[key];
   }
   for (const key of Object.keys(query)) {