Removing uneeded stories found in testing (#6707)

* Removing uneeded stories found in testing

* fix lint

Author: LFDanLu

packages/@react-spectrum/card/stories/GalleryCardView.stories.tsx

@@ -24,7 +24,6 @@ import {
   FalsyIds,
   FilteringGrid,
   IsLoadingHeightGrid,
-  IsLoadingNoHeightGrid,
   LoadingMoreGrid,
   StaticCards,
   StaticCardViewStory
@@ -162,14 +161,6 @@ export const SelectedKeys: ControlledCardViewStory = {
   }
 };
 
-export const IsLoadingNoHeightGallery: DynamicCardViewStory = {
-  ...IsLoadingNoHeightGrid,
-  args: {
-    ...IsLoadingNoHeightGrid.args,
-    layout: GalleryLayout
-  }
-};
-
 export const IsLoadingHeightGallery: DynamicCardViewStory = {
   ...IsLoadingHeightGrid,
   args: {

packages/@react-spectrum/card/stories/GridCardView.stories.tsx

@@ -159,12 +159,6 @@ export const NoCards: NoItemCardViewStory = {
   render: (args) => <NoItemCardView {...args} />
 };
 
-export const IsLoadingNoHeightGrid: DynamicCardViewStory = {
-  ...NoCards,
-  args: {...NoCards.args, width: '800px', loadingState: 'loading'},
-  name: 'loadingState = loading, no height'
-};
-
 export const IsLoadingHeightGrid: DynamicCardViewStory = {
   ...NoCards,
   args: {...NoCards.args, width: '800px', height: '800px', loadingState: 'loading'},

packages/@react-spectrum/card/stories/WaterfallCardView.stories.tsx

@@ -24,7 +24,6 @@ import {
   FalsyIds,
   FilteringGrid,
   IsLoadingHeightGrid,
-  IsLoadingNoHeightGrid,
   LoadingMoreGrid,
   StaticCards,
   StaticCardViewStory
@@ -160,14 +159,6 @@ export const SelectedKeys: ControlledCardViewStory = {
   }
 };
 
-export const IsLoadingNoHeightWaterfall: DynamicCardViewStory = {
-  ...IsLoadingNoHeightGrid,
-  args: {
-    ...IsLoadingNoHeightGrid.args,
-    layout: WaterfallLayout
-  }
-};
-
 export const IsLoadingHeightWaterfall: DynamicCardViewStory = {
   ...IsLoadingHeightGrid,
   args: {

packages/@react-spectrum/table/stories/Table.stories.tsx

@@ -1546,6 +1546,7 @@ function TableWithBreadcrumbs(props) {
       </Breadcrumbs>
       <TableView
         width="400px"
+        height="300px"
         aria-label="table"
         {...props}
         selectedKeys={selection}

packages/react-aria-components/src/Table.tsx

@@ -942,6 +942,9 @@ export const TableBody = /*#__PURE__*/ createBranchComponent('tablebody', <T ext
 
   let {rowGroupProps} = useTableRowGroup();
   let TBody = useElementType('tbody');
+
+  // TODO: TableBody doesn't support being the scrollable body of the table yet, to revisit if needed. Would need to
+  // call useLoadMore here and walk up the DOM to the nearest scrollable element to set scrollRef
   return (
     <TBody
       {...mergeProps(filterDOMProps(props as any), rowGroupProps)}

packages/react-aria-components/stories/Table.stories.tsx

@@ -14,7 +14,7 @@ import {action} from '@storybook/addon-actions';
 import {Button, Cell, Checkbox, CheckboxProps, Collection, Column, ColumnProps, ColumnResizer, Dialog, DialogTrigger, DropIndicator, Heading, Menu, MenuTrigger, Modal, ModalOverlay, Popover, ResizableTableContainer, Row, Table, TableBody, TableHeader, UNSTABLE_TableLayout as TableLayout, useDragAndDrop, UNSTABLE_Virtualizer as Virtualizer} from 'react-aria-components';
 import {isTextDropItem} from 'react-aria';
 import {MyMenuItem} from './utils';
-import React, {RefObject, useMemo, useRef} from 'react';
+import React, {useMemo, useRef} from 'react';
 import styles from '../example/index.css';
 import {UNSTABLE_TableLoadingIndicator} from '../src/Table';
 import {useAsyncList, useListData} from 'react-stately';
@@ -610,72 +610,6 @@ export const OnLoadMoreTableStory  = {
   name: 'onLoadMore table'
 };
 
-// TODO: this doens't quite work because the table body isn't initially rendered thus the ref is scrollRef is undef
-// This could be remedied perhaps by moving the onLoadMore call to TableBody internally and passing down the scrollRef and other load props via context from body.
-// That would guarentee that the ref for the table body is defined at the time the hook renders. Stashed this change locally, to be discussed.
-// TODO: Depenedent on whether or not we need to support the TableBody being scrollable, or can get away with just having the table resize container or the table itself
-// be scrollable. The vertical scrollbar extending to the column and the table body outline disappearing when horizontally scrolled are some of the problems with this
-const OnLoadMoreTableBodyScroll = () => {
-  let list = useAsyncList<Character>({
-    async load({signal, cursor}) {
-      if (cursor) {
-        cursor = cursor.replace(/^http:\/\//i, 'https://');
-      }
-
-      // Slow down load so progress circle can appear
-      await new Promise(resolve => setTimeout(resolve, 4000));
-      let res = await fetch(cursor || 'https://swapi.py4e.com/api/people/?search=', {signal});
-      let json = await res.json();
-      return {
-        items: json.results,
-        cursor: json.next
-      };
-    }
-  });
-
-  let isLoading = list.loadingState === 'loading' || list.loadingState === 'loadingMore';
-  let scrollRef = useRef<HTMLTableSectionElement>(null);
-  let memoedLoadMoreProps = useMemo(() => ({
-    isLoading: isLoading,
-    onLoadMore: list.loadMore,
-    items: list.items
-  }), [isLoading, list.loadMore, list.items]);
-  useLoadMore(memoedLoadMoreProps, scrollRef);
-
-  return (
-    <Table aria-label="Load more table">
-      <TableHeader style={{display: 'block'}}>
-        <Column id="name" isRowHeader>Name</Column>
-        <Column id="height">Height</Column>
-        <Column id="mass">Mass</Column>
-        <Column id="birth_year">Birth Year</Column>
-      </TableHeader>
-      <TableBody
-        ref={scrollRef as RefObject<HTMLTableSectionElement>}
-        style={{display: 'block', overflow: 'auto', maxHeight: 100}}
-        renderEmptyState={() => renderEmptyLoader({isLoading: list.loadingState === 'loading'})}
-        items={list.items}>
-        <Collection items={list.items}>
-          {(item) => (
-            <Row id={item.name} style={{width: 'inherit', height: 'inherit'}}>
-              <Cell>{item.name}</Cell>
-              <Cell>{item.height}</Cell>
-              <Cell>{item.mass}</Cell>
-              <Cell>{item.birth_year}</Cell>
-            </Row>
-          )}
-        </Collection>
-        {list.loadingState === 'loadingMore' && <MyTableLoadingIndicator />}
-      </TableBody>
-    </Table>
-  );
-};
-
-export const OnLoadMoreTableStoryBodyScroll  = {
-  render: OnLoadMoreTableBodyScroll,
-  name: 'onLoadMore table, scrollable body'
-};
-
 export function VirtualizedTable() {
   let items: {id: number, foo: string, bar: string, baz: string}[] = [];
   for (let i = 0; i < 1000; i++) {