Repository: storybookjs/storybook
File: code/core/src/components/components/Tabs/Tabs.hooks.tsx (TypeScript)

Code before:
  const tabRefs = useRef(new Map<string, HTMLButtonElement>());
  const { width: tabBarWidth = 1 } = useResizeObserver<HTMLDivElement>({
    // @ts-expect-error (non strict)
    ref: tabBarRef,
  });

  const [visibleList, setVisibleList] = useState(list);
  const [invisibleList, setInvisibleList] = useState<ChildrenListComplete>([]);
  const previousList = useRef<ChildrenListComplete>(list);

  const AddonTab = useCallback(
    ({
      menuName,
      actions,
    }: {
      menuName: string;
      actions?: {
        onSelect: (id: string) => void;
      } & Record<string, any>;
    }) => {
      const isAddonsActive = invisibleList.some(({ active }) => active);
      const [isTooltipVisible, setTooltipVisible] = useState(false);
      return (
        <>
          <PopoverProvider
            ariaLabel="More tabs"
            visible={isTooltipVisible}
            onVisibleChange={setTooltipVisible}
            placement="bottom"
            popover={
              <TooltipLinkList
                links={invisibleList.map(({ title, id, color, active }) => {
                  return {
                    id,
                    title,
                    color,
                    active,
                    onClick: (e) => {
                      e.preventDefault();
                      // @ts-expect-error (non strict)
                      actions.onSelect(id);
                    },
                  } as Link;
                })}
              />
            }
          >
            <AddonButton
              id="addons-menu-button"
              // @ts-expect-error (non strict)
              ref={addonsRef}

Review comment (suggestion):
```suggestion
            ariaLabel="Additional tabs"
```

Code after:
  const tabRefs = useRef(new Map<string, HTMLButtonElement>());
  const { width: tabBarWidth = 1 } = useResizeObserver<HTMLDivElement>({
    // @ts-expect-error (non strict)
    ref: tabBarRef,
  });

  const [visibleList, setVisibleList] = useState(list);
  const [invisibleList, setInvisibleList] = useState<ChildrenListComplete>([]);
  const previousList = useRef<ChildrenListComplete>(list);

  const AddonTab = useCallback(
    ({
      menuName,
      actions,
    }: {
      menuName: string;
      actions?: {
        onSelect: (id: string) => void;
      } & Record<string, any>;
    }) => {
      const isAddonsActive = invisibleList.some(({ active }) => active);
      const [isTooltipVisible, setTooltipVisible] = useState(false);
      return (
        <>
          <PopoverProvider
            ariaLabel="Additional tabs"
            visible={isTooltipVisible}
            onVisibleChange={setTooltipVisible}
            placement="bottom"
            popover={
              <TooltipLinkList
                links={invisibleList.map(({ title, id, color, active }) => {
                  return {
                    id,
                    title,
                    color,
                    active,
                    onClick: (e) => {
                      e.preventDefault();
                      // @ts-expect-error (non strict)
                      actions.onSelect(id);
                    },
                  } as Link;
                })}
              />
            }
          >
            <AddonButton
              id="addons-menu-button"
              // @ts-expect-error (non strict)
              ref={addonsRef}