diff --git a/CHANGELOG.md b/CHANGELOG.md
index bcc0cc1915..122d7a3a99 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -19,6 +19,13 @@ The types of changes are:
## [2.38.1](https://github.com/ethyca/fides/compare/2.38.0...2.38.1)
+### Added
+
+### Changed
+
+### Fixed
+- Fixed "add" icons on some buttons being wrong size [#4975](https://github.com/ethyca/fides/pull/4975)
+
## [2.38.0](https://github.com/ethyca/fides/compare/2.37.0...2.38.0)
### Added
diff --git a/clients/admin-ui/src/features/common/ScrollableList.tsx b/clients/admin-ui/src/features/common/ScrollableList.tsx
index 74e0458565..aa7485a70b 100644
--- a/clients/admin-ui/src/features/common/ScrollableList.tsx
+++ b/clients/admin-ui/src/features/common/ScrollableList.tsx
@@ -1,6 +1,5 @@
import { Select } from "chakra-react-select";
import {
- AddIcon,
Box,
Button,
ChakraProps,
@@ -9,6 +8,7 @@ import {
Flex,
IconButton,
List,
+ SmallAddIcon,
Text,
} from "fidesui";
import { motion, Reorder, useDragControls } from "framer-motion";
@@ -142,7 +142,7 @@ const ScrollableListAdd = ({
w="full"
size="sm"
variant="outline"
- rightIcon={}
+ rightIcon={}
data-testid={`add-${baseTestId}`}
>
{label}
diff --git a/clients/admin-ui/src/features/common/custom-fields/CustomFieldsButton.tsx b/clients/admin-ui/src/features/common/custom-fields/CustomFieldsButton.tsx
deleted file mode 100644
index 115e4af4c4..0000000000
--- a/clients/admin-ui/src/features/common/custom-fields/CustomFieldsButton.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import { Flex, IconButton, Text } from "fidesui";
-import * as React from "react";
-
-import QuestionTooltip from "~/features/common/QuestionTooltip";
-
-import { AddIcon } from "./icons/AddIcon";
-
-type CustomFieldsButtonProps = {
- btnRef: React.MutableRefObject;
- hasTooltip?: boolean;
- onClick: React.MouseEventHandler;
-};
-
-const CustomFieldsButton: React.FC = ({
- btnRef,
- hasTooltip = false,
- onClick,
-}) => (
-
- }
- onClick={onClick}
- ref={btnRef}
- size="sm"
- variant="outline"
- _hover={{ cursor: "pointer" }}
- />
-
- Add a custom field
-
- {hasTooltip && }
-
-);
-
-export { CustomFieldsButton };
diff --git a/clients/admin-ui/src/features/common/custom-fields/CustomFieldsModal.tsx b/clients/admin-ui/src/features/common/custom-fields/CustomFieldsModal.tsx
deleted file mode 100644
index 1e883d7773..0000000000
--- a/clients/admin-ui/src/features/common/custom-fields/CustomFieldsModal.tsx
+++ /dev/null
@@ -1,236 +0,0 @@
-import {
- Box,
- Button,
- ButtonGroup,
- Divider,
- Flex,
- Modal,
- ModalBody,
- ModalCloseButton,
- ModalContent,
- ModalFooter,
- ModalHeader,
- ModalOverlay,
- Text,
- useDisclosure,
-} from "fidesui";
-import * as React from "react";
-import { useRef, useState } from "react";
-
-import DataTabs from "~/features/common/DataTabs";
-import ConfirmationModal from "~/features/common/modals/ConfirmationModal";
-import { ResourceTypes } from "~/types/api";
-
-import { ChooseFromLibrary } from "./ChooseFromLibrary";
-import { TabTypes } from "./constants";
-import { CreateCustomFields } from "./CreateCustomFields";
-import { CreateCustomLists } from "./CreateCustomLists";
-import { CustomFieldsButton } from "./CustomFieldsButton";
-import { Tab } from "./types";
-
-type CustomFieldsModalProps = {
- reload?: () => void;
- resourceType: ResourceTypes;
-};
-
-const CustomFieldsModal: React.FC = ({
- reload,
- resourceType,
-}) => {
- const { isOpen, onOpen, onClose } = useDisclosure();
-
- const btnRef = useRef(null);
- const createCustomFieldsRef = useRef(null);
- const createCustomListsRef = useRef(null);
- const chooseFromLibraryRef = useRef(null);
- const firstField = useRef(null);
-
- const DEFAULT_TAB_INDEX = TabTypes.CREATE_CUSTOM_FIELDS;
- const [tabIndex, setTabIndex] = useState(DEFAULT_TAB_INDEX);
- const [isSubmitting, setIsSubmitting] = useState(false);
- const [isConfirmationModalOpen, setConfirmationModalOpen] = useState(false);
-
- const getActiveFormRef = () => {
- let formRef: any;
- switch (tabIndex) {
- case TabTypes.CREATE_CUSTOM_FIELDS:
- formRef = createCustomFieldsRef!.current as any;
- break;
- case TabTypes.CREATE_CUSTOM_LISTS:
- formRef = createCustomListsRef!.current as any;
- break;
- case TabTypes.CHOOSE_FROM_LIBRARY:
- formRef = chooseFromLibraryRef!.current as any;
- break;
- default:
- break;
- }
- return formRef;
- };
-
- const handleClose = (force?: boolean) => {
- const activeForm = getActiveFormRef();
- if (!force && activeForm?.getDirty()) {
- setConfirmationModalOpen(true);
- return;
- }
- setTabIndex(DEFAULT_TAB_INDEX);
- setIsSubmitting(false);
- onClose();
- };
-
- const handleSaveClick = () => {
- const activeForm = getActiveFormRef();
- if (activeForm) {
- activeForm.submitForm();
- setIsSubmitting(activeForm.isSubmitting);
- }
- };
-
- const handleSubmitComplete = () => {
- setIsSubmitting(false);
- if (tabIndex === TabTypes.CHOOSE_FROM_LIBRARY && reload) {
- reload();
- }
- };
-
- const handleTabsChange = (index: number) => setTabIndex(index);
-
- const tabList: Tab[] = [
- {
- label: "Create custom fields",
- content: (
-
- ),
- submitButtonText: "Save",
- },
- {
- label: "Create custom lists",
- content: (
-
- ),
- submitButtonText: "Save to library",
- },
- {
- label: "Choose from library",
- content: (
-
- ),
- submitButtonText: "Save",
- },
- ];
-
- return (
- <>
-
-
-
-
-
-
-
-
- Add custom field
-
-
-
-
- Fill in the information below to add a new custom field to this
- form or view the library to select from existing custom fields.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- {
- setConfirmationModalOpen(false);
- }}
- onConfirm={() => {
- setConfirmationModalOpen(false);
- handleClose(true);
- }}
- title="Unsaved changes"
- message={
-
- You have unsaved changes, are you sure you want to discard?
-
- }
- />
-
- >
- );
-};
-
-export { CustomFieldsModal };
diff --git a/clients/admin-ui/src/features/common/custom-fields/index.ts b/clients/admin-ui/src/features/common/custom-fields/index.ts
index d6cbfbb706..a73ad6c644 100644
--- a/clients/admin-ui/src/features/common/custom-fields/index.ts
+++ b/clients/admin-ui/src/features/common/custom-fields/index.ts
@@ -2,9 +2,7 @@ export * from "./ChooseFromLibrary";
export * from "./constants";
export * from "./CreateCustomFields";
export * from "./CreateCustomLists";
-export * from "./CustomFieldsButton";
export * from "./CustomFieldsList";
-export * from "./CustomFieldsModal";
export * from "./helpers";
export * from "./hooks";
export * from "./Layout";
diff --git a/clients/admin-ui/src/features/system/dictionary-data-uses/EmptyTableState.tsx b/clients/admin-ui/src/features/system/dictionary-data-uses/EmptyTableState.tsx
index ce145cdffb..794b450e0b 100644
--- a/clients/admin-ui/src/features/system/dictionary-data-uses/EmptyTableState.tsx
+++ b/clients/admin-ui/src/features/system/dictionary-data-uses/EmptyTableState.tsx
@@ -1,8 +1,8 @@
import {
- AddIcon,
Box,
Button,
HStack,
+ SmallAddIcon,
Stack,
Text,
WarningTwoIcon,
@@ -45,7 +45,7 @@ const EmptyTableState = ({ title, description, handleAdd }: Props) => (
fontWeight="semibold"
data-testid="add-btn"
onClick={handleAdd}
- rightIcon={}
+ rightIcon={}
>
Add data use
diff --git a/clients/admin-ui/src/features/system/system-form-declaration-tab/PrivacyDeclarationDisplayGroup.tsx b/clients/admin-ui/src/features/system/system-form-declaration-tab/PrivacyDeclarationDisplayGroup.tsx
index f949b7a964..16a33eb3b2 100644
--- a/clients/admin-ui/src/features/system/system-form-declaration-tab/PrivacyDeclarationDisplayGroup.tsx
+++ b/clients/admin-ui/src/features/system/system-form-declaration-tab/PrivacyDeclarationDisplayGroup.tsx
@@ -1,5 +1,4 @@
import {
- AddIcon,
Box,
Button,
DeleteIcon,
@@ -9,6 +8,7 @@ import {
IconButton,
LinkBox,
LinkOverlay,
+ SmallAddIcon,
Spacer,
Stack,
Text,
@@ -165,7 +165,7 @@ export const PrivacyDeclarationDisplayGroup = ({
backgroundColor="primary.800"
color="white"
fontWeight="600"
- rightIcon={}
+ rightIcon={}
data-testid="add-btn"
>
Add data use