diff --git a/components/LinkViews/Links.tsx b/components/LinkViews/Links.tsx
index 11720dc..511c1d2 100644
--- a/components/LinkViews/Links.tsx
+++ b/components/LinkViews/Links.tsx
@@ -61,38 +61,6 @@ export function CardView({
);
}
-export function ListView({
- links,
- editMode,
- isLoading,
- placeholders,
- hasNextPage,
- placeHolderRef,
-}: {
- links?: LinkIncludingShortenedCollectionAndTags[];
- editMode?: boolean;
- isLoading?: boolean;
- placeholders?: number[];
- hasNextPage?: boolean;
- placeHolderRef?: any;
-}) {
- return (
-
- {links?.map((e, i) => {
- return (
-
- );
- })}
-
- );
-}
-
export function MasonryView({
links,
editMode,
@@ -137,10 +105,77 @@ export function MasonryView({
/>
);
})}
+
+ {(hasNextPage || isLoading) &&
+ placeholders?.map((e, i) => {
+ return (
+
+ );
+ })}
);
}
+export function ListView({
+ links,
+ editMode,
+ isLoading,
+ placeholders,
+ hasNextPage,
+ placeHolderRef,
+}: {
+ links?: LinkIncludingShortenedCollectionAndTags[];
+ editMode?: boolean;
+ isLoading?: boolean;
+ placeholders?: number[];
+ hasNextPage?: boolean;
+ placeHolderRef?: any;
+}) {
+ return (
+
+ {links?.map((e, i) => {
+ return (
+
+ );
+ })}
+
+ {(hasNextPage || isLoading) &&
+ placeholders?.map((e, i) => {
+ return (
+
+ );
+ })}
+
+ );
+}
+
export default function Links({
layout,
links,
@@ -168,6 +203,9 @@ export default function Links({
links={links}
editMode={editMode}
isLoading={useData?.isLoading}
+ placeholders={placeholderCountToArray(placeholderCount)}
+ hasNextPage={useData?.hasNextPage}
+ placeHolderRef={ref}
/>
);
} else if (layout === ViewMode.Masonry) {
@@ -176,6 +214,9 @@ export default function Links({
links={links}
editMode={editMode}
isLoading={useData?.isLoading}
+ placeholders={placeholderCountToArray(placeholderCount)}
+ hasNextPage={useData?.hasNextPage}
+ placeHolderRef={ref}
/>
);
} else {