Rename component

Author: davidsklar99

packages/ui-components/src/api/api.stories.ts

@@ -1,17 +1,17 @@
 import { ComponentStory, ComponentMeta } from "@storybook/react";
 import h from "@macrostrat/hyper";
-import { ScrollableContainer } from "./infinite-scroll";
+import { InfiniteScrollContainer } from "./infinite-scroll";
 import { Card } from "@blueprintjs/core";
 import { useAPIResult } from "./provider";
 
 export default {
   title: "UI components/API/Scrollable Container",
-  component: ScrollableContainer,
+  component: InfiniteScrollContainer,
   argTypes: {},
-} as ComponentMeta<typeof ScrollableContainer>;
+} as ComponentMeta<typeof InfiniteScrollContainer>;
 
-const Template: ComponentStory<typeof ScrollableContainer> = (args) =>
-  h(ScrollableContainer, args);
+const Template: ComponentStory<typeof InfiniteScrollContainer> = (args) =>
+  h(InfiniteScrollContainer, args);
 
 export const Primary = Template.bind({});
 Primary.args = {

packages/ui-components/src/api/infinite-scroll.ts

@@ -10,7 +10,7 @@ interface LoadMoreTriggerProps {
   idKey: string;
 }
 
-interface ScrollableContainerProps {
+interface InfiniteScrollContainerProps {
   startData: any[];
   useData: (lastID: number, input: string, pageSize: number) => any[];
   List: React.ComponentType<{ data: any[] }>;
@@ -43,7 +43,7 @@ export function LoadMoreTrigger(props: LoadMoreTriggerProps) {
   return h.if(loadMore)("div.load-more", { ref }, h(Spinner));
 }
 
-export function ScrollableContainer(props: ScrollableContainerProps) {
+export function InfiniteScrollContainer(props: InfiniteScrollContainerProps) {
   const { startData, useData, List, idKey, SearchBar } = props;
   const startingID = startData[startData.length - 1]?.[idKey] || startData.length; // Use the first item's id or default to 0
   const [lastID, setLastID] = useState(startingID);