feat: subscribe to other user

src/renderer/src/modules/discover/user-form.tsx

@@ -0,0 +1,41 @@
+import { LoadingCircle } from "@renderer/components/ui/loading"
+import { useAuthQuery } from "@renderer/hooks/common"
+import { Queries } from "@renderer/queries"
+
+import { DiscoverFeedForm } from "./DiscoverFeedForm"
+
+export function DiscoverUser() {
+ const { data, isLoading } = useAuthQuery(
+ Queries.discover.rsshubNamespace({
+ namespace: "follow",
+ }),
+ {
+ meta: {
+ persist: true,
+ },
+ },
+ )
+
+ if (isLoading) {
+ return (
+ <div className="center mt-12 flex w-full flex-col gap-8">
+ <LoadingCircle size="large" />
+ </div>
+ )
+ }
+
+ return (
+ <>
+ {data?.follow.routes && (
+ <div className="w-[512px]">
+ <DiscoverFeedForm
+ routePrefix="follow"
+ route={data.follow.routes[Object.keys(data.follow.routes)[0]]}
+ noDescription
+ submitButtonClassName="justify-center"
+ />
+ </div>
+ )}
+ </>
+ )
+}

src/renderer/src/modules/entry-column/Items/notification-item.tsx

@@ -4,7 +4,9 @@ import { ListItem } from "@renderer/modules/entry-column/templates/list-item-tem
 import type { UniversalItemProps } from "../types"
 
 export function NotificationItem({ entryId, entryPreview, translation }: UniversalItemProps) {
- return <ListItem entryId={entryId} entryPreview={entryPreview} translation={translation} />
+ return (
+ <ListItem entryId={entryId} entryPreview={entryPreview} translation={translation} withFollow />
+ )
 }
 
 export const NotificationItemSkeleton = (

src/renderer/src/modules/entry-column/templates/list-item-template.tsx

@@ -1,15 +1,21 @@
+import { env } from "@env"
 import { AudioPlayer, useAudioPlayerAtomSelector } from "@renderer/atoms/player"
 import { FeedIcon } from "@renderer/components/feed-icon"
+import { FollowIcon } from "@renderer/components/icons/follow"
+import { Button } from "@renderer/components/ui/button"
 import { RelativeTime } from "@renderer/components/ui/datetime"
 import { Media } from "@renderer/components/ui/media"
+import { useModalStack } from "@renderer/components/ui/modal"
 import { FEED_COLLECTION_LIST } from "@renderer/constants"
 import { useAsRead } from "@renderer/hooks/biz/useAsRead"
 import { useRouteParamsSelector } from "@renderer/hooks/biz/useRouteParams"
 import { cn, isSafari } from "@renderer/lib/utils"
+import { FeedForm } from "@renderer/modules/discover/feed-form"
 import { EntryTranslation } from "@renderer/modules/entry-column/translation"
 import { Queries } from "@renderer/queries"
 import { useEntry } from "@renderer/store/entry/hooks"
 import { getPreferredTitle, useFeedById } from "@renderer/store/feed"
+import { useSubscriptionStore } from "@renderer/store/subscription"
 import { useDebounceCallback } from "usehooks-ts"
 
 import { ReactVirtuosoItemPlaceholder } from "../../../components/ui/placeholder"
@@ -22,9 +28,11 @@ export function ListItem({
  translation,
  withDetails,
  withAudio,
+ withFollow,
 }: UniversalItemProps & {
  withDetails?: boolean
  withAudio?: boolean
+ withFollow?: boolean
 }) {
  const entry = useEntry(entryId) || entryPreview
 
@@ -42,6 +50,13 @@ export function ListItem({
  { leading: false },
  )
 
+ const isSubscription = withFollow && entry?.entries.url?.startsWith(`${env.VITE_WEB_URL}/feed/`)
+ const feedId = isSubscription
+ ? entry?.entries.url?.replace(`${env.VITE_WEB_URL}/feed/`, "")
+ : undefined
+ const isFollowed = !!useSubscriptionStore((state) => feedId && state.data[feedId])
+ const { present } = useModalStack()
+
  // NOTE: prevent 0 height element, react virtuoso will not stop render any more
  if (!entry || !feed) return <ReactVirtuosoItemPlaceholder />
 
@@ -122,6 +137,27 @@ export function ListItem({
  )}
  </div>
 
+ {feedId && !isFollowed && (
+ <Button
+ onClick={(e) => {
+ e.stopPropagation()
+ e.preventDefault()
+ present({
+ title: `${APP_NAME}`,
+ clickOutsideToDismiss: true,
+ content: ({ dismiss }) => <FeedForm asWidget id={feedId} onSuccess={dismiss} />,
+ })
+ }}
+ variant="outline"
+ className="h-8"
+ >
+ <>
+ <FollowIcon className="mr-1 size-3" />
+ {APP_NAME}
+ </>
+ </Button>
+ )}
+
  {withAudio && entry.entries?.attachments?.[0].url && (
  <AudioCover
  entryId={entryId}

src/renderer/src/pages/(main)/(layer)/(subview)/discover/index.tsx

@@ -3,6 +3,7 @@ import { DiscoverForm } from "@renderer/modules/discover/form"
 import { DiscoverImport } from "@renderer/modules/discover/import"
 import { Recommendations } from "@renderer/modules/discover/recommendations"
 import { DiscoverRSS3 } from "@renderer/modules/discover/rss3-form"
+import { DiscoverUser } from "@renderer/modules/discover/user-form"
 import { createElement } from "react"
 import { useTranslation } from "react-i18next"
 import { useSearchParams } from "react-router-dom"
@@ -26,6 +27,10 @@ const tabs = [
  name: "RSS3",
  value: "rss3",
  },
+ {
+ name: "User",
+ value: "user",
+ },
  {
  name: "Email",
  value: "email",
@@ -79,4 +84,5 @@ export function Component() {
 const TabComponent = {
  import: DiscoverImport,
  rss3: DiscoverRSS3,
+ user: DiscoverUser,
 }