chore(NotificationBadge): remove deprecated isread prop (#8626)

* chore(NotificationBadge): remove deprecated isread prop * default variant to be read * remove issvg prop from spinner
patternfly · Feb 9, 2023 · d4af3ed · d4af3ed
1 parent 12e1c47
commit d4af3ed
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 79 deletions.
diff --git a/packages/react-core/src/components/Dropdown/DropdownToggleCheckbox.tsx b/packages/react-core/src/components/Dropdown/DropdownToggleCheckbox.tsx
@@ -91,7 +91,6 @@ export class DropdownToggleCheckbox extends React.Component<DropdownToggleCheckb
     const spinner = (
       <Spinner
         diameter="1em"
-        isSVG
         aria-valuetext={defaultProgressAriaValueText}
         aria-live="polite"
         aria-label={defaultProgressAriaLabel}

diff --git a/packages/react-core/src/components/NotificationBadge/NotificationBadge.tsx b/packages/react-core/src/components/NotificationBadge/NotificationBadge.tsx
@@ -28,16 +28,13 @@ export interface NotificationBadgeProps extends Omit<ButtonProps, 'variant'> {
    * notification badge.
    */
   isExpanded?: boolean;
-  /** @deprecated Use the variant prop instead - Adds styling to the notification badge to indicate it has been read. */
-  isRead?: boolean;
   /** Determines the variant of the notification badge. */
   variant?: NotificationBadgeVariant | 'read' | 'unread' | 'attention';
 }
 
 export const NotificationBadge: React.FunctionComponent<NotificationBadgeProps> = ({
-  isRead,
   children,
-  variant = isRead ? 'read' : 'unread',
+  variant = NotificationBadgeVariant.read,
   count = 0,
   attentionIcon = <AttentionBellIcon />,
   icon = <BellIcon />,

diff --git a/packages/react-core/src/components/NotificationBadge/__tests__/NotificationBadge.test.tsx b/packages/react-core/src/components/NotificationBadge/__tests__/NotificationBadge.test.tsx
@@ -2,13 +2,6 @@ import { NotificationBadge } from '../NotificationBadge';
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 
-Object.values([true, false]).forEach(isRead => {
-  test(`${isRead} NotificationBadge`, () => {
-    const { asFragment } = render(<NotificationBadge isRead={isRead} />);
-    expect(asFragment()).toMatchSnapshot();
-  });
-});
-
 Object.values([true, false]).forEach(attentionVariant => {
   test(`${attentionVariant} NotificationBadge needs attention`, () => {
     const { asFragment } = render(

diff --git a/.../src/components/NotificationBadge/__tests__/__snapshots__/NotificationBadge.test.tsx.snap b/.../src/components/NotificationBadge/__tests__/__snapshots__/NotificationBadge.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`NotificationBadge count 1`] = `
     aria-disabled="false"
     aria-expanded="false"
     class="pf-c-button pf-m-plain"
-    data-ouia-component-id="OUIA-Generated-Button-plain-5"
+    data-ouia-component-id="OUIA-Generated-Button-plain-3"
     data-ouia-component-type="PF4/Button"
     data-ouia-safe="true"
     type="button"
@@ -37,45 +37,13 @@ exports[`NotificationBadge count 1`] = `
 </DocumentFragment>
 `;
 
-exports[`false NotificationBadge 1`] = `
-<DocumentFragment>
-  <button
-    aria-disabled="false"
-    aria-expanded="false"
-    class="pf-c-button pf-m-plain"
-    data-ouia-component-id="OUIA-Generated-Button-plain-2"
-    data-ouia-component-type="PF4/Button"
-    data-ouia-safe="true"
-    type="button"
-  >
-    <span
-      class="pf-c-notification-badge pf-m-unread"
-    >
-      <svg
-        aria-hidden="true"
-        fill="currentColor"
-        height="1em"
-        role="img"
-        style="vertical-align: -0.125em;"
-        viewBox="0 0 896 1024"
-        width="1em"
-      >
-        <path
-          d="M448,0 C465.333333,0 480.333333,6.33333333 493,19 C505.666667,31.6666667 512,46.6666667 512,64 L512,106 L514.23,106.45 C587.89,121.39 648.48,157.24 696,214 C744,271.333333 768,338.666667 768,416 C768,500 780,568.666667 804,622 C818.666667,652.666667 841.333333,684 872,716 C873.773676,718.829136 875.780658,721.505113 878,724 C890,737.333333 896,752.333333 896,769 C896,785.666667 890,800.333333 878,813 C866,825.666667 850.666667,832 832,832 L63.3,832 C44.9533333,831.84 29.8533333,825.506667 18,813 C6,800.333333 0,785.666667 0,769 C0,752.333333 6,737.333333 18,724 L24,716 L25.06,714.9 C55.1933333,683.28 77.5066667,652.313333 92,622 C116,568.666667 128,500 128,416 C128,338.666667 152,271.333333 200,214 C248,156.666667 309.333333,120.666667 384,106 L384,63.31 C384.166667,46.27 390.5,31.5 403,19 C415.666667,6.33333333 430.666667,0 448,0 Z M576,896 L576,897.08 C575.74,932.6 563.073333,962.573333 538,987 C512.666667,1011.66667 482.666667,1024 448,1024 C413.333333,1024 383.333333,1011.66667 358,987 C332.666667,962.333333 320,932 320,896 L576,896 Z"
-        />
-      </svg>
-    </span>
-  </button>
-</DocumentFragment>
-`;
-
 exports[`false NotificationBadge needs attention 1`] = `
 <DocumentFragment>
   <button
     aria-disabled="false"
     aria-expanded="false"
     class="pf-c-button pf-m-plain"
-    data-ouia-component-id="OUIA-Generated-Button-plain-4"
+    data-ouia-component-id="OUIA-Generated-Button-plain-2"
     data-ouia-component-type="PF4/Button"
     data-ouia-safe="true"
     type="button"
@@ -89,45 +57,13 @@ exports[`false NotificationBadge needs attention 1`] = `
 </DocumentFragment>
 `;
 
-exports[`true NotificationBadge 1`] = `
-<DocumentFragment>
-  <button
-    aria-disabled="false"
-    aria-expanded="false"
-    class="pf-c-button pf-m-plain"
-    data-ouia-component-id="OUIA-Generated-Button-plain-1"
-    data-ouia-component-type="PF4/Button"
-    data-ouia-safe="true"
-    type="button"
-  >
-    <span
-      class="pf-c-notification-badge pf-m-read"
-    >
-      <svg
-        aria-hidden="true"
-        fill="currentColor"
-        height="1em"
-        role="img"
-        style="vertical-align: -0.125em;"
-        viewBox="0 0 896 1024"
-        width="1em"
-      >
-        <path
-          d="M448,0 C465.333333,0 480.333333,6.33333333 493,19 C505.666667,31.6666667 512,46.6666667 512,64 L512,106 L514.23,106.45 C587.89,121.39 648.48,157.24 696,214 C744,271.333333 768,338.666667 768,416 C768,500 780,568.666667 804,622 C818.666667,652.666667 841.333333,684 872,716 C873.773676,718.829136 875.780658,721.505113 878,724 C890,737.333333 896,752.333333 896,769 C896,785.666667 890,800.333333 878,813 C866,825.666667 850.666667,832 832,832 L63.3,832 C44.9533333,831.84 29.8533333,825.506667 18,813 C6,800.333333 0,785.666667 0,769 C0,752.333333 6,737.333333 18,724 L24,716 L25.06,714.9 C55.1933333,683.28 77.5066667,652.313333 92,622 C116,568.666667 128,500 128,416 C128,338.666667 152,271.333333 200,214 C248,156.666667 309.333333,120.666667 384,106 L384,63.31 C384.166667,46.27 390.5,31.5 403,19 C415.666667,6.33333333 430.666667,0 448,0 Z M576,896 L576,897.08 C575.74,932.6 563.073333,962.573333 538,987 C512.666667,1011.66667 482.666667,1024 448,1024 C413.333333,1024 383.333333,1011.66667 358,987 C332.666667,962.333333 320,932 320,896 L576,896 Z"
-        />
-      </svg>
-    </span>
-  </button>
-</DocumentFragment>
-`;
-
 exports[`true NotificationBadge needs attention 1`] = `
 <DocumentFragment>
   <button
     aria-disabled="false"
     aria-expanded="false"
     class="pf-c-button pf-m-plain"
-    data-ouia-component-id="OUIA-Generated-Button-plain-3"
+    data-ouia-component-id="OUIA-Generated-Button-plain-1"
     data-ouia-component-type="PF4/Button"
     data-ouia-safe="true"
     type="button"