From 71c376a49079998cf5c19055405df14ff739bae8 Mon Sep 17 00:00:00 2001
From: Sebastian Sangervasi <sebastian@ethyca.com>
Date: Thu, 8 Sep 2022 11:58:34 -0700
Subject: [PATCH 1/5] ui/dataset: Spacing improvements for generate form

---
 .../features/dataset/DatabaseConnectForm.tsx  | 47 ++++++++++---------
 1 file changed, 25 insertions(+), 22 deletions(-)

diff --git a/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx b/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx
index 2153ea5928..c5d3f6d01e 100644
--- a/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx
+++ b/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx
@@ -1,4 +1,4 @@
-import { Box, Button, Spinner, Text, useToast } from "@fidesui/react";
+import { Box, Button, Text, useToast, VStack } from "@fidesui/react";
 import { SerializedError } from "@reduxjs/toolkit";
 import { FetchBaseQueryError } from "@reduxjs/toolkit/dist/query";
 import { Form, Formik, FormikHelpers } from "formik";
@@ -34,6 +34,8 @@ const DatabaseConnectForm = () => {
   const organizationKey = "default_organization";
   const [generate, { isLoading: isGenerating }] = useGenerateDatasetMutation();
   const [createDataset, { isLoading: isCreating }] = useCreateDatasetMutation();
+  const isLoading = isGenerating || isCreating;
+
   const toast = useToast();
   const router = useRouter();
 
@@ -91,27 +93,28 @@ const DatabaseConnectForm = () => {
     >
       {({ isSubmitting }) => (
         <Form>
-          <Text size="sm" color="gray.700" mb={8}>
-            Connect to one of your databases using a connection URL. You may
-            have received this URL from a colleague or your Ethyca developer
-            support engineer.
-          </Text>
-          <Box mb={8}>
-            <CustomTextInput name="url" label="Database URL" />
-          </Box>
-          <Box display="flex" alignItems="center">
-            <Button
-              size="sm"
-              colorScheme="primary"
-              type="submit"
-              disabled={isSubmitting}
-              mr="2"
-              data-testid="create-dataset-btn"
-            >
-              Create dataset
-            </Button>
-            {isGenerating || isCreating ? <Spinner /> : null}
-          </Box>
+          <VStack spacing={8} align="left">
+            <Text size="sm" color="gray.700">
+              Connect to one of your databases using a connection URL. You may
+              have received this URL from a colleague or your Ethyca developer
+              support engineer.
+            </Text>
+            <Box>
+              <CustomTextInput name="url" label="Database URL" />
+            </Box>
+            <Box>
+              <Button
+                size="sm"
+                colorScheme="primary"
+                type="submit"
+                isLoading={isSubmitting || isLoading}
+                isDisabled={isSubmitting || isLoading}
+                data-testid="create-dataset-btn"
+              >
+                Generate dataset
+              </Button>
+            </Box>
+          </VStack>
         </Form>
       )}
     </Formik>

From 5569dd8a00f7afd6fe2d7f9f7a1ef45e6d87ce66 Mon Sep 17 00:00:00 2001
From: Sebastian Sangervasi <sebastian@ethyca.com>
Date: Thu, 8 Sep 2022 15:57:28 -0700
Subject: [PATCH 2/5] ui/inputs: CustomSwitch component for switches

---
 .../src/features/common/form/inputs.tsx       | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/clients/ctl/admin-ui/src/features/common/form/inputs.tsx b/clients/ctl/admin-ui/src/features/common/form/inputs.tsx
index 3e3a4fd533..480ea9361d 100644
--- a/clients/ctl/admin-ui/src/features/common/form/inputs.tsx
+++ b/clients/ctl/admin-ui/src/features/common/form/inputs.tsx
@@ -11,6 +11,7 @@ import {
   Radio,
   RadioGroup,
   Stack,
+  Switch,
   Textarea,
   TextareaProps,
 } from "@fidesui/react";
@@ -465,3 +466,38 @@ export const CustomRadioGroup = ({
     </FormControl>
   );
 };
+
+interface CustomSwitchProps {
+  label: string;
+  tooltip?: string;
+}
+export const CustomSwitch = ({
+  label,
+  tooltip,
+  ...props
+}: CustomSwitchProps & FieldHookConfig<boolean>) => {
+  const [field, meta] = useField({ ...props, type: "checkbox" });
+  const isInvalid = !!(meta.touched && meta.error);
+
+  return (
+    <FormControl isInvalid={isInvalid}>
+      <Grid templateColumns="1fr 3fr" justifyContent="center">
+        <FormLabel htmlFor={props.id || props.name} my={0}>
+          {label}
+        </FormLabel>
+        <Box display="flex" alignItems="center">
+          <Switch
+            name={field.name}
+            isChecked={field.checked}
+            onChange={field.onChange}
+            onBlur={field.onBlur}
+            colorScheme="secondary"
+            mr={2}
+            data-testid={`input-${field.name}`}
+          />
+          {tooltip ? <QuestionTooltip label={tooltip} /> : null}
+        </Box>
+      </Grid>
+    </FormControl>
+  );
+};

From 2b49e5837fa298fadc1daa7dd925b3172e6d4c8e Mon Sep 17 00:00:00 2001
From: Sebastian Sangervasi <sebastian@ethyca.com>
Date: Thu, 8 Sep 2022 15:58:04 -0700
Subject: [PATCH 3/5] ui/dataset: "Classify" toggle for fidesctl-plus

---
 .../features/dataset/DatabaseConnectForm.tsx  | 22 ++++++++++++++-----
 1 file changed, 16 insertions(+), 6 deletions(-)

diff --git a/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx b/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx
index c5d3f6d01e..4f9465c7f5 100644
--- a/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx
+++ b/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx
@@ -5,6 +5,8 @@ import { Form, Formik, FormikHelpers } from "formik";
 import { useRouter } from "next/router";
 import * as Yup from "yup";
 
+import { useFeatures } from "~/features/common/features.slice";
+import { DEFAULT_ORGANIZATION_FIDES_KEY } from "~/features/organization";
 import {
   Dataset,
   GenerateResponse,
@@ -12,7 +14,7 @@ import {
   ValidTargets,
 } from "~/types/api";
 
-import { CustomTextInput } from "../common/form/inputs";
+import { CustomSwitch, CustomTextInput } from "../common/form/inputs";
 import { getErrorMessage } from "../common/helpers";
 import { successToastParams } from "../common/toast";
 import {
@@ -21,7 +23,7 @@ import {
   useGenerateDatasetMutation,
 } from "./dataset.slice";
 
-const initialValues = { url: "" };
+const initialValues = { url: "", classify: false };
 
 type FormValues = typeof initialValues;
 
@@ -30,14 +32,13 @@ const ValidationSchema = Yup.object().shape({
 });
 
 const DatabaseConnectForm = () => {
-  // TODO: where should this come from?
-  const organizationKey = "default_organization";
   const [generate, { isLoading: isGenerating }] = useGenerateDatasetMutation();
   const [createDataset, { isLoading: isCreating }] = useCreateDatasetMutation();
   const isLoading = isGenerating || isCreating;
 
   const toast = useToast();
   const router = useRouter();
+  const features = useFeatures();
 
   const handleSubmit = async (
     values: FormValues,
@@ -67,7 +68,7 @@ const DatabaseConnectForm = () => {
     };
 
     const response = await generate({
-      organization_key: organizationKey,
+      organization_key: DEFAULT_ORGANIZATION_FIDES_KEY,
       generate: {
         config: { connection_string: values.url },
         target: ValidTargets.DB,
@@ -85,7 +86,7 @@ const DatabaseConnectForm = () => {
 
   return (
     <Formik
-      initialValues={initialValues}
+      initialValues={{ ...initialValues, classify: features.plus }}
       validationSchema={ValidationSchema}
       onSubmit={handleSubmit}
       validateOnChange={false}
@@ -102,6 +103,15 @@ const DatabaseConnectForm = () => {
             <Box>
               <CustomTextInput name="url" label="Database URL" />
             </Box>
+
+            {features.plus ? (
+              <CustomSwitch
+                name="classify"
+                label="Classify dataset"
+                tooltip="In addition to generating the Dataset, Fidescls will scan the database to determine the locations of possible PII and suggest labels based on the contents of your tables."
+              />
+            ) : null}
+
             <Box>
               <Button
                 size="sm"

From d8fd5a38382aeebc05630a4e4eb726937038051f Mon Sep 17 00:00:00 2001
From: Sebastian Sangervasi <sebastian@ethyca.com>
Date: Fri, 9 Sep 2022 10:44:00 -0700
Subject: [PATCH 4/5] ui/dataset: Cypress test when classify is available

---
 .../cypress/e2e/datasets-classify.cy.ts       | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 clients/ctl/admin-ui/cypress/e2e/datasets-classify.cy.ts

diff --git a/clients/ctl/admin-ui/cypress/e2e/datasets-classify.cy.ts b/clients/ctl/admin-ui/cypress/e2e/datasets-classify.cy.ts
new file mode 100644
index 0000000000..398297c15c
--- /dev/null
+++ b/clients/ctl/admin-ui/cypress/e2e/datasets-classify.cy.ts
@@ -0,0 +1,27 @@
+/**
+ * This test suite is a parallel of datests.cy.ts for testing Dataset features when the user has
+ * access to the  Fidescls API. This suite should cover the behavior that is different when a
+ * dataset is classified.
+ */
+describe("Datasets with Fides Classify", () => {
+  beforeEach(() => {
+    cy.intercept("GET", "/api/v1/plus/health", {
+      statusCode: 200,
+      body: {
+        status: "healthy",
+        core_fidesctl_version: "1.8",
+      },
+    }).as("getPlusHealth");
+  });
+
+  describe("Creating datasets", () => {
+    it("Shows the classify switch", () => {
+      cy.visit("/dataset/new");
+      cy.getByTestId("connect-db-btn").click();
+
+      cy.getByTestId("input-classify").find("input").should("be.checked");
+      cy.getByTestId("input-classify").click();
+      cy.getByTestId("input-classify").find("input").should("not.be.checked");
+    });
+  });
+});

From 9652551b068902bc1b845169ce6bcb6b7e2b5ff6 Mon Sep 17 00:00:00 2001
From: Sebastian Sangervasi <sebastian@ethyca.com>
Date: Thu, 8 Sep 2022 16:11:03 -0700
Subject: [PATCH 5/5] Update changelog

---
 CHANGELOG.md | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index c669e1960f..b74340d1a1 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -17,9 +17,16 @@ The types of changes are:
 
 ## [Unreleased](https://github.com/ethyca/fides/compare/1.8.4...main)
 
-* Changed behavior of `load_default_taxonomy` to append instead of upsert [#1040](https://github.com/ethyca/fides/pull/1040)
+### Added
+
+* Dataset generation enhancements using Fides Classify for Plus users:
+  * Added toggle for enabling classify during generation. [#1057](https://github.com/ethyca/fides/pull/1057)
 * New page to add a system via yaml [#1062](https://github.com/ethyca/fides/pull/1062)
 
+### Changed
+
+* Changed behavior of `load_default_taxonomy` to append instead of upsert [#1040](https://github.com/ethyca/fides/pull/1040)
+
 ## [1.8.4](https://github.com/ethyca/fides/compare/1.8.3...1.8.4) - 2022-09-09
 
 ### Added