-
{filteredFeedItemsOrder.map((contentId) => (
))}
diff --git a/src/components/ui/progress.tsx b/src/components/ui/progress.tsx
new file mode 100644
index 0000000..aa9e384
--- /dev/null
+++ b/src/components/ui/progress.tsx
@@ -0,0 +1,28 @@
+"use client";
+
+import * as React from "react";
+import * as ProgressPrimitive from "@radix-ui/react-progress";
+
+import { cn } from "~/lib/utils";
+
+const Progress = React.forwardRef<
+ React.ElementRef
,
+ React.ComponentPropsWithoutRef
+>(({ className, value, ...props }, ref) => (
+
+
+
+));
+Progress.displayName = ProgressPrimitive.Root.displayName;
+
+export { Progress };
diff --git a/src/lib/data/store.ts b/src/lib/data/store.ts
index 7056d2d..e3be27a 100644
--- a/src/lib/data/store.ts
+++ b/src/lib/data/store.ts
@@ -4,12 +4,14 @@ import { ApplicationFeedItem } from "~/server/db/schema";
import { orpcRouterClient } from "../orpc";
import { createSelectorHooks } from "./createSelectorHooks";
import { sortFeedItemsOrderByDate } from "../sortFeedItems";
+import { FetchFeedsStatus } from "~/server/rss/fetchFeeds";
export type ApplicationStore = {
reset: () => void;
feedItemsOrder: string[];
setFeedItemsOrder: (itemsOrder: string[]) => void;
feedItemsDict: Record;
+ feedStatusDict: Record;
setFeedItemsDict: (itemsDict: Record) => void;
setFeedItem: (id: string, item: ApplicationFeedItem) => void;
fetchFeedItems: () => Promise;
@@ -24,12 +26,14 @@ const vanillaApplicationStore = createStore()(
set({
feedItemsOrder: [],
feedItemsDict: {},
+ feedStatusDict: {},
fetchFeedItemsLastFetchedAt: null,
fetchFeedItemsStatus: "idle",
}),
feedItemsOrder: [],
setFeedItemsOrder: (itemsOrder) => set({ feedItemsOrder: itemsOrder }),
feedItemsDict: {},
+ feedStatusDict: {},
setFeedItemsDict: (itemsDict) => set({ feedItemsDict: itemsDict }),
setFeedItem: (id, item) =>
set({
@@ -46,57 +50,60 @@ const vanillaApplicationStore = createStore()(
set({
fetchFeedItemsStatus: "fetching",
+ feedStatusDict: {},
});
let lastUpdateTime = 0;
- const DEBOUNCE_TIME = 500;
+ const DEBOUNCE_TIME = 1000;
- for await (const incomingFeedItems of await orpcRouterClient.feedItem.getAll()) {
+ for await (const incomingChunk of await orpcRouterClient.feedItem.getAll()) {
const timeSinceLastUpdate = Date.now() - lastUpdateTime;
const timeToWait = DEBOUNCE_TIME - timeSinceLastUpdate;
const shouldWaitToRender = timeToWait > 0;
- const initialItemsDict = shouldWaitToRender
+ const feedStatusDict = shouldWaitToRender
+ ? get().feedStatusDict
+ : {
+ ...get().feedStatusDict,
+ };
+
+ const feedItemsDict = shouldWaitToRender
? get().feedItemsDict
: {
...get().feedItemsDict,
};
- const initialItemsOrder = shouldWaitToRender
+ const feedItemsOrder = shouldWaitToRender
? get().feedItemsOrder
: [...get().feedItemsOrder];
- const { updatedItemsDict, updatedItemsOrder } =
- incomingFeedItems.reduce(
- ({ updatedItemsDict, updatedItemsOrder }, item) => {
- updatedItemsDict[item.id] = item;
-
- if (!updatedItemsOrder.find((id) => id === item.id)) {
- updatedItemsOrder.push(item.id);
- }
-
- return {
- updatedItemsDict,
- updatedItemsOrder,
- };
- },
- {
- updatedItemsDict: initialItemsDict,
- updatedItemsOrder: initialItemsOrder,
- },
- );
+ if (incomingChunk.type === "feed-status") {
+ feedStatusDict[incomingChunk.feedId] = incomingChunk.status;
+ } else if (incomingChunk.type === "feed-items") {
+ const incomingFeedItems = incomingChunk.feedItems;
+
+ incomingFeedItems.forEach((item) => {
+ feedItemsDict[item.id] = item;
+
+ if (!feedItemsOrder.find((id) => id === item.id)) {
+ feedItemsOrder.push(item.id);
+ }
+ });
+ }
set({
- feedItemsDict: updatedItemsDict,
- feedItemsOrder: updatedItemsOrder.sort(
+ feedItemsDict: feedItemsDict,
+ feedItemsOrder: feedItemsOrder.sort(
sortFeedItemsOrderByDate(get().feedItemsDict),
),
+ feedStatusDict: feedStatusDict,
});
if (!shouldWaitToRender) {
lastUpdateTime = Date.now();
}
}
+
set({
fetchFeedItemsStatus: "success",
fetchFeedItemsLastFetchedAt: Date.now(),
@@ -104,6 +111,7 @@ const vanillaApplicationStore = createStore()(
feedItemsOrder: [...get().feedItemsOrder].sort(
sortFeedItemsOrderByDate(get().feedItemsDict),
),
+ feedStatusDict: { ...get().feedStatusDict },
});
},
}),
@@ -121,13 +129,14 @@ const vanillaApplicationStore = createStore()(
export const feedItemsStore = createSelectorHooks(vanillaApplicationStore);
-export const useFeedItemsDict = feedItemsStore.useFeedItemsDict;
-export const useFeedItemsOrder = feedItemsStore.useFeedItemsOrder;
-
-export const useFeedItemsLastFetchedAt =
- feedItemsStore.useFetchFeedItemsLastFetchedAt;
-export const useFetchFeedItemsStatus = feedItemsStore.useFetchFeedItemsStatus;
-export const useFetchFeedItems = feedItemsStore.useFetchFeedItems;
+export const {
+ useFeedItemsDict,
+ useFeedItemsOrder,
+ useFeedStatusDict,
+ useFetchFeedItemsLastFetchedAt,
+ useFetchFeedItemsStatus,
+ useFetchFeedItems,
+} = feedItemsStore;
export const useFeedItemValue = (id: string) => {
return useStore(
diff --git a/src/server/api/routers/feedItemRouter.ts b/src/server/api/routers/feedItemRouter.ts
index cdad52f..eff6556 100644
--- a/src/server/api/routers/feedItemRouter.ts
+++ b/src/server/api/routers/feedItemRouter.ts
@@ -5,7 +5,21 @@ import { prepareArrayChunks } from "~/lib/iterators";
import { type ApplicationFeedItem, feedItems, feeds } from "~/server/db/schema";
import { protectedProcedure } from "~/server/orpc/base";
-import { fetchAndInsertFeedData } from "~/server/rss/fetchFeeds";
+import {
+ fetchAndInsertFeedData,
+ FetchFeedsStatus,
+} from "~/server/rss/fetchFeeds";
+
+type GetAllItemsChunk =
+ | {
+ type: "feed-items";
+ feedItems: ApplicationFeedItem[];
+ }
+ | {
+ type: "feed-status";
+ feedId: number;
+ status: FetchFeedsStatus;
+ };
const isWithinLastMonth = gte(
feedItems.postedAt,
@@ -35,13 +49,29 @@ export const getAll = protectedProcedure.handler(async function* ({ context }) {
// Send existing feed items to user
for (const chunk of prepareArrayChunks(existingApplicationFeedItems, 50)) {
- yield chunk;
+ yield {
+ type: "feed-items",
+ feedItems: chunk,
+ } as GetAllItemsChunk;
}
// Send new feed items to user as they come in
- for await (const feedItems of fetchAndInsertFeedData(context, feedsList)) {
- for (const chunk of prepareArrayChunks(feedItems, 50)) {
- yield chunk;
+ for await (const feedResult of fetchAndInsertFeedData(context, feedsList)) {
+ yield {
+ type: "feed-status",
+ status: feedResult.status,
+ feedId: feedResult.id,
+ } as GetAllItemsChunk;
+
+ if (feedResult.status !== "success") {
+ continue;
+ }
+
+ for (const chunk of prepareArrayChunks(feedResult.feedItems, 50)) {
+ yield {
+ type: "feed-items",
+ feedItems: chunk,
+ } as GetAllItemsChunk;
}
}
diff --git a/src/server/rss/fetchFeeds.ts b/src/server/rss/fetchFeeds.ts
index 179d400..7bdd3b6 100644
--- a/src/server/rss/fetchFeeds.ts
+++ b/src/server/rss/fetchFeeds.ts
@@ -11,6 +11,8 @@ import {
} from "./parsers/youtube";
import { type NewFeedDetails, type RSSFeed } from "./types";
+export type FetchFeedsStatus = "success" | "empty" | "error";
+
export async function fetchNewFeedDetails(
url: string,
): Promise {
@@ -49,12 +51,12 @@ export async function fetchNewFeedDetails(
type FeedResult =
| {
- success: true;
+ status: "success";
feedItems: ApplicationFeedItem[];
id: number;
}
| {
- success: false;
+ status: "empty" | "error";
id: number;
};
@@ -77,9 +79,15 @@ export async function* fetchAndInsertFeedData(
feedData = await fetchWebsiteFeedData(feed);
}
- if (!feedData || !feedData.items.length) {
+ if (!feedData) {
+ return {
+ status: "error",
+ id: feed.id,
+ };
+ }
+ if (!feedData.items.length) {
return {
- success: false,
+ status: "empty",
id: feed.id,
};
}
@@ -132,13 +140,13 @@ export async function* fetchAndInsertFeedData(
});
return {
- success: true,
+ status: "success",
feedItems: applicationFeedItems,
id: feed.id,
};
} catch (err) {
return {
- success: false,
+ status: "error",
id: feed.id,
};
}
@@ -151,13 +159,7 @@ export async function* fetchAndInsertFeedData(
feedPromises.splice(resultIndex, 1);
feedIds.splice(resultIndex, 1);
- if (!result.success) {
- continue;
- }
-
- if (result.success) {
- yield result.feedItems;
- }
+ yield result;
}
return;