-
+
@@ -43,15 +64,8 @@ export function FollowSummary({
diff --git a/apps/renderer/src/components/ui/context-menu/context-menu.tsx b/apps/renderer/src/components/ui/context-menu/context-menu.tsx
index 8ce0040241..f1ca2dab72 100644
--- a/apps/renderer/src/components/ui/context-menu/context-menu.tsx
+++ b/apps/renderer/src/components/ui/context-menu/context-menu.tsx
@@ -106,8 +106,8 @@ const ContextMenuCheckboxItem = React.forwardRef<
{...props}
>
-
-
+
+
{children}
diff --git a/apps/renderer/src/components/ui/input/Input.tsx b/apps/renderer/src/components/ui/input/Input.tsx
index 3253f1e893..f1ad58703c 100644
--- a/apps/renderer/src/components/ui/input/Input.tsx
+++ b/apps/renderer/src/components/ui/input/Input.tsx
@@ -18,11 +18,11 @@ export const Input = forwardRef<
ref={ref}
className={cn(
"min-w-0 flex-auto appearance-none rounded-lg text-sm",
- "bg-theme-background px-3 py-[calc(theme(spacing.2)-1px)] placeholder:text-zinc-400 dark:bg-zinc-700/[0.15]",
+ "bg-theme-background px-3 py-[calc(theme(spacing.2)-1px)]",
"ring-accent/20 duration-200 focus:border-accent/80 focus:outline-none focus:ring-2",
"focus:!bg-accent/5",
"border border-border",
- "dark:text-zinc-200 dark:placeholder:text-zinc-500",
+ "placeholder:text-theme-placeholder-text dark:bg-zinc-700/[0.15] dark:text-zinc-200",
"hover:border-accent/60",
props.type === "password" ? "font-mono placeholder:font-sans" : "font-sans",
"w-full",
diff --git a/apps/renderer/src/components/ui/input/TextArea.tsx b/apps/renderer/src/components/ui/input/TextArea.tsx
index 044df59b60..ad7fe907c4 100644
--- a/apps/renderer/src/components/ui/input/TextArea.tsx
+++ b/apps/renderer/src/components/ui/input/TextArea.tsx
@@ -59,7 +59,7 @@ export const TextArea = forwardRef<
"border-transparent",
isFocus && "border-accent/80 ring-2",
- "dark:text-zinc-200 dark:placeholder:text-zinc-500",
+ "placeholder:text-theme-placeholder-text dark:text-zinc-200",
wrapperClassName,
)}
onMouseMove={handleMouseMove}
diff --git a/apps/renderer/src/components/ui/markdown/Markdown.tsx b/apps/renderer/src/components/ui/markdown/Markdown.tsx
index 3c464c0934..16c23cf799 100644
--- a/apps/renderer/src/components/ui/markdown/Markdown.tsx
+++ b/apps/renderer/src/components/ui/markdown/Markdown.tsx
@@ -1,11 +1,13 @@
import { createElement, Fragment, memo, useEffect, useMemo, useState } from "react"
-import type { MediaInfo } from "~/lib/parse-html"
import { parseHtml } from "~/lib/parse-html"
import type { RemarkOptions } from "~/lib/parse-markdown"
import { parseMarkdown } from "~/lib/parse-markdown"
import { cn } from "~/lib/utils"
+import { useWrappedElementSize } from "~/providers/wrapped-element-provider"
+import type { MediaInfoRecord } from "../media"
+import { MediaContainerWidthProvider, MediaInfoRecordProvider } from "../media"
import { MarkdownRenderContainerRefContext } from "./context"
export const Markdown: Component<
@@ -43,7 +45,7 @@ const HTMLImpl = (
accessory?: React.ReactNode
noMedia?: boolean
- mediaInfo?: MediaInfo
+ mediaInfo?: MediaInfoRecord
} & JSX.IntrinsicElements[A] &
Partial<{
renderInlineStyle: boolean
@@ -53,7 +55,6 @@ const HTMLImpl = (
const [remarkOptions, setRemarkOptions] = useState({
renderInlineStyle,
noMedia,
- mediaInfo,
})
const [shouldForceReMountKey, setShouldForceReMountKey] = useState(0)
@@ -79,10 +80,16 @@ const HTMLImpl = (
[children, remarkOptions],
)
+ const { w: containerWidth } = useWrappedElementSize()
+
if (!markdownElement) return null
return (
- {createElement(as, { ...rest, ref: setRefElement }, markdownElement)}
+
+
+ {createElement(as, { ...rest, ref: setRefElement }, markdownElement)}
+
+
{accessory && {accessory} }
)
diff --git a/apps/renderer/src/components/ui/markdown/renderers/BlockImage.tsx b/apps/renderer/src/components/ui/markdown/renderers/BlockImage.tsx
index 157cd2659b..c5c2c5130e 100644
--- a/apps/renderer/src/components/ui/markdown/renderers/BlockImage.tsx
+++ b/apps/renderer/src/components/ui/markdown/renderers/BlockImage.tsx
@@ -1,7 +1,10 @@
import { cn } from "~/lib/utils"
+import { useEntryContentContext } from "~/modules/entry-content/hooks"
import { useWrappedElementSize } from "~/providers/wrapped-element-provider"
+import { useEntry } from "~/store/entry"
import { Media } from "../../media"
+import { usePopulatedFullUrl } from "../utils"
export const MarkdownBlockImage = (
props: React.ImgHTMLAttributes & {
@@ -12,18 +15,28 @@ export const MarkdownBlockImage = (
},
) => {
const size = useWrappedElementSize()
+ const { feedId } = useEntryContentContext()
+
+ const src = usePopulatedFullUrl(feedId, props.src)
+
+ const { entryId } = useEntryContentContext()
+ const media = useEntry(entryId, (entry) => entry?.entries.media?.find((m) => m.url === props.src))
return (
& {
+ proxy?: {
+ width: number
+ height: number
+ }
+ },
+) => {
+ const { feedId } = useEntryContentContext()
+ const populatedUrl = usePopulatedFullUrl(feedId, props.src)
+ return (
+ = ({
thumbnail,
...props
}) => {
- const { src, style, type, previewImageUrl, showFallback, ...rest } = props
+ const { src, style, type, previewImageUrl, showFallback, blurhash, height, width, ...rest } =
+ props
+
+ const ctxMediaInfo = useContext(MediaInfoRecordContext)
+ const ctxHeight = ctxMediaInfo[src!]?.height
+ const ctxWidth = ctxMediaInfo[src!]?.width
+
+ const finalHeight = height || ctxHeight
+ const finalWidth = width || ctxWidth
const [imgSrc, setImgSrc] = useState(() =>
proxy && src && !failedList.has(src)
@@ -61,6 +72,18 @@ const MediaImpl: FC = ({
: src,
)
+ const previewImageSrc = useMemo(
+ () =>
+ proxy && previewImageUrl
+ ? getImageProxyUrl({
+ url: previewImageUrl,
+ width: proxy.width,
+ height: proxy.height,
+ })
+ : previewImageUrl,
+ [previewImageUrl, proxy],
+ )
+
const [mediaLoadState, setMediaLoadState] = useState<"loading" | "loaded" | "error">("loading")
const errorHandle: React.ReactEventHandler = useEventCallback((e) => {
if (imgSrc !== props.src) {
@@ -77,12 +100,17 @@ const MediaImpl: FC = ({
const previewMedia = usePreviewMedia()
const handleClick = useEventCallback((e: React.MouseEvent) => {
if (popper && src) {
+ const width = Number.parseInt(props.width as string)
+ const height = Number.parseInt(props.height as string)
previewMedia(
[
{
url: src,
type,
fallbackUrl: imgSrc,
+ blurhash: props.blurhash,
+ width: width || undefined,
+ height: height || undefined,
},
],
0,
@@ -103,19 +131,24 @@ const MediaImpl: FC = ({
}
})
+ const containerWidth = useMediaContainerWidth()
+
const InnerContent = useMemo(() => {
switch (type) {
case "photo": {
return (
![]()
)}
onError={errorHandle}
className={cn(
- !(props.width || props.height) && "size-full",
- "cursor-card bg-gray-200 object-cover duration-200 dark:bg-neutral-800",
+ "size-full object-contain",
+ // "bg-gray-200 dark:bg-neutral-800",
popper && "cursor-zoom-in",
+ "duration-200",
mediaLoadState === "loaded" ? "opacity-100" : "opacity-0",
-
+ "!my-0",
mediaContainerClassName,
)}
src={imgSrc}
@@ -129,13 +162,13 @@ const MediaImpl: FC = ({
- = ({
handleOnLoad,
imgSrc,
mediaContainerClassName,
+ finalHeight,
+ finalWidth,
mediaLoadState,
popper,
- previewImageUrl,
- props.height,
- props.width,
+ previewImageSrc,
rest,
src,
thumbnail,
@@ -174,10 +207,25 @@ const MediaImpl: FC = ({
)
} else {
return (
-
+ = ({
return (
- {InnerContent}
+ {!!props.width && !!props.height && !!containerWidth ? (
+
+
+ ) : (
+ InnerContent
+ )}
)
}
@@ -201,7 +268,7 @@ const FallbackMedia: FC = ({ type, mediaContainerClassName, classNam
className={cn(
!(props.width || props.height) && "size-full",
"center rounded bg-zinc-100 dark:bg-neutral-900",
- "not-prose !flex max-h-full flex-col space-y-1 p-4",
+ "not-prose !flex max-h-full flex-col space-y-1 p-4 @container",
mediaContainerClassName,
)}
@@ -210,19 +277,56 @@ const FallbackMedia: FC = ({ type, mediaContainerClassName, classNam
width: props.width ? `${props.width}px` : "100%",
}}
>
-
-
)
+const AspectRatio = ({
+ width,
+ height,
+ containerWidth,
+ children,
+ style,
+ ...props
+}: {
+ width: number
+ height: number
+ containerWidth?: number
+ children: React.ReactNode
+ style?: React.CSSProperties
+ [key: string]: any
+}) => {
+ const scaleFactor = containerWidth && width ? Math.min(1, containerWidth / width) : 1
+
+ const scaledWidth = width ? width * scaleFactor : undefined
+ const scaledHeight = height ? height * scaleFactor : undefined
+
+ return (
+
- {feed.title}
+ {feedTitle}
+
+ {props.blurhash && (
+
+
)
}
}
@@ -185,10 +233,29 @@ const MediaImpl: FC
+ {blurhash ? (
+
+
+ {InnerContent}
+
+ Media loaded failed
-
- Go to{" "}
-
- {props.src}
-
-
+
+
+
Media loaded failed
+
+ Go to{" "}
+
+ original media url
+
+
+
+ {children}
+
+ )
+}
+
const VideoPreview: FC<{
src: string
previewImageUrl?: string
@@ -275,3 +379,40 @@ const VideoPreview: FC<{
)
}
+
+const MediaContainerWidthContext = createContext
diff --git a/apps/renderer/src/components/ui/media/preview-media.tsx b/apps/renderer/src/components/ui/media/preview-media.tsx
index 5cda994904..f6c18eb891 100644
--- a/apps/renderer/src/components/ui/media/preview-media.tsx
+++ b/apps/renderer/src/components/ui/media/preview-media.tsx
@@ -2,6 +2,7 @@ import type { MediaModel } from "@follow/shared/hono"
import type { FC } from "react"
import { Fragment, useCallback, useEffect, useRef, useState } from "react"
import { Blurhash } from "react-blurhash"
+import { useTranslation } from "react-i18next"
import { Keyboard, Mousewheel } from "swiper/modules"
import type { SwiperRef } from "swiper/react"
import { Swiper, SwiperSlide } from "swiper/react"
@@ -17,6 +18,7 @@ import { EntryContent } from "~/modules/entry-content"
import { ActionButton, MotionButtonBase } from "../button"
import { microReboundPreset } from "../constants/spring"
import { useCurrentModal } from "../modal"
+import { RootPortal } from "../portal"
import { VideoPlayer } from "./VideoPlayer"
const Wrapper: Component<{
@@ -25,6 +27,7 @@ const Wrapper: Component<{
entryId?: string
}> = ({ children, src, showActions, entryId }) => {
const { dismiss } = useCurrentModal()
+ const { t } = useTranslation(["shortcuts", "external"])
return (
@@ -42,33 +45,35 @@ const Wrapper: Component<{
)}
>
{children}
-
{entryId && (
)}
@@ -283,8 +291,9 @@ const FallbackableImage: FC<
}, [currentSrc, currentState, fallbackUrl, src])
return (
-
- {showActions && (
-
- {!!window.electron && (
+
+
+ )}
+
+
+ {showActions && (
+
+ {!!window.electron && (
+ {
+ tipcClient?.download(src)
+ }}
+ >
+
+
+ )}
{
- tipcClient?.download(src)
+ window.open(src)
}}
>
-
+
- )}
- {
- window.open(src)
- }}
- >
-
-
-
- )}
-
+
+
{isLoading && !isAllError && (
+ // FIXME: optimize this if image load, the placeholder background will flash
{blurhash ? (
@@ -297,6 +306,7 @@ const FallbackableImage: FC<
)}
{!isAllError && (
setIsLoading(false)}
onError={handleError}
@@ -307,6 +317,11 @@ const FallbackableImage: FC<
blurhash && !isLoading ? "duration-500 ease-in-out animate-in fade-in-0" : "",
props.className,
)}
+ style={{
+ maxHeight: `min(100%, ${Number.parseInt(props.height as string)}px)`,
+ maxWidth: `min(100%, ${Number.parseInt(props.width as string)}px)`,
+ ...props.style,
+ }}
/>
)}
{isAllError && (
@@ -342,7 +357,7 @@ const FallbackableImage: FC<
)}
{currentState === "fallback" && (
-
+
This image is preview in low quality, because the original image is not available.
diff --git a/apps/renderer/src/components/ui/modal/stacked/hooks.tsx b/apps/renderer/src/components/ui/modal/stacked/hooks.tsx
index 38bb909a4b..0598c5868c 100644
--- a/apps/renderer/src/components/ui/modal/stacked/hooks.tsx
+++ b/apps/renderer/src/components/ui/modal/stacked/hooks.tsx
@@ -64,6 +64,12 @@ export const useModalStack = (options?: ModalStackOptions) => {
}
}
const actions = {
+ getTopModalStack() {
+ return jotaiStore.get(modalStackAtom)[0]
+ },
+ getModalStackById(id: string) {
+ return jotaiStore.get(modalStackAtom).find((item) => item.id === id)
+ },
dismiss(id: string) {
jotaiStore.set(modalStackAtom, (p) => p.filter((item) => item.id !== id))
},
diff --git a/apps/renderer/src/components/ui/modal/stacked/modal.tsx b/apps/renderer/src/components/ui/modal/stacked/modal.tsx
index 5d3961ea92..dfad4edb2a 100644
--- a/apps/renderer/src/components/ui/modal/stacked/modal.tsx
+++ b/apps/renderer/src/components/ui/modal/stacked/modal.tsx
@@ -1,4 +1,5 @@
import * as Dialog from "@radix-ui/react-dialog"
+import type { BoundingBox } from "framer-motion"
import { useAnimationControls, useDragControls } from "framer-motion"
import { produce } from "immer"
import { useSetAtom } from "jotai"
@@ -23,13 +24,14 @@ import { AppErrorBoundary } from "~/components/common/AppErrorBoundary"
import { SafeFragment } from "~/components/common/Fragment"
import { m } from "~/components/common/Motion"
import { ErrorComponentType } from "~/components/errors/enum"
-import { isElectronBuild } from "~/constants"
+import { ElECTRON_CUSTOM_TITLEBAR_HEIGHT, isElectronBuild } from "~/constants"
import { useSwitchHotKeyScope } from "~/hooks/common"
import { nextFrame, stopPropagation } from "~/lib/dom"
-import { cn } from "~/lib/utils"
+import { cn, getOS } from "~/lib/utils"
import { Divider } from "../../divider"
import { RootPortalProvider } from "../../portal/provider"
+import { EllipsisHorizontalTextWithTooltip } from "../../typography"
import { modalStackAtom } from "./atom"
import { MODAL_STACK_Z_INDEX, modalMontionConfig } from "./constants"
import type { CurrentModalContentProps, ModalActionsInternal } from "./context"
@@ -250,6 +252,17 @@ export const ModalInternal = memo(
},
[autoFocus],
)
+
+ const measureDragConstraints = useCallback((constraints: BoundingBox) => {
+ if (getOS() === "Windows") {
+ return {
+ ...constraints,
+ top: constraints.top + ElECTRON_CUSTOM_TITLEBAR_HEIGHT,
+ }
+ }
+ return constraints
+ }, [])
+
useImperativeHandle(ref, () => modalElementRef.current!)
if (CustomModalComponent) {
return (
@@ -339,6 +352,7 @@ export const ModalInternal = memo(
dragListener={false}
dragMomentum={false}
dragConstraints={edgeElementRef}
+ onMeasureDragConstraints={measureDragConstraints}
whileDrag={{
cursor: "grabbing",
}}
@@ -352,17 +366,15 @@ export const ModalInternal = memo(
className="flex grow flex-col"
>
-
+
{icon && {icon}}
-
- {title}
+
+ {title}
+
{canClose && (
diff --git a/apps/renderer/src/constants/app.tsx b/apps/renderer/src/constants/app.tsx
index f9bf576bcc..6a3ff78db8 100644
--- a/apps/renderer/src/constants/app.tsx
+++ b/apps/renderer/src/constants/app.tsx
@@ -10,6 +10,8 @@ export const I18N_LOCALE_KEY = getStorageNS("I18N_LOCALE")
export const ROUTE_FEED_PENDING = "all"
export const ROUTE_ENTRY_PENDING = "pending"
export const ROUTE_FEED_IN_FOLDER = "folder-"
+export const ROUTE_FEED_IN_LIST = "list-"
+export const ROUTE_FEED_IN_INBOX = "inbox-"
export const DAILY_CLAIM_AMOUNT = "20"
export const INVITATION_PRICE = "100"
diff --git a/apps/renderer/src/database/db.ts b/apps/renderer/src/database/db.ts
index ecdd6e4631..bbfcf6d03d 100644
--- a/apps/renderer/src/database/db.ts
+++ b/apps/renderer/src/database/db.ts
@@ -2,10 +2,20 @@ import type { Transaction } from "dexie"
import Dexie from "dexie"
import { LOCAL_DB_NAME } from "./constants"
-import { dbSchemaV1, dbSchemaV2, dbSchemaV3, dbSchemaV4, dbSchemaV5 } from "./db_schema"
+import {
+ dbSchemaV1,
+ dbSchemaV2,
+ dbSchemaV3,
+ dbSchemaV4,
+ dbSchemaV5,
+ dbSchemaV6,
+ dbSchemaV7,
+} from "./db_schema"
import type { DB_Cleaner } from "./schemas/cleaner"
import type { DB_Entry, DB_EntryRelated } from "./schemas/entry"
import type { DB_Feed, DB_FeedUnread } from "./schemas/feed"
+import type { DB_Inbox } from "./schemas/inbox"
+import type { DB_List } from "./schemas/list"
import type { DB_Subscription } from "./schemas/subscription"
export interface LocalDBSchemaMap {
@@ -15,6 +25,8 @@ export interface LocalDBSchemaMap {
entryRelated: DB_EntryRelated
feedUnreads: DB_FeedUnread
cleaner: DB_Cleaner
+ lists: DB_List
+ inboxes: DB_Inbox
}
// Define a local DB
@@ -24,6 +36,8 @@ export class BrowserDB extends Dexie {
public subscriptions: BrowserDBTable<"subscriptions">
public entryRelated: BrowserDBTable<"entryRelated">
public feedUnreads: BrowserDBTable<"feedUnreads">
+ public lists: BrowserDBTable<"lists">
+ public inboxes: BrowserDBTable<"inboxes">
public cleaner: BrowserDBTable<"cleaner">
constructor() {
@@ -33,6 +47,8 @@ export class BrowserDB extends Dexie {
this.version(3).stores(dbSchemaV3)
this.version(4).stores(dbSchemaV4)
this.version(5).stores(dbSchemaV5)
+ this.version(6).stores(dbSchemaV6)
+ this.version(7).stores(dbSchemaV7)
this.entries = this.table("entries")
this.feeds = this.table("feeds")
@@ -40,6 +56,8 @@ export class BrowserDB extends Dexie {
this.entryRelated = this.table("entryRelated")
this.feedUnreads = this.table("feedUnreads")
this.cleaner = this.table("cleaner")
+ this.lists = this.table("lists")
+ this.inboxes = this.table("inboxes")
}
async upgradeToV2(trans: Transaction) {
diff --git a/apps/renderer/src/database/db_schema.ts b/apps/renderer/src/database/db_schema.ts
index c86fb3d8db..079089555b 100644
--- a/apps/renderer/src/database/db_schema.ts
+++ b/apps/renderer/src/database/db_schema.ts
@@ -28,3 +28,13 @@ export const dbSchemaV5 = {
...dbSchemaV4,
cleaner: "&refId, visitedAt",
}
+
+export const dbSchemaV6 = {
+ ...dbSchemaV5,
+ lists: "&id, title",
+}
+
+export const dbSchemaV7 = {
+ ...dbSchemaV6,
+ inboxes: "&id",
+}
diff --git a/apps/renderer/src/database/schemas/feed.ts b/apps/renderer/src/database/schemas/feed.ts
index fc039099e7..563be27fc4 100644
--- a/apps/renderer/src/database/schemas/feed.ts
+++ b/apps/renderer/src/database/schemas/feed.ts
@@ -1,8 +1,8 @@
-import type { FeedOrListRespModel } from "~/models"
+import type { FeedModel } from "~/models"
export type DB_FeedUnread = {
id: string
count: number
}
-export type DB_Feed = FeedOrListRespModel & { id: string }
+export type DB_Feed = FeedModel & { id: string }
diff --git a/apps/renderer/src/database/schemas/inbox.ts b/apps/renderer/src/database/schemas/inbox.ts
new file mode 100644
index 0000000000..bf51acce17
--- /dev/null
+++ b/apps/renderer/src/database/schemas/inbox.ts
@@ -0,0 +1,4 @@
+export type DB_Inbox = {
+ id: string
+ title: string
+}
diff --git a/apps/renderer/src/database/schemas/list.ts b/apps/renderer/src/database/schemas/list.ts
new file mode 100644
index 0000000000..d489fcadb0
--- /dev/null
+++ b/apps/renderer/src/database/schemas/list.ts
@@ -0,0 +1,12 @@
+export type DB_List = {
+ id: string
+ title: string
+ createdAt: number
+ updatedAt: number
+ description: string
+ fee: number
+ image: string
+ ownerUserId: string
+ timelineUpdatedAt: string
+ feedIds: string[]
+}
diff --git a/apps/renderer/src/hooks/biz/useEntryActions.tsx b/apps/renderer/src/hooks/biz/useEntryActions.tsx
index 0a87dac694..fe63462324 100644
--- a/apps/renderer/src/hooks/biz/useEntryActions.tsx
+++ b/apps/renderer/src/hooks/biz/useEntryActions.tsx
@@ -13,6 +13,12 @@ import {
setReadabilityStatus,
} from "~/atoms/readability"
import { useIntegrationSettingKey } from "~/atoms/settings/integration"
+import {
+ setShowSourceContent,
+ toggleShowSourceContent,
+ useShowSourceContent,
+ useSourceContentModal,
+} from "~/atoms/source-content"
import { whoami } from "~/atoms/user"
import { mountLottie } from "~/components/ui/lottie-container"
import {
@@ -23,6 +29,7 @@ import {
import { shortcuts } from "~/constants/shortcuts"
import { tipcClient } from "~/lib/client"
import { nextFrame } from "~/lib/dom"
+import { FeedViewType } from "~/lib/enum"
import { getOS } from "~/lib/utils"
import StarAnimationUri from "~/lottie/star.lottie?url"
import type { CombinedEntryModel } from "~/models"
@@ -31,6 +38,8 @@ import type { FlatEntryModel } from "~/store/entry"
import { entryActions } from "~/store/entry"
import { useFeedById } from "~/store/feed"
+import { navigateEntry } from "./useNavigateEntry"
+
const absoluteStarAnimationUri = new URL(StarAnimationUri, import.meta.url).href
export const useEntryReadabilityToggle = ({ id, url }: { id: string; url: string }) =>
@@ -97,12 +106,22 @@ export const useUnCollect = (entry: Nullable) => {
export const useRead = () =>
useMutation({
mutationFn: async (entry: Nullable) =>
- entry && entryActions.markRead(entry.feeds.id, entry.entries.id, true),
+ entry &&
+ entryActions.markRead({
+ feedId: entry.feeds.id,
+ entryId: entry.entries.id,
+ read: true,
+ }),
})
export const useUnread = () =>
useMutation({
mutationFn: async (entry: Nullable) =>
- entry && entryActions.markRead(entry.feeds.id, entry.entries.id, false),
+ entry &&
+ entryActions.markRead({
+ feedId: entry.feeds.id,
+ entryId: entry.entries.id,
+ read: false,
+ }),
})
export const useEntryActions = ({
@@ -148,6 +167,9 @@ export const useEntryActions = ({
entryId: populatedEntry?.entries.id ?? undefined,
})
+ const showSourceContent = useShowSourceContent()
+ const showSourceContentModal = useSourceContentModal()
+
const collect = useCollect(populatedEntry)
const uncollect = useUnCollect(populatedEntry)
const read = useRead()
@@ -339,15 +361,46 @@ export const useEntryActions = ({
},
{
key: "openInBrowser",
- name: t("entry_actions.open_in_browser"),
+ name: t("entry_actions.open_in_browser", {
+ which: t(window.electron ? "words.browser" : "words.newTab"),
+ }),
shortcut: shortcuts.entry.openInBrowser.key,
className: "i-mgc-world-2-cute-re",
- hide: !populatedEntry.entries.url,
+ hide: type === "toolbar" || !populatedEntry.entries.url,
onClick: () => {
if (!populatedEntry.entries.url) return
window.open(populatedEntry.entries.url, "_blank")
},
},
+ {
+ key: "viewSourceContent",
+ name: t("entry_actions.view_source_content"),
+ // shortcut: shortcuts.entry.openInBrowser.key,
+ className: !showSourceContent ? "i-mgc-world-2-cute-re" : tw`i-mgc-world-2-cute-fi`,
+ hide: !populatedEntry.entries.url,
+ active: showSourceContent,
+ onClick: () => {
+ if (!populatedEntry.entries.url) return
+ const viewPreviewInModal = [
+ FeedViewType.SocialMedia,
+ FeedViewType.Videos,
+ FeedViewType.Pictures,
+ ].includes(view!)
+ if (viewPreviewInModal) {
+ showSourceContentModal({
+ title: populatedEntry.entries.title ?? undefined,
+ src: populatedEntry.entries.url,
+ })
+ return
+ }
+ if (type === "toolbar") {
+ toggleShowSourceContent()
+ return
+ }
+ navigateEntry({ entryId: populatedEntry.entries.id })
+ setShowSourceContent(true)
+ },
+ },
{
name: t("entry_actions.share"),
key: "share",
@@ -404,9 +457,12 @@ export const useEntryActions = ({
instapaperPassword,
instapaperUsername,
feed?.ownerUserId,
+ type,
+ showSourceContent,
openTipModal,
collect,
uncollect,
+ showSourceContentModal,
read,
unread,
])
diff --git a/apps/renderer/src/hooks/biz/useFeedActions.tsx b/apps/renderer/src/hooks/biz/useFeedActions.tsx
index 40fe014253..57efba69c3 100644
--- a/apps/renderer/src/hooks/biz/useFeedActions.tsx
+++ b/apps/renderer/src/hooks/biz/useFeedActions.tsx
@@ -1,17 +1,26 @@
import { WEB_URL } from "@follow/shared/constants"
+import { env } from "@follow/shared/env"
import { useMemo } from "react"
import { useTranslation } from "react-i18next"
import { whoami } from "~/atoms/user"
import { useModalStack } from "~/components/ui/modal"
-import type { NativeMenuItem } from "~/lib/native-menu"
+import type { FeedViewType } from "~/lib/enum"
+import type { NativeMenuItem, NullableNativeMenuItem } from "~/lib/native-menu"
import { useFeedClaimModal } from "~/modules/claim"
import { FeedForm } from "~/modules/discover/feed-form"
-import { Queries } from "~/queries"
-import { getFeedById, useAddFeedToFeedList, useFeedById } from "~/store/feed"
+import { InboxForm } from "~/modules/discover/inbox-form"
+import { ListForm } from "~/modules/discover/list-form"
+import {
+ getFeedById,
+ useAddFeedToFeedList,
+ useFeedById,
+ useRemoveFeedFromFeedList,
+} from "~/store/feed"
+import { useInboxById } from "~/store/inbox"
+import { useListById, useListByView } from "~/store/list"
import { subscriptionActions, useSubscriptionByFeedId } from "~/store/subscription"
-import { useAuthQuery } from "../common"
import { useNavigateEntry } from "./useNavigateEntry"
import { getRouteParams } from "./useRouteParams"
import { useDeleteSubscription } from "./useSubscriptionActions"
@@ -38,25 +47,23 @@ export const useFeedActions = ({
const navigateEntry = useNavigateEntry()
const isEntryList = type === "entryList"
- const listList = useAuthQuery(Queries.lists.list())
- const addMutation = useAddFeedToFeedList()
+ const { mutateAsync: addFeedToListMutation } = useAddFeedToFeedList()
+ const { mutateAsync: removeFeedFromListMutation } = useRemoveFeedFromFeedList()
+
+ const listByView = useListByView(view!)
const items = useMemo(() => {
if (!feed) return []
- const isList = feed?.type === "list"
+
const items: NativeMenuItem[] = [
- ...(!isList
- ? [
- {
- type: "text" as const,
- label: t("sidebar.feed_actions.mark_all_as_read"),
- shortcut: "Meta+Shift+A",
- disabled: isEntryList,
- click: () => subscriptionActions.markReadByFeedIds({ feedIds: [feedId] }),
- },
- ]
- : []),
- ...(!feed.ownerUserId && !!feed.id && !isList
+ {
+ type: "text" as const,
+ label: t("sidebar.feed_actions.mark_all_as_read"),
+ shortcut: "Meta+Shift+A",
+ disabled: isEntryList,
+ click: () => subscriptionActions.markReadByFeedIds({ feedIds: [feedId] }),
+ },
+ ...(!feed.ownerUserId && !!feed.id && !false
? [
{
type: "text" as const,
@@ -74,11 +81,7 @@ export const useFeedActions = ({
? [
{
type: "text" as const,
- label: t(
- isList
- ? "sidebar.feed_actions.list_owned_by_you"
- : "sidebar.feed_actions.feed_owned_by_you",
- ),
+ label: t("sidebar.feed_actions.feed_owned_by_you"),
},
]
: []),
@@ -86,41 +89,44 @@ export const useFeedActions = ({
type: "separator" as const,
disabled: isEntryList,
},
- ...(!isList
- ? [
- {
- type: "text" as const,
- label: t("sidebar.feed_column.context_menu.add_feeds_to_list"),
- enabled: !!listList.data?.length,
- submenu: listList.data?.map((list) => ({
- label: list.title || "",
- type: "text" as const,
- click() {
- return addMutation.mutate({
- feedId,
- listId: list.id,
- })
- },
- })),
- },
- {
- type: "separator" as const,
- disabled: isEntryList,
+ {
+ type: "text" as const,
+ label: t("sidebar.feed_column.context_menu.add_feeds_to_list"),
+ enabled: !!listByView?.length,
+ submenu: listByView?.map((list) => {
+ const isIncluded = list.feedIds.includes(feedId)
+ return {
+ label: list.title || "",
+ type: "text" as const,
+ checked: isIncluded,
+ click() {
+ if (!isIncluded) {
+ addFeedToListMutation({
+ feedId,
+ listId: list.id,
+ })
+ } else {
+ removeFeedFromListMutation({
+ feedId,
+ listId: list.id,
+ })
+ }
},
- ]
- : []),
+ }
+ }),
+ },
+ {
+ type: "separator" as const,
+ disabled: isEntryList,
+ },
{
type: "text" as const,
label: isEntryList ? t("sidebar.feed_actions.edit_feed") : t("sidebar.feed_actions.edit"),
shortcut: "E",
click: () => {
present({
- title: isList
- ? t("sidebar.feed_actions.edit_list")
- : t("sidebar.feed_actions.edit_feed"),
- content: ({ dismiss }) => (
- , search: URLSearchParams): BizRouteParams => {
@@ -64,6 +67,12 @@ const parseRouteParams = (params: Params, search: URLSearchParams): BizRout
folderName: params.feedId?.startsWith(ROUTE_FEED_IN_FOLDER)
? params.feedId.slice(ROUTE_FEED_IN_FOLDER.length)
: undefined,
+ inboxId: params.feedId?.startsWith(ROUTE_FEED_IN_INBOX)
+ ? params.feedId.slice(ROUTE_FEED_IN_INBOX.length)
+ : undefined,
+ listId: params.feedId?.startsWith(ROUTE_FEED_IN_LIST)
+ ? params.feedId.slice(ROUTE_FEED_IN_LIST.length)
+ : undefined,
}
}
diff --git a/apps/renderer/src/initialize/hydrate.ts b/apps/renderer/src/initialize/hydrate.ts
index 17f38bdab0..a58dda80f1 100644
--- a/apps/renderer/src/initialize/hydrate.ts
+++ b/apps/renderer/src/initialize/hydrate.ts
@@ -3,20 +3,10 @@ import { initializeDefaultIntegrationSettings } from "~/atoms/settings/integrati
import { initializeDefaultUISettings } from "~/atoms/settings/ui"
import { appLog } from "~/lib/log"
import { sleep } from "~/lib/utils"
-import {
- EntryRelatedKey,
- EntryRelatedService,
- EntryService,
- FeedService,
- FeedUnreadService,
- SubscriptionService,
-} from "~/services"
-import type { FlatEntryModel } from "~/store/entry"
-
-import { entryActions, useEntryStore } from "../store/entry/store"
-import { feedActions, useFeedStore } from "../store/feed"
-import { subscriptionActions } from "../store/subscription"
-import { feedUnreadActions } from "../store/unread"
+import { EntryService, FeedService, FeedUnreadService, SubscriptionService } from "~/services"
+import { InboxService } from "~/services/inbox"
+import type { Hydable } from "~/services/interface"
+import { ListService } from "~/services/list"
export const setHydrated = (v: boolean) => {
window.__dbIsReady = v
@@ -25,7 +15,16 @@ export const setHydrated = (v: boolean) => {
export const hydrateDatabaseToStore = async () => {
async function hydrate() {
const now = Date.now()
- await Promise.all([hydrateFeed(), hydrateSubscription(), hydrateFeedUnread(), hydrateEntry()])
+
+ const hydrates: Hydable[] = [
+ FeedService,
+ SubscriptionService,
+ FeedUnreadService,
+ EntryService,
+ ListService,
+ InboxService,
+ ]
+ await Promise.all(hydrates.map((h) => h.hydrate()))
window.__dbIsReady = true
const costTime = Date.now() - now
@@ -40,60 +39,6 @@ export const hydrateDatabaseToStore = async () => {
})
}
-async function hydrateFeed() {
- const feeds = await FeedService.findAll()
- feedActions.upsertMany(feeds)
- return useFeedStore.getState().feeds
-}
-
-async function hydrateFeedUnread() {
- const unread = await FeedUnreadService.getAll()
-
- return feedUnreadActions.hydrate(unread)
-}
-async function hydrateEntry() {
- const [entries, entryRelated, feedEntries, collections] = await Promise.all([
- EntryService.findAll(),
-
- EntryRelatedService.findAll(EntryRelatedKey.READ),
- EntryRelatedService.findAll(EntryRelatedKey.FEED_ID),
- EntryRelatedService.findAll(EntryRelatedKey.COLLECTION),
- ])
-
- const storeValue = [] as FlatEntryModel[]
- for (const entry of entries) {
- const entryRelatedFeedId = entry.feedId || feedEntries[entry.id]
- if (!entryRelatedFeedId) {
- logHydrateError(`Entry ${entry.id} has no related feed id`)
- continue
- }
-
- storeValue.push({
- entries: entry,
- feedId: entryRelatedFeedId,
- read: entryRelated[entry.id] || false,
- collections: collections[entry.id] as {
- createdAt: string
- },
- })
- }
- entryActions.hydrate(storeValue)
- useEntryStore.setState({
- starIds: new Set(Object.keys(collections)),
- })
-}
-
-async function hydrateSubscription() {
- const subscriptions = await SubscriptionService.findAll()
-
- subscriptionActions.upsertMany(subscriptions)
-}
-
-const logHydrateError = (message: string) => {
- // eslint-disable-next-line no-console
- console.debug(`Hydrate error: ${message}, maybe local database data is dirty.`)
-}
-
export const hydrateSettings = () => {
initializeDefaultUISettings()
initializeDefaultGeneralSettings()
diff --git a/apps/renderer/src/lib/native-menu.ts b/apps/renderer/src/lib/native-menu.ts
index 1de25549ee..21fc153ac0 100644
--- a/apps/renderer/src/lib/native-menu.ts
+++ b/apps/renderer/src/lib/native-menu.ts
@@ -3,7 +3,7 @@ import { get } from "lodash-es"
import { tipcClient } from "./client"
import { getOS } from "./utils"
-export type NativeMenuItem =
+export type NativeMenuItem = (
| {
type: "text"
label: string
@@ -14,8 +14,12 @@ export type NativeMenuItem =
shortcut?: string
disabled?: boolean
submenu?: NativeMenuItem[]
+ checked?: boolean
}
| { type: "separator"; disabled?: boolean }
+) & { hide?: boolean }
+
+export type NullableNativeMenuItem = NativeMenuItem | null | undefined | false | ""
function sortShortcutsString(shortcut: string) {
const order = ["Shift", "Ctrl", "Alt", "Meta"]
@@ -31,7 +35,7 @@ function sortShortcutsString(shortcut: string) {
return [...sortedModifiers, ...otherKeys].join("+")
}
export const showNativeMenu = async (
- items: Array>,
+ items: Array,
e?: MouseEvent | React.MouseEvent,
) => {
const nextItems = (items.filter(Boolean) as NativeMenuItem[]).map((item) => {
@@ -41,6 +45,10 @@ export const showNativeMenu = async (
shortcut: item.shortcut ? sortShortcutsString(item.shortcut) : undefined,
}
}
+
+ if (item.hide) {
+ return []
+ }
return item
}) as NativeMenuItem[]
diff --git a/apps/renderer/src/lib/parse-html.ts b/apps/renderer/src/lib/parse-html.ts
index d73b34bbd7..d9003aacfc 100644
--- a/apps/renderer/src/lib/parse-html.ts
+++ b/apps/renderer/src/lib/parse-html.ts
@@ -21,6 +21,7 @@ import { ShikiHighLighter } from "~/components/ui/code-highlighter"
import { MarkdownBlockImage, MarkdownLink, MarkdownP } from "~/components/ui/markdown/renderers"
import { BlockError } from "~/components/ui/markdown/renderers/BlockErrorBoundary"
import { createHeadingRenderer } from "~/components/ui/markdown/renderers/Heading"
+import { MarkdownInlineImage } from "~/components/ui/markdown/renderers/InlineImage"
import { Media } from "~/components/ui/media"
function markInlineImage(node?: Element) {
@@ -31,14 +32,11 @@ function markInlineImage(node?: Element) {
}
}
-export type MediaInfo = Record
-
export const parseHtml = (
content: string,
options?: Partial<{
renderInlineStyle: boolean
noMedia?: boolean
- mediaInfo?: MediaInfo
}>,
) => {
const file = new VFile(content)
@@ -99,13 +97,7 @@ export const parseHtml = (
markInlineImage(node)
return createElement(MarkdownLink, { ...props } as any)
},
- img: ({ ...props }) => {
- return createElement(Img, {
- ...props,
- width: props.src ? options?.mediaInfo?.[props.src]?.width : props.width,
- height: props.src ? options?.mediaInfo?.[props.src]?.height : props.height,
- })
- },
+ img: Img,
h1: createHeadingRenderer(1),
h2: createHeadingRenderer(2),
@@ -216,19 +208,11 @@ const Img: Components["img"] = ({ node, ...props }) => {
...props,
proxy: { height: 0, width: 700 },
}
- if (node?.properties.inline) {
- return createElement(Media, {
- type: "photo",
- ...nextProps,
-
- mediaContainerClassName: tw`max-w-full inline rounded-md`,
- popper: true,
- className: tw`inline`,
- showFallback: true,
- })
- }
- return createElement(MarkdownBlockImage, nextProps)
+ return createElement(
+ node?.properties.inline ? MarkdownInlineImage : MarkdownBlockImage,
+ nextProps,
+ )
}
function extractCodeFromHtml(htmlString: string) {
diff --git a/apps/renderer/src/lib/utils.ts b/apps/renderer/src/lib/utils.ts
index d68b00ca49..90db88790b 100644
--- a/apps/renderer/src/lib/utils.ts
+++ b/apps/renderer/src/lib/utils.ts
@@ -18,20 +18,38 @@ export function clamp(value, min, max) {
return Math.max(Math.min(max, value), min)
}
-export function getEntriesParams({ id, view }: { id?: number | string; view?: number }) {
+export function getEntriesParams({
+ feedId,
+ inboxId,
+ listId,
+ view,
+}: {
+ feedId?: number | string
+ inboxId?: number | string
+ listId?: number | string
+ view?: number
+}) {
const params: {
feedId?: string
feedIdList?: string[]
isCollection?: boolean
withContent?: boolean
+ inboxId?: string
+ listId?: string
} = {}
- if (id === FEED_COLLECTION_LIST) {
- params.isCollection = true
- } else if (id && id !== ROUTE_FEED_PENDING) {
- if (id.toString().includes(",")) {
- params.feedIdList = `${id}`.split(",")
- } else {
- params.feedId = `${id}`
+ if (inboxId) {
+ params.inboxId = `${inboxId}`
+ } else if (listId) {
+ params.listId = `${listId}`
+ } else if (feedId) {
+ if (feedId === FEED_COLLECTION_LIST) {
+ params.isCollection = true
+ } else if (feedId !== ROUTE_FEED_PENDING) {
+ if (feedId.toString().includes(",")) {
+ params.feedIdList = `${feedId}`.split(",")
+ } else {
+ params.feedId = `${feedId}`
+ }
}
}
if (view === FeedViewType.SocialMedia) {
diff --git a/apps/renderer/src/models/types.ts b/apps/renderer/src/models/types.ts
index a9b3766091..6d694a7792 100644
--- a/apps/renderer/src/models/types.ts
+++ b/apps/renderer/src/models/types.ts
@@ -25,10 +25,13 @@ export type TransactionModel = ExtractBizResponse<
export type FeedModel = ExtractBizResponse["data"]["feed"]
-type ListModelPoplutedFeeds = ExtractBizResponse["data"]["list"]
+export type ListModelPoplutedFeeds = ExtractBizResponse["data"]["list"]
export type ListModel = Omit
-export type FeedOrListRespModel = FeedModel | ListModelPoplutedFeeds
-export type FeedOrListModel = FeedModel | ListModel
+
+export type InboxModel = ExtractBizResponse["data"]
+
+export type FeedOrListRespModel = FeedModel | ListModelPoplutedFeeds | InboxModel
+export type FeedOrListModel = FeedModel | ListModel | InboxModel
export type EntryResponse = Exclude<
Extract, { code: 0 }>["data"],
@@ -36,7 +39,8 @@ export type EntryResponse = Exclude<
>
export type EntriesResponse = Array<
- Exclude>["data"], undefined>
+ | Exclude>["data"], undefined>
+ | Exclude>["data"], undefined>
>[number]
export type CombinedEntryModel = EntriesResponse[number] & {
@@ -84,3 +88,27 @@ export type MediaModel = Exclude<
ExtractBizResponse["data"],
undefined
>["entries"]["media"]
+
+export type ActionsInput = {
+ name: string
+ condition: {
+ field?: ActionFeedField
+ operator?: ActionOperation
+ value?: string
+ }[]
+ result: {
+ translation?: string
+ summary?: boolean
+ readability?: boolean
+ rewriteRules?: {
+ from: string
+ to: string
+ }[]
+ blockRules?: {
+ field?: ActionEntryField
+ operator?: ActionOperation
+ value?: string | number
+ }[]
+ webhooks?: string[]
+ }
+}[]
diff --git a/apps/renderer/src/modules/ai/ai-daily/daily.tsx b/apps/renderer/src/modules/ai/ai-daily/daily.tsx
index 5279726938..077f4e3c8b 100644
--- a/apps/renderer/src/modules/ai/ai-daily/daily.tsx
+++ b/apps/renderer/src/modules/ai/ai-daily/daily.tsx
@@ -184,6 +184,7 @@ export const DailyReportModalContent: Component = ({
}) => {
const content = useQueryData({ endDate, startDate, view })
const RelatedEntryLink = useState(() => createRelatedEntryLink("toast"))[0]
+ const { t } = useTranslation()
return (
{content.isLoading ? (
@@ -203,7 +204,7 @@ export const DailyReportModalContent: Component = ({
) : (
+
export const FeedForm: Component<{
url?: string
id?: string
- isList?: boolean
-
defaultValues?: z.infer
-
asWidget?: boolean
-
onSuccess?: () => void
-}> = ({ id: _id, defaultValues = defaultValue, url, asWidget, onSuccess, isList }) => {
- const queryParams = { id: _id, url, isList }
+}> = ({ id: _id, defaultValues = defaultValue, url, asWidget, onSuccess }) => {
+ const queryParams = { id: _id, url }
const feedQuery = useFeed(queryParams)
@@ -66,7 +64,7 @@ export const FeedForm: Component<{
const feed = useFeedByIdOrUrl({
id,
url,
- })
+ }) as FeedModel
const hasSub = useSubscriptionByFeedId(feed?.id || "")
const isSubscribed = !!feedQuery.data?.subscription || hasSub
@@ -96,6 +94,7 @@ export const FeedForm: Component<{
asWidget,
onSuccess,
subscriptionData: feedQuery.data?.subscription,
+ feed,
}}
/>
) : feedQuery.isLoading ? (
@@ -162,13 +161,12 @@ export const FeedForm: Component<{
const FeedInnerForm = ({
defaultValues,
id,
- url,
asWidget,
onSuccess,
subscriptionData,
+ feed,
}: {
defaultValues?: z.infer
- url?: string
id?: string
asWidget?: boolean
onSuccess?: () => void
@@ -178,21 +176,15 @@ const FeedInnerForm = ({
isPrivate?: boolean
title?: string | null
}
+ feed: FeedModel
}) => {
const subscription = useSubscriptionByFeedId(id || "") || subscriptionData
const isSubscribed = !!subscription
const buttonRef = useRef(null)
- const feed = useFeedByIdOrUrl({ id, url })!
- const isList = feed?.type === "list"
const form = useForm>({
resolver: zodResolver(formSchema),
- defaultValues: isList
- ? {
- ...defaultValues,
- view: feed.view.toString(),
- }
- : defaultValues,
+ defaultValues,
})
const { setClickOutSideToDismiss, dismiss } = useCurrentModal()
@@ -213,12 +205,12 @@ const FeedInnerForm = ({
const followMutation = useMutation({
mutationFn: async (values: z.infer) => {
const body = {
- ...(isList ? { listId: feed.id } : { url: feed.url }),
+ url: feed.url,
view: Number.parseInt(values.view),
category: values.category,
isPrivate: values.isPrivate,
title: values.title,
- ...(isSubscribed && !isList && { feedId: feed.id }),
+ feedId: feed.id,
}
const $method = isSubscribed ? apiClient.subscriptions.$patch : apiClient.subscriptions.$post
@@ -289,11 +281,7 @@ const FeedInnerForm = ({
{t("feed_form.view")}
-
)}
@@ -314,36 +302,34 @@ const FeedInnerForm = ({
)}
/>
- {!isList && (
- (
-
+ (
+
+
-
-
- )}
- />
- )}
+
+
+ )}
+ />
)}
/>
- {isList && !!feed.fee && !isSubscribed && (
- >["data"]
-export function DiscoverForm({ type }: { type: string }) {
+export function DiscoverForm({ type = "search" }: { type?: string }) {
const { prefix, default: defaultValue } = info[type]
const form = useForm>({
resolver: zodResolver(formSchema),
@@ -320,21 +321,33 @@ const SearchCard: FC<{
onClick={() => {
present({
title: "Add Feed",
- content: ({ dismiss }) => (
- {
- onSuccess(item)
- dismiss()
- }}
- />
- ),
+ content: ({ dismiss }) =>
+ item.list?.id ? (
+ {
+ onSuccess(item)
+ dismiss()
+ }}
+ />
+ ) : (
+ {
+ onSuccess(item)
+ dismiss()
+ }}
+ />
+ ),
})
}}
>
diff --git a/apps/renderer/src/modules/discover/inbox-form.tsx b/apps/renderer/src/modules/discover/inbox-form.tsx
new file mode 100644
index 0000000000..993abe0eee
--- /dev/null
+++ b/apps/renderer/src/modules/discover/inbox-form.tsx
@@ -0,0 +1,202 @@
+import { env } from "@follow/shared/env"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { useMutation } from "@tanstack/react-query"
+import { useForm } from "react-hook-form"
+import { useTranslation } from "react-i18next"
+import { toast } from "sonner"
+import { z } from "zod"
+
+import { FollowSummary } from "~/components/feed-summary"
+import { Logo } from "~/components/icons/logo"
+import { Button } from "~/components/ui/button"
+import { Card, CardHeader } from "~/components/ui/card"
+import {
+ Form,
+ FormControl,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+} from "~/components/ui/form"
+import { Input } from "~/components/ui/input"
+import { apiClient } from "~/lib/api-fetch"
+import { FeedViewType } from "~/lib/enum"
+import { cn } from "~/lib/utils"
+import type { InboxModel } from "~/models"
+import { useInbox } from "~/queries/inboxes"
+import { useInboxById } from "~/store/inbox"
+import { subscriptionActions } from "~/store/subscription"
+
+export const InboxForm: Component<{
+ id?: string
+ asWidget?: boolean
+ onSuccess?: () => void
+}> = ({ id: _id, asWidget, onSuccess }) => {
+ const queryParams = { id: _id }
+
+ const feedQuery = useInbox(queryParams)
+
+ const id = feedQuery.data?.id || _id
+ const inbox = useInboxById(id)
+
+ const isSubscribed = true
+
+ const { t } = useTranslation()
+
+ return (
+
+}) => {
+ const { t } = useTranslation()
+ const form = useForm>({
+ resolver: zodResolver(formSchema),
+ defaultValues: {
+ handle: inbox?.id,
+ title: inbox?.title || "",
+ },
+ })
+
+ const mutationCreate = useMutation({
+ mutationFn: async ({ handle, title }: { handle: string; title: string }) => {
+ await apiClient.inboxes.$post({
+ json: {
+ handle,
+ title,
+ },
+ })
+ onSuccess?.()
+ },
+ onSuccess: (_) => {
+ subscriptionActions.fetchByView(FeedViewType.Articles)
+ toast.success(t("discover.inbox_create_success"))
+ },
+ onError: () => {
+ toast.error(t("discover.inbox_create_error"))
+ },
+ })
+
+ const mutationChange = useMutation({
+ mutationFn: async ({ handle, title }: { handle: string; title: string }) => {
+ await apiClient.inboxes.$put({
+ json: {
+ handle,
+ title,
+ },
+ })
+ onSuccess?.()
+ },
+ onSuccess: () => {
+ subscriptionActions.fetchByView(FeedViewType.Articles)
+ toast.success(t("discover.inbox_update_success"))
+ },
+ onError: () => {
+ toast.error(t("discover.inbox_update_error"))
+ },
+ })
+
+ function onSubmit(values: z.infer) {
+ if (inbox) {
+ mutationChange.mutate({ handle: values.handle, title: values.title })
+ } else {
+ mutationCreate.mutate({ handle: values.handle, title: values.title })
+ }
+ }
+
+ return (
+
+
+
+
+export const ListForm: Component<{
+ id?: string
+
+ defaultValues?: z.infer
+
+ asWidget?: boolean
+
+ onSuccess?: () => void
+}> = ({ id: _id, defaultValues = defaultValue, asWidget, onSuccess }) => {
+ const queryParams = { id: _id }
+
+ const feedQuery = useList(queryParams)
+
+ const id = feedQuery.data?.list.id || _id
+ const list = useListById(id)
+
+ const hasSub = useSubscriptionByFeedId(list?.id || "")
+ const isSubscribed = !!feedQuery.data?.subscription || hasSub
+
+ const { t } = useTranslation()
+
+ return (
+
+ id?: string
+ asWidget?: boolean
+ onSuccess?: () => void
+ subscriptionData?: {
+ view?: number
+ category?: string | null
+ isPrivate?: boolean
+ title?: string | null
+ }
+ list: ListModel
+}) => {
+ const subscription = useSubscriptionByFeedId(id || "") || subscriptionData
+ const isSubscribed = !!subscription
+ const buttonRef = useRef(null)
+
+ const form = useForm>({
+ resolver: zodResolver(formSchema),
+ defaultValues: {
+ ...defaultValues,
+ view: list.view.toString(),
+ },
+ })
+
+ const { setClickOutSideToDismiss, dismiss } = useCurrentModal()
+
+ useEffect(() => {
+ setClickOutSideToDismiss(!form.formState.isDirty)
+ }, [form.formState.isDirty])
+
+ useEffect(() => {
+ if (subscription) {
+ form.setValue("view", `${subscription?.view}`)
+ form.setValue("isPrivate", subscription?.isPrivate || false)
+ form.setValue("title", subscription?.title || "")
+ }
+ }, [subscription])
+
+ const followMutation = useMutation({
+ mutationFn: async (values: z.infer) => {
+ const body = {
+ listId: list.id,
+ view: Number.parseInt(values.view),
+ category: values.category,
+ isPrivate: values.isPrivate,
+ title: values.title,
+ }
+ const $method = isSubscribed ? apiClient.subscriptions.$patch : apiClient.subscriptions.$post
+
+ return $method({
+ json: body,
+ })
+ },
+ onSuccess: (_, variables) => {
+ if (isSubscribed && variables.view !== `${subscription?.view}`) {
+ subscriptionQuery.byView(subscription?.view).invalidate()
+ tipcClient?.invalidateQuery(subscriptionQuery.byView(subscription?.view).key)
+ feedUnreadActions.fetchUnreadByView(subscription?.view)
+ }
+ subscriptionQuery.byView(Number.parseInt(variables.view)).invalidate()
+ tipcClient?.invalidateQuery(subscriptionQuery.byView(Number.parseInt(variables.view)).key)
+ feedUnreadActions.fetchUnreadByView(Number.parseInt(variables.view))
+
+ const listId = list.id
+ if (listId) {
+ listsQuery.byId({ id: listId }).invalidate()
+ tipcClient?.invalidateQuery(listsQuery.byId({ id: listId }).key)
+ }
+ toast(isSubscribed ? t("feed_form.updated") : t("feed_form.followed"), {
+ duration: 1000,
+ })
+
+ if (!asWidget && !isSubscribed) {
+ window.close()
+ }
+
+ onSuccess?.()
+ },
+ async onError(err) {
+ toastFetchError(err)
+ },
+ })
+
+ function onSubmit(values: z.infer) {
+ followMutation.mutate(values)
+ }
+
+ const t = useI18n()
+
+ return (
+ = memo(({ data, rou
No AI news found for this period.
+{t("ai_daily.no_found")}
+ {t("feed_form.category")}
+ {t("feed_form.category_description")}
+
+
- {t("feed_form.category")}
- {t("feed_form.category_description")}
+ {
+ if (suggestion) {
+ field.onChange(suggestion.value)
+ }
+ }}
+ />
-
- {
- if (suggestion) {
- field.onChange(suggestion.value)
- }
- }}
- />
-
-
-
- {t("feed_form.fee")}{" "}
-
- {t("feed_form.fee_description")}
-
- )}
- {feed.fee}
-
-
-
{isSubscribed && (
diff --git a/apps/renderer/src/modules/discover/form.tsx b/apps/renderer/src/modules/discover/form.tsx
index 68e18bd31a..d17d23ba3d 100644
--- a/apps/renderer/src/modules/discover/form.tsx
+++ b/apps/renderer/src/modules/discover/form.tsx
@@ -30,6 +30,7 @@ import type { FeedViewType } from "~/lib/enum"
import { FollowSummary } from "../../components/feed-summary"
import { FeedForm } from "./feed-form"
+import { ListForm } from "./list-form"
const formSchema = z.object({
keyword: z.string().min(1),
@@ -63,7 +64,7 @@ const info: Record<
}
type DiscoverSearchData = Awaited
+ {!asWidget && (
+
+ )
+}
+
+const inboxHandleSchema = z
+ .string()
+ .min(3)
+ .max(32)
+ .regex(/^[a-z0-9_-]+$/)
+
+const formSchema = z.object({
+ handle: inboxHandleSchema,
+ title: z.string(),
+})
+
+const InboxInnerForm = ({
+ onSuccess,
+ inbox,
+}: {
+ onSuccess?: () => void
+ inbox?: Nullable
+
+ )}
+
+ {inbox && (
+
+
+
+
+ )}
+ <>
+
+
+
+
+ )
+}
diff --git a/apps/renderer/src/modules/discover/inbox-list-form.tsx b/apps/renderer/src/modules/discover/inbox-list-form.tsx
new file mode 100644
index 0000000000..ffaf4078dd
--- /dev/null
+++ b/apps/renderer/src/modules/discover/inbox-list-form.tsx
@@ -0,0 +1,172 @@
+import { env } from "@follow/shared/env"
+import { useMutation } from "@tanstack/react-query"
+import { useTranslation } from "react-i18next"
+import { toast } from "sonner"
+
+import { Button } from "~/components/ui/button"
+import { CopyButton } from "~/components/ui/code-highlighter"
+import { useModalStack } from "~/components/ui/modal"
+import {
+ Table,
+ TableBody,
+ TableCell,
+ TableHead,
+ TableHeader,
+ TableRow,
+} from "~/components/ui/table"
+import { apiClient } from "~/lib/api-fetch"
+import { FeedViewType } from "~/lib/enum"
+import { useInboxList } from "~/queries/inboxes"
+import { subscriptionActions } from "~/store/subscription"
+
+import { InboxForm } from "./inbox-form"
+
+export function DiscoverInboxList() {
+ const { t } = useTranslation()
+ const inboxes = useInboxList()
+
+ const { present } = useModalStack()
+
+ return (
+ <>
+
+ {t("discover.inbox.description")}
+
+ {t("discover.inbox.webhooks_docs")}
+
+
+
+
+
+
+ )
+}
+
+const ConfirmDestroyModalContent = ({ id, onSuccess }: { id: string; onSuccess: () => void }) => {
+ const { t } = useTranslation()
+
+ const mutationDestroy = useMutation({
+ mutationFn: async (id: string) => {
+ await apiClient.inboxes.$delete({
+ json: {
+ handle: id,
+ },
+ })
+ },
+ onSuccess: () => {
+ subscriptionActions.fetchByView(FeedViewType.Articles)
+ toast.success(t("discover.inbox_destroy_success"))
+ onSuccess()
+ },
+ onError: () => {
+ toast.error(t("discover.inbox_destroy_error"))
+ },
+ })
+
+ return (
+
+
+ )
+}
diff --git a/apps/renderer/src/modules/discover/list-form.tsx b/apps/renderer/src/modules/discover/list-form.tsx
new file mode 100644
index 0000000000..2b2e185acd
--- /dev/null
+++ b/apps/renderer/src/modules/discover/list-form.tsx
@@ -0,0 +1,356 @@
+import { zodResolver } from "@hookform/resolvers/zod"
+import { useMutation } from "@tanstack/react-query"
+import { useEffect, useRef } from "react"
+import { useForm } from "react-hook-form"
+import { useTranslation } from "react-i18next"
+import { toast } from "sonner"
+import { z } from "zod"
+
+import { FollowSummary } from "~/components/feed-summary"
+import { Logo } from "~/components/icons/logo"
+import { Button } from "~/components/ui/button"
+import { Card, CardHeader } from "~/components/ui/card"
+import {
+ Form,
+ FormControl,
+ FormDescription,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+} from "~/components/ui/form"
+import { Input } from "~/components/ui/input"
+import { LoadingCircle } from "~/components/ui/loading"
+import { useCurrentModal } from "~/components/ui/modal"
+import { Switch } from "~/components/ui/switch"
+import { useI18n } from "~/hooks/common"
+import { apiClient } from "~/lib/api-fetch"
+import { tipcClient } from "~/lib/client"
+import { FeedViewType } from "~/lib/enum"
+import { getFetchErrorMessage, toastFetchError } from "~/lib/error-parser"
+import { getNewIssueUrl } from "~/lib/issues"
+import { cn } from "~/lib/utils"
+import type { ListModel } from "~/models"
+import { lists as listsQuery, useList } from "~/queries/lists"
+import { subscription as subscriptionQuery } from "~/queries/subscriptions"
+import { useListById } from "~/store/list"
+import { useSubscriptionByFeedId } from "~/store/subscription"
+import { feedUnreadActions } from "~/store/unread"
+
+import { ViewSelectorRadioGroup } from "../shared/ViewSelectorRadioGroup"
+
+const formSchema = z.object({
+ view: z.string(),
+ category: z.string().nullable().optional(),
+ isPrivate: z.boolean().optional(),
+ title: z.string().optional(),
+})
+
+const defaultValue = { view: FeedViewType.Articles.toString() } as z.infer{t("discover.inbox_destroy_warning")}
+
+
+
+
+ {!asWidget && (
+
+ )
+}
+
+const ListInnerForm = ({
+ defaultValues,
+ id,
+ asWidget,
+ onSuccess,
+ subscriptionData,
+ list,
+}: {
+ defaultValues?: z.infer
+
+ )}
+
+ {list ? (
+
+
+ ) : feedQuery.error ? (
+
+
+
+ ) : (
+ {t("feed_form.error_fetching_feed")}
++ {getFetchErrorMessage(feedQuery.error)} +
+ +
+
+
+
+
+
+
+
+ )}
+ {t("feed_form.feed_not_found")}
+{id}
+
+
+
+
+
+
+
+
+ )
+}
diff --git a/apps/renderer/src/modules/discover/recommendations-card.tsx b/apps/renderer/src/modules/discover/recommendations-card.tsx
index fde564d04a..aaf008cb10 100644
--- a/apps/renderer/src/modules/discover/recommendations-card.tsx
+++ b/apps/renderer/src/modules/discover/recommendations-card.tsx
@@ -25,11 +25,20 @@ export const RecommendationCard: FC-
{Object.keys(data.routes).map((route) => (
-
- +
- { + ;(e.target as HTMLElement).querySelector("button")?.click() + }} + tabIndex={-1} + >