Simon/linkwarden
1
0
Fork 0
mirror of https://github.com/linkwarden/linkwarden.git synced 2026-03-03 03:47:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(mobile): refetch loading previews

Browse Source
This commit is contained in:
daniel31x13
2025-11-16 15:29:50 -05:00
parent 257bdf9877
commit ece88eed5c
5 changed files with 110 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
apps/mobile/app/(tabs)/collections/[id].tsx
View File

@@ -6,6 +6,7 @@ import {
Platform,
Text,
ActivityIndicator,
ViewToken,
} from "react-native";
import useAuthStore from "@/store/auth";
import LinkListing from "@/components/LinkListing";
@@ -103,6 +104,20 @@ export default function LinksScreen() {
</Text>
</View>
}
onViewableItemsChanged={({
viewableItems,
}: {
viewableItems: ViewToken[];
}) => {
const links = viewableItems.map(
(e) => e.item
) as LinkIncludingShortenedCollectionAndTags[];
if (links.some((e) => e.id && !e.preview)) {
data.refetch();
}
}}
viewabilityConfig={{ itemVisiblePercentThreshold: 50 }}
/>
)}
</View>

15
apps/mobile/app/(tabs)/dashboard/[section].tsx
View File

@@ -6,6 +6,7 @@ import {
Platform,
ActivityIndicator,
Text,
ViewToken,
} from "react-native";
import useAuthStore from "@/store/auth";
import LinkListing from "@/components/LinkListing";
@@ -110,6 +111,20 @@ export default function LinksScreen() {
</Text>
</View>
}
onViewableItemsChanged={({
viewableItems,
}: {
viewableItems: ViewToken[];
}) => {
const links = viewableItems.map(
(e) => e.item
) as LinkIncludingShortenedCollectionAndTags[];
if (links.some((e) => e.id && !e.preview)) {
data.refetch();
}
}}
viewabilityConfig={{ itemVisiblePercentThreshold: 50 }}
/>
)}
</View>

15
apps/mobile/app/(tabs)/links/index.tsx
View File

@@ -6,6 +6,7 @@ import {
Platform,
Text,
ActivityIndicator,
ViewToken,
} from "react-native";
import useAuthStore from "@/store/auth";
import LinkListing from "@/components/LinkListing";
@@ -80,6 +81,20 @@ export default function LinksScreen() {
</Text>
</View>
}
onViewableItemsChanged={({
viewableItems,
}: {
viewableItems: ViewToken[];
}) => {
const links = viewableItems.map(
(e) => e.item
) as LinkIncludingShortenedCollectionAndTags[];
if (links.some((e) => e.id && !e.preview)) {
data.refetch();
}
}}
viewabilityConfig={{ itemVisiblePercentThreshold: 50 }}
/>
)}
</View>

15
apps/mobile/app/(tabs)/tags/[id].tsx
View File

@@ -6,6 +6,7 @@ import {
Platform,
Text,
ActivityIndicator,
ViewToken,
} from "react-native";
import useAuthStore from "@/store/auth";
import LinkListing from "@/components/LinkListing";
@@ -101,6 +102,20 @@ export default function LinksScreen() {
</Text>
</View>
}
onViewableItemsChanged={({
viewableItems,
}: {
viewableItems: ViewToken[];
}) => {
const links = viewableItems.map(
(e) => e.item
) as LinkIncludingShortenedCollectionAndTags[];
if (links.some((e) => e.id && !e.preview)) {
data.refetch();
}
}}
viewabilityConfig={{ itemVisiblePercentThreshold: 50 }}
/>
)}
</View>

52
apps/mobile/components/DashboardSection.tsx
View File

@@ -1,4 +1,10 @@
import { FlatList, Text, TouchableOpacity, View } from "react-native";
import {
FlatList,
Text,
TouchableOpacity,
View,
ViewToken,
} from "react-native";
import React from "react";
import clsx from "clsx";
import DashboardItem from "@/components/DashboardItem";
@@ -31,7 +37,7 @@ type DashboardSectionProps = {
numberOfLinks: number;
collectionsLength: number;
numberOfPinnedLinks: number;
dashboardData: { isLoading: boolean };
dashboardData: { isLoading: boolean; refetch: Function };
collectionLinks?: any[];
};
@@ -129,6 +135,20 @@ const DashboardSection: React.FC<DashboardSectionProps> = ({
contentContainerStyle={{
paddingHorizontal: 20,
}}
onViewableItemsChanged={({
viewableItems,
}: {
viewableItems: ViewToken[];
}) => {
const links = viewableItems.map(
(e) => e.item
) as LinkIncludingShortenedCollectionAndTags[];
if (links.some((e) => e.id && !e.preview)) {
dashboardData.refetch();
}
}}
viewabilityConfig={{ itemVisiblePercentThreshold: 50 }}
/>
) : (
<View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 mx-5">
@@ -195,6 +215,20 @@ const DashboardSection: React.FC<DashboardSectionProps> = ({
contentContainerStyle={{
paddingHorizontal: 20,
}}
onViewableItemsChanged={({
viewableItems,
}: {
viewableItems: ViewToken[];
}) => {
const links = viewableItems.map(
(e) => e.item
) as LinkIncludingShortenedCollectionAndTags[];
if (links.some((e) => e.id && !e.preview)) {
dashboardData.refetch();
}
}}
viewabilityConfig={{ itemVisiblePercentThreshold: 50 }}
/>
) : (
<View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 mx-5">
@@ -260,6 +294,20 @@ const DashboardSection: React.FC<DashboardSectionProps> = ({
contentContainerStyle={{
paddingHorizontal: 20,
}}
onViewableItemsChanged={({
viewableItems,
}: {
viewableItems: ViewToken[];
}) => {
const links = viewableItems.map(
(e) => e.item
) as LinkIncludingShortenedCollectionAndTags[];
if (links.some((e) => e.id && !e.preview)) {
dashboardData.refetch();
}
}}
viewabilityConfig={{ itemVisiblePercentThreshold: 50 }}
/>
) : (
<View className="flex-col gap-2 justify-center items-center h-40 p-10 rounded-xl bg-base-200 mx-5">