fix: added hasFocus as deprecated prop

carbon-design-system · Jan 19, 2024 · bcbb991 · bcbb991
1 parent 6d133d4
commit bcbb991
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 5 deletions.
diff --git a/packages/react/src/components/Notification/Notification.tsx b/packages/react/src/components/Notification/Notification.tsx
@@ -843,6 +843,7 @@ export interface ActionableNotificationProps
   closeOnEscape?: boolean;
 
   /**
+   * @deprecated use StaticNotification once it's available. Issue #15532
    * Specify if focus should be moved to the component when the notification contains actions
    */
   hasFocus?: boolean;
@@ -1104,7 +1105,7 @@ ActionableNotification.propTypes = {
   /**
    * Specify if focus should be moved to the component when the notification contains actions
    */
-  hasFocus: PropTypes.bool,
+  hasFocus: deprecate(PropTypes.bool),
 
   /**
    * Specify the close button should be disabled, or not

diff --git a/packages/react/src/components/Notification/stories/ActionableNotification.stories.js b/packages/react/src/components/Notification/stories/ActionableNotification.stories.js
@@ -72,6 +72,11 @@ Playground.argTypes = {
       disable: true,
     },
   },
+  hasFocus: {
+    table: {
+      disable: true,
+    },
+  },
 };
 Playground.args = {
   actionButtonLabel: 'Action',

diff --git a/packages/react/src/components/Tabs/Tabs.tsx b/packages/react/src/components/Tabs/Tabs.tsx
@@ -327,6 +327,7 @@ function TabList({
   const nextButton = useRef<HTMLButtonElement>(null);
   const [isScrollable, setIsScrollable] = useState(false);
   const [scrollLeft, setScrollLeft] = useState<number>(0);
+  const [activeTabs, setActiveTabs] = useState<TabElement[]>([]);
 
   let hasSecondaryLabelTabs = false;
   if (contained) {
@@ -398,16 +399,26 @@ function TabList({
     }, scrollDebounceWait);
   }, [scrollDebounceWait]);
 
+  useEffect(() => {
+    setActiveTabs([]);
+    console.log('tabs', tabs);
+    const filteredTabs: TabElement[] = tabs.current.filter(
+      (tab) => !tab.disabled
+    );
+
+    setActiveTabs(filteredTabs);
+    // console.log('activeTabs UseEffect', activeTabs);
+  }, [tabs]);
+
   function onKeyDown(event: KeyboardEvent) {
     if (
       matches(event, [keys.ArrowRight, keys.ArrowLeft, keys.Home, keys.End])
     ) {
       event.preventDefault();
+      // filterTabs();
+      console.log('onKeyDown');
 
-      const activeTabs: TabElement[] = tabs.current.filter(
-        (tab) => !tab.disabled
-      );
-
+      console.log('activeTabs', activeTabs);
       const currentIndex = activeTabs.indexOf(
         tabs.current[activation === 'automatic' ? selectedIndex : activeIndex]
       );