fix(insights): transaction names with quotes break caches (#74667)

fixes #74554 

The above issue was a result in the transaction duration query sending
the list of transactions without the quotes escaped .

Author: DominikB2014

static/app/views/insights/cache/views/cacheLandingPage.spec.tsx

@@ -182,6 +182,67 @@ describe('CacheLandingPage', function () {
     );
   });
 
+  it('should escape quote in transaction name', async function () {
+    requestMocks.spanTransactionList.mockClear();
+    requestMocks.spanTransactionList = MockApiClient.addMockResponse({
+      url: `/organizations/${organization.slug}/events/`,
+      method: 'GET',
+      match: [
+        MockApiClient.matchQuery({
+          referrer: 'api.performance.cache.landing-cache-transaction-list',
+        }),
+      ],
+      body: {
+        data: [
+          {
+            transaction: 'transaction with "quote"',
+            project: 'backend',
+            'project.id': 123,
+            'avg(cache.item_size)': 123,
+            'spm()': 123,
+            'sum(span.self_time)': 123,
+            'cache_miss_rate()': 0.123,
+            'time_spent_percentage()': 0.123,
+          },
+        ],
+        meta: {
+          fields: {
+            transaction: 'string',
+            project: 'string',
+            'project.id': 'integer',
+            'avg(cache.item_size)': 'number',
+            'spm()': 'rate',
+            'sum(span.self_time)': 'duration',
+            'cache_miss_rate()': 'percentage',
+            'time_spent_percentage()': 'percentage',
+          },
+          units: {},
+        },
+      },
+    });
+
+    render(<CacheLandingPage />, {organization});
+
+    await waitForElementToBeRemoved(() => screen.queryAllByTestId('loading-indicator'));
+
+    expect(requestMocks.transactionDurations).toHaveBeenCalledWith(
+      `/organizations/${organization.slug}/events/`,
+      expect.objectContaining({
+        method: 'GET',
+        query: {
+          dataset: 'metrics',
+          environment: [],
+          field: ['avg(transaction.duration)', 'transaction'],
+          per_page: 50,
+          project: [],
+          query: 'transaction:["transaction with \\"quote\\""]',
+          referrer: 'api.performance.cache.landing-cache-transaction-duration',
+          statsPeriod: '10d',
+        },
+      })
+    );
+  });
+
   it('renders a list of transactions', async function () {
     render(<CacheLandingPage />, {organization});
     await waitForElementToBeRemoved(() => screen.queryAllByTestId('loading-indicator'));

static/app/views/insights/cache/views/cacheLandingPage.tsx

@@ -134,7 +134,7 @@ export function CacheLandingPage() {
     isFetching: isTransactionDurationFetching,
   } = useMetrics(
     {
-      search: `transaction:[${transactionsList.map(({transaction}) => `"${transaction}"`).join(',')}]`,
+      search: `transaction:[${transactionsList.map(({transaction}) => `"${transaction.replaceAll('"', '\\"')}"`).join(',')}]`,
       fields: [`avg(transaction.duration)`, 'transaction'],
       enabled: !isTransactionsListFetching && transactionsList.length > 0,
     },