From 17146bd86582427474c5997518895ca8c63cfa6e Mon Sep 17 00:00:00 2001 From: Ou Date: Fri, 11 Oct 2024 23:44:50 +0800 Subject: [PATCH] feat: support timeline --- server/sources/sputniknewscn.ts | 2 +- shared/data.ts | 16 ++-- shared/sources.ts | 8 ++ shared/types.ts | 9 +++ src/components/section/card.tsx | 129 ++++++++++++++++++++++++-------- src/components/section/dnd.tsx | 4 +- src/routes/__root.tsx | 2 +- 7 files changed, 127 insertions(+), 43 deletions(-) diff --git a/server/sources/sputniknewscn.ts b/server/sources/sputniknewscn.ts index d1d84a2..af69ab6 100644 --- a/server/sources/sputniknewscn.ts +++ b/server/sources/sputniknewscn.ts @@ -15,7 +15,7 @@ export default defineSource(async () => { const date = $a.find(".lenta__item-date").attr("data-unixtime") if (url && title && date) { news.push({ - url, + url: `https://sputniknews.cn${url}`, title, id: url, extra: { diff --git a/shared/data.ts b/shared/data.ts index b115db6..e166f98 100644 --- a/shared/data.ts +++ b/shared/data.ts @@ -1,6 +1,6 @@ import type { Metadata } from "./types" -export const sectionIds = ["focus", "realtime", "china", "world", "tech", "code"] as const +export const sectionIds = ["focus", "realtime", "hottest", "china", "world", "tech"] as const export const metadata: Metadata = { focus: { @@ -9,22 +9,22 @@ export const metadata: Metadata = { }, realtime: { name: "实时", - sources: ["weibo", "douyin", "zhihu", "toutiao", "wallstreetcn", "ithome", "36kr"], + sources: ["weibo", "wallstreetcn", "ithome", "36kr", "zaobao"], + }, + hottest: { + name: "最热", + sources: ["weibo", "douyin", "zhihu", "toutiao"], }, china: { name: "国内", - sources: ["toutiao", "zhihu"], + sources: ["weibo", "douyin", "toutiao", "zhihu"], }, world: { name: "国际", sources: ["sputniknewscn", "zaobao", "cankaoxiaoxi"], }, - code: { - name: "代码", - sources: ["v2ex"], - }, tech: { name: "科技", - sources: ["ithome", "coolapk", "36kr-quick"], + sources: ["ithome", "v2ex", "coolapk", "36kr-quick", "wallstreetcn"], }, } diff --git a/shared/sources.ts b/shared/sources.ts index a66276d..12c4bea 100644 --- a/shared/sources.ts +++ b/shared/sources.ts @@ -18,6 +18,7 @@ export const originSources = { }, "coolapk": { name: "酷安", + type: "hottest", home: "https://coolapk.com", }, "wallstreetcn": { @@ -46,6 +47,7 @@ export const originSources = { }, "douyin": { name: "抖音", + type: "hottest", home: "https://www.douyin.com", }, "hupu": { @@ -54,11 +56,13 @@ export const originSources = { }, "zhihu": { name: "知乎", + type: "hottest", home: "https://www.zhihu.com", }, "weibo": { name: "微博", title: "实时热搜", + type: "hottest", interval: Time.Realtime, home: "https://weibo.com", }, @@ -78,6 +82,7 @@ export const originSources = { }, "toutiao": { name: "今日头条", + type: "hottest", home: "https://www.toutiao.com", }, "ithome": { @@ -97,12 +102,14 @@ function genSources() { _.push([id, { redirect: `${id}-${subId}`, name: source.name, + type: source.type, interval: source.interval, ...subSource, }] as [any, Source]) } _.push([`${id}-${subId}`, { name: source.name, + type: source.type, interval: source.interval, ...subSource, }] as [any, Source]) @@ -110,6 +117,7 @@ function genSources() { } else { _.push([id, { name: source.name, + type: source.type, interval: source.interval, title: source.title, }]) diff --git a/shared/types.ts b/shared/types.ts index c45b56f..272a142 100644 --- a/shared/types.ts +++ b/shared/types.ts @@ -21,9 +21,17 @@ export interface OriginSource { * 刷新的间隔时间，复用缓存 */ interval?: number + /** + * @default latest + */ + type?: "hottest" | "latest" home: string sub?: Record } @@ -31,6 +39,7 @@ export interface OriginSource { export interface Source { name: string title?: string + type?: "hottest" | "latest" interval?: number redirect?: SourceID } diff --git a/src/components/section/card.tsx b/src/components/section/card.tsx index 90af7f5..11ee4ee 100644 --- a/src/components/section/card.tsx +++ b/src/components/section/card.tsx @@ -46,8 +46,7 @@ export const CardWrapper = forwardRef(({ id, isDragg
(({ id, isDragg ) }) +export function CardOverlay({ id }: { id: SourceID }) { + const [focusSources] = useAtom(focusSourcesAtom) + return ( +
+
+
+ {id} e.currentTarget.src = "/icons/default.png"} + /> + + + + {sources[id].name} + + {sources[id]?.title && {sources[id].title}} + + 刚刚刷新 + +
+
+
+
+
+
+ ) +} + export function NewsCard({ id, inView, isOverlay, handleListeners }: NewsCardProps) { const [focusSources, setFocusSources] = useAtom(focusSourcesAtom) const [refetchSource, setRefetchSource] = useAtom(refetchSourcesAtom) @@ -98,7 +143,7 @@ export function NewsCard({ id, inView, isOverlay, handleListeners }: NewsCardPro return ( <> -
+
-
+
- + + + {sources[id].type === "hottest" ? : } + ) } @@ -146,42 +199,25 @@ function UpdateTime({ query }: Query) { return "加载中..." } -function Num({ num }: { num: number }) { - return ( - - {num} - - ) -} - function ExtraInfo({ item }: { item: NewsItem }) { - const relativeTime = useRelativeTime(item?.extra?.date) if (item?.extra?.info) { return <>{item.extra.info} } - if (item?.extra?.icon) { return e.currentTarget.hidden = true} /> } - - if (relativeTime) { - return <>{relativeTime} - } } function NewsList({ query }: Query) { const items = query.data?.items return ( - - {items?.slice(0, 20).map((item, i) => ( - + ))} - + + ) +} + +function UpdatedTime({ item }: { item: NewsItem }) { + const relativeTime = useRelativeTime(item?.extra?.date) + return <>{relativeTime} +} + +function NewsListTimeLine({ query }: Query) { + const items = query.data?.items + return ( +
    + {items?.map(item => ( +
  1. +
    2. + ))} +
) } diff --git a/src/components/section/dnd.tsx b/src/components/section/dnd.tsx index 3ac74ca..860d10a 100644 --- a/src/components/section/dnd.tsx +++ b/src/components/section/dnd.tsx @@ -16,7 +16,7 @@ import type { SourceID } from "@shared/types" import { CSS } from "@dnd-kit/utilities" import { motion } from "framer-motion" import type { ItemsProps } from "./card" -import { CardWrapper } from "./card" +import { CardOverlay, CardWrapper } from "./card" import { currentSectionAtom } from "~/atoms" export function Dnd() { @@ -98,7 +98,7 @@ export function DndWrapper({ items, setItems, children }: PropsWithChildren - {!!activeId && } + {!!activeId && } ) diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx index 972cc24..6248eb7 100644 --- a/src/routes/__root.tsx +++ b/src/routes/__root.tsx @@ -31,7 +31,7 @@ function RootComponent() {
-
+