From 258238ef176cb2c8befcafb08111a727153f0157 Mon Sep 17 00:00:00 2001
From: David Hartunian <davidh@cockroachlabs.com>
Date: Fri, 8 Nov 2024 20:22:49 +0000
Subject: [PATCH] ui: add Redact option to stmt diag activation modal

When users with the `VIEWACTIVITY` role activate statement diagnostics
via the modal in SQL Activity, they now have the option to redact the
output via a checkbox.

Resolves: #119040
Epic: CRDB-37557

Release note (ui change): when activating statement diagnostics in
the DB Console, users now have the option to produce a redacted bundle
as output. This bundle will omit sensitive data.
---
 .../cluster-ui/src/api/statementDiagnosticsApi.ts          | 2 ++
 .../activateStatementDiagnosticsModal.tsx                  | 7 +++++++
 .../statementDiagnostics.sagas.spec.ts                     | 1 +
 .../src/redux/statements/statementsSagas.spec.ts           | 2 ++
 4 files changed, 12 insertions(+)

diff --git a/pkg/ui/workspaces/cluster-ui/src/api/statementDiagnosticsApi.ts b/pkg/ui/workspaces/cluster-ui/src/api/statementDiagnosticsApi.ts
index c82986c7e6fc..a7fb4122645b 100644
--- a/pkg/ui/workspaces/cluster-ui/src/api/statementDiagnosticsApi.ts
+++ b/pkg/ui/workspaces/cluster-ui/src/api/statementDiagnosticsApi.ts
@@ -54,6 +54,7 @@ export type InsertStmtDiagnosticRequest = {
   minExecutionLatencySeconds?: number;
   expiresAfterSeconds?: number;
   planGist: string;
+  redacted: boolean;
 };
 
 export type InsertStmtDiagnosticResponse = {
@@ -73,6 +74,7 @@ export async function createStatementDiagnosticsReport(
       min_execution_latency: NumberToDuration(req.minExecutionLatencySeconds),
       expires_after: NumberToDuration(req.expiresAfterSeconds),
       plan_gist: req.planGist,
+      redacted: req.redacted,
     }),
   ).then(response => {
     return {
diff --git a/pkg/ui/workspaces/cluster-ui/src/statementsDiagnostics/activateStatementDiagnosticsModal.tsx b/pkg/ui/workspaces/cluster-ui/src/statementsDiagnostics/activateStatementDiagnosticsModal.tsx
index ff570e79e3f1..598ebba22a4b 100644
--- a/pkg/ui/workspaces/cluster-ui/src/statementsDiagnostics/activateStatementDiagnosticsModal.tsx
+++ b/pkg/ui/workspaces/cluster-ui/src/statementsDiagnostics/activateStatementDiagnosticsModal.tsx
@@ -55,6 +55,7 @@ export const ActivateStatementDiagnosticsModal = React.forwardRef<
   const [minExecLatencyUnit, setMinExecLatencyUnit] = useState("milliseconds");
   const [expiresAfter, setExpiresAfter] = useState(15);
   const [traceSampleRate, setTraceSampleRate] = useState(0.01);
+  const [redacted, setRedacted] = useState(false);
 
   const handleSelectChange = (value: string) => {
     setMinExecLatencyUnit(value);
@@ -95,6 +96,7 @@ export const ActivateStatementDiagnosticsModal = React.forwardRef<
       ),
       expiresAfterSeconds: getExpiresAfter(expires, expiresAfter),
       samplingProbability: getTraceSampleRate(conditional, traceSampleRate),
+      redacted: redacted,
     });
     setVisible(false);
   }, [
@@ -108,6 +110,7 @@ export const ActivateStatementDiagnosticsModal = React.forwardRef<
     traceSampleRate,
     filterPerPlanGist,
     selectedPlanGist,
+    redacted,
   ]);
 
   const onCancelHandler = useCallback(() => setVisible(false), []);
@@ -313,6 +316,10 @@ export const ActivateStatementDiagnosticsModal = React.forwardRef<
               />
             </div>
           )}
+          <Divider type="horizontal" />
+          <Checkbox checked={redacted} onChange={() => setRedacted(!redacted)}>
+            <Text>Redact</Text>
+          </Checkbox>
         </Space>
       </ConfigProvider>
     </Modal>
diff --git a/pkg/ui/workspaces/cluster-ui/src/store/statementDiagnostics/statementDiagnostics.sagas.spec.ts b/pkg/ui/workspaces/cluster-ui/src/store/statementDiagnostics/statementDiagnostics.sagas.spec.ts
index 85706b9c38db..a9a0e6574be6 100644
--- a/pkg/ui/workspaces/cluster-ui/src/store/statementDiagnostics/statementDiagnostics.sagas.spec.ts
+++ b/pkg/ui/workspaces/cluster-ui/src/store/statementDiagnostics/statementDiagnostics.sagas.spec.ts
@@ -39,6 +39,7 @@ describe("statementsDiagnostics sagas", () => {
       minExecutionLatencySeconds: minExecLatency,
       expiresAfterSeconds: expiresAfter,
       planGist: planGist,
+      redacted: false,
     };
 
     const insertResponse: InsertStmtDiagnosticResponse = {
diff --git a/pkg/ui/workspaces/db-console/src/redux/statements/statementsSagas.spec.ts b/pkg/ui/workspaces/db-console/src/redux/statements/statementsSagas.spec.ts
index 23eaf413ef17..40573251f4cc 100644
--- a/pkg/ui/workspaces/db-console/src/redux/statements/statementsSagas.spec.ts
+++ b/pkg/ui/workspaces/db-console/src/redux/statements/statementsSagas.spec.ts
@@ -41,6 +41,7 @@ describe("statementsSagas", () => {
         minExecutionLatencySeconds: minExecLatency,
         expiresAfterSeconds: expiresAfter,
         planGist: planGist,
+        redacted: false,
       };
       const action = createStatementDiagnosticsReportAction(
         insertStmtDiagnosticsRequest,
@@ -72,6 +73,7 @@ describe("statementsSagas", () => {
       minExecutionLatencySeconds: minExecLatency,
       expiresAfterSeconds: expiresAfter,
       planGist: planGist,
+      redacted: false,
     };
     const action = createStatementDiagnosticsReportAction(
       insertStmtDiagnosticsRequest,