Merge branch 'main' into PROD-1788-track-request-origin

CHANGELOG.md

@@ -17,6 +17,8 @@ The types of changes are:
 
 ## [Unreleased](https://github.com/ethyca/fides/compare/2.43.0...main)
 
+### Fixed
+- Ignore `404` errors on Oracle Responsys deletions [#5203](https://github.com/ethyca/fides/pull/5203)
 
 ## [2.43.0](https://github.com/ethyca/fides/compare/2.42.1...2.43.0)
 
@@ -29,6 +31,7 @@ The types of changes are:
 - Add function to return list of StagedResource objs according to list of URNs [#5192](https://github.com/ethyca/fides/pull/5192)
 - Add DSR Support for ScyllaDB [#5140](https://github.com/ethyca/fides/pull/5140)
 - Added support for nested fields in BigQuery in D&D result views [#5175](https://github.com/ethyca/fides/pull/5175)
+- Added support for Vendor Count in Fides-JS overlay descriptions [#5210](https://github.com/ethyca/fides/pull/5210)
 
 ### Fixed
 - Fixed the OAuth2 configuration for the Snap integration [#5158](https://github.com/ethyca/fides/pull/5158)
@@ -45,6 +48,7 @@ The types of changes are:
 - Model changes to support consent signals (Fidesplus) [#5190](https://github.com/ethyca/fides/pull/5190)
 - Updated Datasets page with new UI for better usability and consistency with Detection and Discovery UI [#5191](https://github.com/ethyca/fides/pull/5191)
 - Updated the Yotpo Reviews integration to use email and phone number identities instead of external ID [#5169](https://github.com/ethyca/fides/pull/5169)
+- Update TCF banner button layout and styles [#5204](https://github.com/ethyca/fides/pull/5204)
 
 
 ### Developer Experience

README.md

@@ -31,7 +31,7 @@ In order to get started quickly with Fides, a sample project is bundled within t
 
 > [!TIP]
 > We highly recommend setting up a Python virtual environment such as `venv` to install Fides into. For example:
-> 
+>
 > ```sh
 > mkdir ~/fides
 > cd ~/fides
@@ -131,7 +131,7 @@ Fides is created and sponsored by Ethyca: a developer tools company building the
 
 By default, running `pip install ethyca-fides` locally will not install the optional Python libraries needed for Microsoft SQL Server, since these rely on additional system dependencies (`freetds`)! However, if you *do* want to connect to MSSQL, you have two options:
 1. Use our pre-built Docker images which install these optional dependencies automatically: [`ethyca/fides`](https://hub.docker.com/r/ethyca/fides). See our [Deployment Guide](https://ethyca.com/docs/dev-docs/configuration/deployment) for more!
-2. Install the required dependencies on your local development machine and run `pip install ethyca-fides[all]` to include "all" the optional libraries. Keep reading to learn more about this!
+2. Install the required dependencies on your local development machine and run `pip install "ethyca-fides[all]"` to include "all" the optional libraries. Keep reading to learn more about this!
 
 For local development setup on macOS, follow these steps:
 1. Install the required development libraries from Homebrew:

clients/fides-js/src/components/ConsentBanner.tsx

@@ -3,7 +3,6 @@ import { useEffect } from "preact/hooks";
 
 import { getConsentContext } from "../lib/consent-context";
 import { GpcStatus } from "../lib/consent-types";
-import { useMediaQuery } from "../lib/hooks/useMediaQuery";
 import { I18n, messageExists } from "../lib/i18n";
 import CloseButton from "./CloseButton";
 import ExperienceDescription from "./ExperienceDescription";
@@ -38,7 +37,6 @@ const ConsentBanner: FunctionComponent<BannerProps> = ({
   className,
   isEmbedded,
 }) => {
-  const isMobile = useMediaQuery("(max-width: 768px)");
   const showGpcBadge = getConsentContext().globalPrivacyControl;
 
   useEffect(() => {
@@ -122,9 +120,8 @@ const ConsentBanner: FunctionComponent<BannerProps> = ({
               </div>
             </div>
             {children}
-            {!isMobile && renderButtonGroup()}
           </div>
-          {isMobile && renderButtonGroup()}
+          {renderButtonGroup()}
         </div>
       </div>
     </div>

clients/fides-js/src/components/ConsentButtons.tsx

@@ -55,6 +55,14 @@ export const ConsentButtons = ({
         {!!renderFirstButton && renderFirstButton()}
         {!hideOptInOut && (
           <Fragment>
+            {isTCF && !!onManagePreferencesClick && (
+              <Button
+                buttonType={ButtonType.SECONDARY}
+                label={i18n.t("exp.privacy_preferences_link_label")}
+                onClick={onManagePreferencesClick}
+                className="fides-manage-preferences-button"
+              />
+            )}
             <Button
               buttonType={ButtonType.PRIMARY}
               label={i18n.t("exp.reject_button_label")}
@@ -87,7 +95,7 @@ export const ConsentButtons = ({
             isTCF={!!isTCF}
           />
         )}
-        {!!onManagePreferencesClick && (
+        {!isTCF && !!onManagePreferencesClick && (
           <Button
             buttonType={isMobile ? ButtonType.SECONDARY : ButtonType.TERTIARY}
             label={i18n.t("exp.privacy_preferences_link_label")}

clients/fides-js/src/components/ConsentModal.tsx

@@ -11,6 +11,7 @@ const ConsentModal = ({
   children,
   dismissable,
   i18n,
+  onVendorPageClick,
   renderModalFooter,
 }: {
   attributes: Attributes;
@@ -46,6 +47,7 @@ const ConsentModal = ({
           titleProps={title}
           i18n={i18n}
           renderModalFooter={renderModalFooter}
+          onVendorPageClick={onVendorPageClick}
         >
           {children}
         </ConsentContent>

clients/fides-js/src/components/ExperienceDescription.tsx

@@ -1,6 +1,10 @@
+/* eslint-disable no-template-curly-in-string */
 import { h } from "preact";
+import { useContext } from "preact/hooks";
 
-const TEXT_TO_LINK = "vendors page.";
+import { VendorButtonContext } from "../lib/tcf/vendor-button-context";
+
+const VENDOR_COUNT_LINK = "${VENDOR_COUNT_LINK}";
 
 const ExperienceDescription = ({
   description,
@@ -11,6 +15,12 @@ const ExperienceDescription = ({
   onVendorPageClick?: () => void;
   allowHTMLDescription?: boolean | null;
 }) => {
+  let vendorCount = 0;
+  const context = useContext(VendorButtonContext);
+  if (context?.vendorCount) {
+    vendorCount = context.vendorCount;
+  }
+
   if (!description) {
     return null;
   }
@@ -29,22 +39,24 @@ const ExperienceDescription = ({
   }
 
   // Swap out reference to "vendors page" with a button that can go to the vendor page
-  if (
-    onVendorPageClick &&
-    (description.endsWith(TEXT_TO_LINK) ||
-      description.endsWith(`${TEXT_TO_LINK}\n`))
-  ) {
-    const firstPart = description.split(TEXT_TO_LINK)[0];
+  if (description.includes(VENDOR_COUNT_LINK)) {
+    const parts = description.split(VENDOR_COUNT_LINK);
     return (
       <div>
-        {firstPart}{" "}
-        <button
-          type="button"
-          className="fides-link-button"
-          onClick={onVendorPageClick}
-        >
-          {TEXT_TO_LINK}
-        </button>
+        {parts[0]}
+        {!onVendorPageClick && vendorCount && (
+          <span className="fides-vendor-count">{vendorCount}</span>
+        )}
+        {onVendorPageClick && vendorCount && (
+          <button
+            type="button"
+            className="fides-link-button fides-vendor-count"
+            onClick={onVendorPageClick}
+          >
+            {vendorCount}
+          </button>
+        )}
+        {parts[1]}
       </div>
     );
   }