disable the 'connect to a database' button if discovery + detection f…

…eature flag is on (#4972)

Co-authored-by: Neville Samuell <neville@ethyca.com>

CHANGELOG.md

@@ -23,6 +23,7 @@ The types of changes are:
 
 ### Changed
 - Move new data map reporting table out of beta and remove old table from Data Lineage map. [#4963](https://github.com/ethyca/fides/pull/4963)
+- Disable the 'connect to a database' button if the `dataDiscoveryAndDetection` feature flag is enabled [#1455](https://github.com/ethyca/fidesplus/pull/1455)
 
 ### Fixed
 - Fixed an issue where the GPP signal status was prematurely set to `ready` in some scenarios [#4957](https://github.com/ethyca/fides/pull/4957)

clients/admin-ui/cypress/e2e/datasets-classify.cy.ts

@@ -27,7 +27,8 @@ describe("Datasets with Fides Classify", () => {
     cy.wait("@getPlusHealth");
   });
 
-  describe("Creating datasets", () => {
+  describe.skip("Creating datasets", () => {
+    // workflow will be deprecated soon, disabled now with d&d
     it("Shows the classify switch", () => {
       cy.getByTestId("connect-db-btn").click();
 

clients/admin-ui/cypress/e2e/datasets.cy.ts

@@ -321,7 +321,8 @@ describe("Dataset", () => {
       cy.getByTestId("error-yaml").should("contain", "field required");
     });
 
-    it("Can create a dataset by connecting to a database", () => {
+    it.skip("Can create a dataset by connecting to a database", () => {
+      // workflow will be deprecated soon, disabled now with d&d
       cy.intercept("POST", "/api/v1/generate", {
         fixture: "generate/dataset.json",
       }).as("postGenerate");
@@ -344,7 +345,8 @@ describe("Dataset", () => {
       cy.url().should("contain", `dataset/demo_users_dataset`);
     });
 
-    it("Can create a multiple datasets generated by connecting to a database", () => {
+    it.skip("Can create a multiple datasets generated by connecting to a database", () => {
+      // workflow will be deprecated soon, disabled now with d&d
       const connectionString =
         "postgresql://postgres:fidesctl@fidesctl-db:5432/fidesctl_test";
       cy.fixture("generate/dataset.json").then(
@@ -383,7 +385,8 @@ describe("Dataset", () => {
       cy.url().should("contain", `dataset/demo_users_dataset`);
     });
 
-    it("Can render errors when connecting to a database", () => {
+    it.skip("Can render errors when connecting to a database", () => {
+      // workflow will be deprecated soon, disabled now with d&d
       // Update error after #892 when backend gives better errors than 500
       cy.intercept("POST", "/api/v1/generate", {
         statusCode: 500,

clients/admin-ui/src/pages/dataset/new/index.tsx

@@ -1,27 +1,27 @@
-import { Box, Button, Heading, Stack, Text } from "fidesui";
+import { Box, Button, Heading, Stack } from "fidesui";
 import type { NextPage } from "next";
 import { useState } from "react";
 
+import { useFeatures } from "~/features/common/features";
 import Layout from "~/features/common/Layout";
 import BackButton from "~/features/common/nav/v2/BackButton";
 import { DATASET_ROUTE } from "~/features/common/nav/v2/routes";
+import QuestionTooltip from "~/features/common/QuestionTooltip";
 import DatabaseConnectForm from "~/features/dataset/DatabaseConnectForm";
 import DatasetYamlForm from "~/features/dataset/DatasetYamlForm";
 
 const NewDataset: NextPage = () => {
+  const features = useFeatures();
   const [generateMethod, setGenerateMethod] = useState<
     "yaml" | "database" | "manual" | null
   >(null);
   return (
-    <Layout title="Datasets">
+    <Layout title="Create New Dataset">
       <BackButton backPath={DATASET_ROUTE} />
-      <Heading mb={2} fontSize="2xl" fontWeight="semibold">
-        Datasets
+      <Heading mb={8} fontSize="2xl" fontWeight="semibold">
+        Create New Dataset
       </Heading>
       <Stack spacing={8}>
-        <Box w={{ base: "100%", lg: "50%" }}>
-          <Text>Create a dataset using YAML or connect to a database.</Text>
-        </Box>
         <Box>
           <Button
             size="sm"
@@ -31,18 +31,22 @@ const NewDataset: NextPage = () => {
             isActive={generateMethod === "yaml"}
             data-testid="upload-yaml-btn"
           >
-            Upload a new dataset YAML
+            Upload a Dataset YAML
           </Button>
           <Button
             size="sm"
             mr={2}
             variant="outline"
             onClick={() => setGenerateMethod("database")}
             isActive={generateMethod === "database"}
+            isDisabled={features.flags.dataDiscoveryAndDetection}
             data-testid="connect-db-btn"
           >
             Connect to a database
           </Button>
+          {features.flags.dataDiscoveryAndDetection ? (
+            <QuestionTooltip label="Creating a dataset via a database connection is disabled when the 'detection & discovery' beta feature is enabled" />
+          ) : null}
         </Box>
         {generateMethod === "database" && (
           <Box w={{ base: "100%", lg: "50%" }}>