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 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"); + }); + }); +}); 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 = ({ ); }; + +interface CustomSwitchProps { + label: string; + tooltip?: string; +} +export const CustomSwitch = ({ + label, + tooltip, + ...props +}: CustomSwitchProps & FieldHookConfig) => { + const [field, meta] = useField({ ...props, type: "checkbox" }); + const isInvalid = !!(meta.touched && meta.error); + + return ( + + + + {label} + + + + {tooltip ? : null} + + + + ); +}; diff --git a/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx b/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx index 2153ea5928..4f9465c7f5 100644 --- a/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx +++ b/clients/ctl/admin-ui/src/features/dataset/DatabaseConnectForm.tsx @@ -1,10 +1,12 @@ -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"; 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,12 +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, @@ -65,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, @@ -83,7 +86,7 @@ const DatabaseConnectForm = () => { return ( { > {({ isSubmitting }) => (
- - 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. - - - - - - - {isGenerating || isCreating ? : null} - + + + 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. + + + + + + {features.plus ? ( + + ) : null} + + + + +
)}