Bump @heroicons/react from 1.0.6 to 2.1.4 in /assets (#383)

* Bump @heroicons/react from 1.0.6 to 2.1.4 in /assets Bumps [@heroicons/react](https://github.com/tailwindlabs/heroicons) from 1.0.6 to 2.1.4. - [Release notes](https://github.com/tailwindlabs/heroicons/releases) - [Changelog](https://github.com/tailwindlabs/heroicons/blob/master/CHANGELOG.md) - [Commits](tailwindlabs/heroicons@v1.0.6...v2.1.4) --- updated-dependencies: - dependency-name: "@heroicons/react" dependency-type: direct:production update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com> * fix: fix heroicons solid imports * fix: update names of some icons --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: sloane <1699281+sloanelybutsurely@users.noreply.github.com>
mbta · Jul 3, 2024 · 965a2ff · 965a2ff
1 parent b7b51d1
commit 965a2ff
Show file tree

Hide file tree

Showing 11 changed files with 34 additions and 30 deletions.
diff --git a/assets/js/components/OutfrontTakeoverTool/AlertDashboard/AlertDetails.tsx b/assets/js/components/OutfrontTakeoverTool/AlertDashboard/AlertDetails.tsx
@@ -10,7 +10,7 @@ import {
   getMessageString,
   matchStation,
 } from "../../../util";
-import { BanIcon, PencilIcon } from "@heroicons/react/solid";
+import { NoSymbolIcon, PencilIcon } from "@heroicons/react/20/solid";
 import { ModalDetails } from "../ConfirmationModal";
 import SVGPreviews from "../AlertWizard/SVGPreviews";
 import AlertReminder from "./AlertReminder";
@@ -50,14 +50,14 @@ const AlertDetails = (props: AlertDetailsProps): JSX.Element => {
   const messageString = getMessageString(message);
 
   const modalDetails: ModalDetails = {
-    icon: <BanIcon className="icon" />,
+    icon: <NoSymbolIcon className="icon" />,
     header: "Clear Alert",
     description:
       "This stops the Outfront Media screen Takeover, and returns to the regularly scheduled content loop.",
     cancelText: "Keep Alert",
     confirmJSX: (
       <>
-        <BanIcon className="button-icon" />
+        <NoSymbolIcon className="button-icon" />
         Clear Alert
       </>
     ),
@@ -102,7 +102,7 @@ const AlertDetails = (props: AlertDetailsProps): JSX.Element => {
             Edit
           </button>
           <button className="clear-button" onClick={clearAlert}>
-            <BanIcon className="button-icon" />
+            <NoSymbolIcon className="button-icon" />
             Clear Alert
           </button>
         </div>

diff --git a/assets/js/components/OutfrontTakeoverTool/AlertDashboard/AlertReminder.tsx b/assets/js/components/OutfrontTakeoverTool/AlertDashboard/AlertReminder.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { ClockIcon } from "@heroicons/react/solid";
+import { ClockIcon } from "@heroicons/react/20/solid";
 
 interface AlertReminderProps {
   clearAlert: () => void;

diff --git a/assets/js/components/OutfrontTakeoverTool/AlertDashboard/AlertsList.tsx b/assets/js/components/OutfrontTakeoverTool/AlertDashboard/AlertsList.tsx
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react";
 import AlertDetails from "./AlertDetails";
 import { AlertData } from "../OutfrontTakeoverTool";
 import { ModalDetails } from "../ConfirmationModal";
-import { BanIcon } from "@heroicons/react/solid";
+import { NoSymbolIcon } from "@heroicons/react/20/solid";
 import { PastAlertsList } from "./PastAlertsList";
 import ReactTooltip from "react-tooltip";
 import { BASE_URL } from "Constants/constants";
@@ -114,14 +114,14 @@ const AlertsList = (props: AlertsListProps): JSX.Element => {
   };
 
   const clearAllModalDetails: ModalDetails = {
-    icon: <BanIcon className="icon" />,
+    icon: <NoSymbolIcon className="icon" />,
     header: "Clear all Alerts",
     description:
       "This stops all Outfront Media screen Takeovers, and returns to the regularly scheduled content loop.",
     cancelText: "Keep Alerts",
     confirmJSX: (
       <>
-        <BanIcon className="button-icon" />
+        <NoSymbolIcon className="button-icon" />
         Clear all Alerts
       </>
     ),
@@ -139,7 +139,7 @@ const AlertsList = (props: AlertsListProps): JSX.Element => {
                 className="clear-all-alerts-button"
                 onClick={() => props.triggerConfirmation(clearAllModalDetails)}
               >
-                <BanIcon className="button-icon" />
+                <NoSymbolIcon className="button-icon" />
                 <span className="text-16">Clear all</span>
               </button>
             )}

diff --git a/assets/js/components/OutfrontTakeoverTool/AlertDashboard/IntroBlock.tsx b/assets/js/components/OutfrontTakeoverTool/AlertDashboard/IntroBlock.tsx
@@ -1,6 +1,9 @@
 import React from "react";
 
-import { ExclamationIcon, PlusCircleIcon } from "@heroicons/react/solid";
+import {
+  ExclamationTriangleIcon,
+  PlusCircleIcon,
+} from "@heroicons/react/20/solid";
 
 interface IntroBlockProps {
   startAlertWizard: () => void;
@@ -10,7 +13,7 @@ const IntroBlock = (props: IntroBlockProps): JSX.Element => {
   return (
     <div className="intro-block">
       <div className="exclamation-circle">
-        <ExclamationIcon className="exclamation" />
+        <ExclamationTriangleIcon className="exclamation" />
       </div>
       <ul className="intro-text">
         <li>

diff --git a/assets/js/components/OutfrontTakeoverTool/AlertDashboard/PastAlertsList.tsx b/assets/js/components/OutfrontTakeoverTool/AlertDashboard/PastAlertsList.tsx
@@ -1,9 +1,9 @@
 import React from "react";
 import PastAlertDetails from "./PastAlertDetails";
 import {
-  ArrowNarrowLeftIcon,
-  ArrowNarrowRightIcon,
-} from "@heroicons/react/solid";
+  ArrowLongLeftIcon,
+  ArrowLongRightIcon,
+} from "@heroicons/react/20/solid";
 import { AlertData } from "../../OutfrontTakeoverTool/OutfrontTakeoverTool";
 
 interface PastAlertsListProps {
@@ -86,7 +86,7 @@ export class PastAlertsList extends React.Component<
               }
               onClick={this.backPage}
             >
-              <ArrowNarrowLeftIcon className="button-icon" />
+              <ArrowLongLeftIcon className="button-icon" />
               <span>Previous</span>
             </div>
             <div className="pages">
@@ -118,7 +118,7 @@ export class PastAlertsList extends React.Component<
               onClick={this.nextPage}
             >
               <span>Next</span>
-              <ArrowNarrowRightIcon className="button-icon right" />
+              <ArrowLongRightIcon className="button-icon right" />
             </div>
           </div>
         )}

diff --git a/assets/js/components/OutfrontTakeoverTool/AlertWizard/AlertWizard.tsx b/assets/js/components/OutfrontTakeoverTool/AlertWizard/AlertWizard.tsx
@@ -9,7 +9,7 @@ import { AlertData, Station, StationsByLine } from "../OutfrontTakeoverTool";
 
 import CANNED_MESSAGES from "Constants/messages";
 
-import { BanIcon, XIcon } from "@heroicons/react/solid";
+import { NoSymbolIcon, XMarkIcon } from "@heroicons/react/20/solid";
 import WizardSidebar from "./WizardSidebar";
 import { svgLongSide, svgScale, svgShortSide } from "Constants/misc";
 import { matchStation } from "../../../util";
@@ -428,7 +428,7 @@ class AlertWizard extends React.Component<AlertWizardProps, AlertWizardState> {
       this.generatePNGs();
     }
     const modalDetails: ModalDetails = {
-      icon: <BanIcon className="icon" />,
+      icon: <NoSymbolIcon className="icon" />,
       header: "Cancel new Takeover Alert",
       description:
         "Canceling now will lose any progress you have made. This action cannot be undone.",
@@ -446,7 +446,7 @@ class AlertWizard extends React.Component<AlertWizardProps, AlertWizardState> {
                 className="wizard-cancel"
                 onClick={() => this.props.triggerConfirmation(modalDetails)}
               >
-                <XIcon className="x" />
+                <XMarkIcon className="x" />
                 <span className="text-16 weight-500">Cancel</span>
               </button>
               <div className="wizard-title text-30 weight-800">

diff --git a/assets/js/components/OutfrontTakeoverTool/AlertWizard/WizardNavFooter.tsx b/assets/js/components/OutfrontTakeoverTool/AlertWizard/WizardNavFooter.tsx
@@ -1,9 +1,9 @@
 import React from "react";
 import {
-  ArrowNarrowLeftIcon,
-  ArrowNarrowRightIcon,
+  ArrowLongLeftIcon,
+  ArrowLongRightIcon,
   PlayIcon,
-} from "@heroicons/react/solid";
+} from "@heroicons/react/20/solid";
 
 interface WizardNavFooterProps {
   step: number;
@@ -49,7 +49,7 @@ const WizardNavFooter = (props: WizardNavFooterProps): JSX.Element => {
     <div className="wizard-nav-footer">
       {props.step !== 1 ? (
         <button className="nav-button" onClick={props.backward}>
-          <ArrowNarrowLeftIcon className="button-icon" />
+          <ArrowLongLeftIcon className="button-icon" />
           <span>{backButton(props.step)}</span>
         </button>
       ) : null}
@@ -66,7 +66,7 @@ const WizardNavFooter = (props: WizardNavFooterProps): JSX.Element => {
             onClick={props.forward}
           >
             <span>{forwardButton(props.step)}</span>
-            <ArrowNarrowRightIcon className="button-icon right" />
+            <ArrowLongRightIcon className="button-icon right" />
           </button>
         </div>
       ) : (

diff --git a/assets/js/components/OutfrontTakeoverTool/AlertWizard/WizardStepper.tsx b/assets/js/components/OutfrontTakeoverTool/AlertWizard/WizardStepper.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { CheckIcon } from "@heroicons/react/solid";
+import { CheckIcon } from "@heroicons/react/20/solid";
 
 interface WizardStepperProps {
   activeStep: number;

diff --git a/assets/js/components/OutfrontTakeoverTool/AlertWizard/WizardWarning.tsx b/assets/js/components/OutfrontTakeoverTool/AlertWizard/WizardWarning.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { ExclamationCircleIcon } from "@heroicons/react/solid";
+import { ExclamationCircleIcon } from "@heroicons/react/20/solid";
 
 interface WizardWarningProps {
   stationNames: string[];

diff --git a/assets/package-lock.json b/assets/package-lock.json
diff --git a/assets/package.json b/assets/package.json
@@ -14,7 +14,7 @@
   },
   "dependencies": {
     "@fullstory/browser": "^2.0.4",
-    "@heroicons/react": "^1.0.4",
+    "@heroicons/react": "^2.1.4",
     "@sentry/fullstory": "^3.0.0",
     "@sentry/react": "^7.14.0",
     "bootstrap": "^5.1.3",