From 71da03c794eccf3bb8feb0837278e5c0927a8018 Mon Sep 17 00:00:00 2001
From: Hongbo Wu <hongbo@omnivore.app>
Date: Fri, 23 Aug 2024 10:23:00 +0800
Subject: [PATCH] fix: failed to search items by rss feed url which has query
 parameters

* encode uri component of the rss feed url
* use descriminated unions to differetiate rss and newsletter subscription
---
 .../queries/useGetSubscriptionsQuery.tsx      | 12 +++++++++-
 packages/web/pages/settings/feeds/index.tsx   | 15 ++++++++++---
 packages/web/pages/settings/shortcuts.tsx     | 22 +++++++++----------
 3 files changed, 34 insertions(+), 15 deletions(-)

diff --git a/packages/web/lib/networking/queries/useGetSubscriptionsQuery.tsx b/packages/web/lib/networking/queries/useGetSubscriptionsQuery.tsx
index d4afc71aa..d24275dd6 100644
--- a/packages/web/lib/networking/queries/useGetSubscriptionsQuery.tsx
+++ b/packages/web/lib/networking/queries/useGetSubscriptionsQuery.tsx
@@ -33,7 +33,17 @@ export type Subscription = {
   failedAt?: string
 
   fetchContentType?: FetchContentType
-}
+} & (
+  | {
+      type: SubscriptionType.NEWSLETTER
+      unsubscribeMailTo?: string
+      unsubscribeHttpUrl?: string
+    }
+  | {
+      type: SubscriptionType.RSS
+      url: string
+    }
+)
 
 type SubscriptionsQueryResponse = {
   error: any
diff --git a/packages/web/pages/settings/feeds/index.tsx b/packages/web/pages/settings/feeds/index.tsx
index ebdcb860f..6f95e21cf 100644
--- a/packages/web/pages/settings/feeds/index.tsx
+++ b/packages/web/pages/settings/feeds/index.tsx
@@ -1,5 +1,5 @@
-import { useRouter } from 'next/router'
 import { FloppyDisk, Pencil, XCircle } from '@phosphor-icons/react'
+import { useRouter } from 'next/router'
 import { useMemo, useState } from 'react'
 import { FormInput } from '../../../components/elements/FormElements'
 import {
@@ -22,6 +22,7 @@ import {
 } from '../../../lib/networking/mutations/updateSubscriptionMutation'
 import {
   FetchContentType,
+  Subscription,
   SubscriptionStatus,
   SubscriptionType,
   useGetSubscriptionsQuery,
@@ -32,9 +33,13 @@ import { formatMessage } from '../../../locales/en/messages'
 
 export default function Rss(): JSX.Element {
   const router = useRouter()
-  const { subscriptions, revalidate, isValidating } = useGetSubscriptionsQuery(
+  const subscriptionsResponse = useGetSubscriptionsQuery(
     SubscriptionType.RSS
   )
+  const subscriptions = subscriptionsResponse.subscriptions as Array<
+    Subscription & { type: SubscriptionType.RSS }
+  >
+  const { isValidating, revalidate } = subscriptionsResponse
   const [onDeleteId, setOnDeleteId] = useState<string>('')
   const [onEditId, setOnEditId] = useState('')
   const [onEditName, setOnEditName] = useState('')
@@ -266,7 +271,11 @@ export default function Rss(): JSX.Element {
                 </VStack>
               }
               onClick={() => {
-                router.push(`/home?q=in:inbox rss:"${subscription.url}"`)
+                router.push(
+                  `/home?q=in:inbox rss:"${encodeURIComponent(
+                    subscription.url
+                  )}"`
+                )
               }}
               // extraElement={
               //   <HStack
diff --git a/packages/web/pages/settings/shortcuts.tsx b/packages/web/pages/settings/shortcuts.tsx
index b07485edd..71f753e7d 100644
--- a/packages/web/pages/settings/shortcuts.tsx
+++ b/packages/web/pages/settings/shortcuts.tsx
@@ -1,17 +1,21 @@
+import { Tag } from '@phosphor-icons/react'
+import * as Switch from '@radix-ui/react-switch'
+import { styled } from '@stitches/react'
 import { useCallback, useEffect, useMemo, useReducer } from 'react'
-import { SettingsLayout } from '../../components/templates/SettingsLayout'
-import { styled } from '../../components/tokens/stitches.config'
+import { CoverImage } from '../../components/elements/CoverImage'
+import { FollowingIcon } from '../../components/elements/icons/FollowingIcon'
+import { NewsletterIcon } from '../../components/elements/icons/NewsletterIcon'
 import {
   Box,
-  VStack,
   HStack,
-  SpanBox,
   Separator,
+  SpanBox,
+  VStack,
 } from '../../components/elements/LayoutPrimitives'
 import { StyledText } from '../../components/elements/StyledText'
-import { SubscriptionType } from '../../lib/networking/queries/useGetSubscriptionsQuery'
-import { CoverImage } from '../../components/elements/CoverImage'
+import { SettingsLayout } from '../../components/templates/SettingsLayout'
 import { useGetLabels } from '../../lib/networking/labels/useLabels'
+import { SubscriptionType } from '../../lib/networking/queries/useGetSubscriptionsQuery'
 import { useGetSavedSearches } from '../../lib/networking/savedsearches/useSavedSearches'
 import {
   Shortcut,
@@ -19,12 +23,8 @@ import {
   useGetShortcuts,
   useSetShortcuts,
 } from '../../lib/networking/shortcuts/useShortcuts'
-import * as Switch from '@radix-ui/react-switch'
 import { useGetSubscriptions } from '../../lib/networking/subscriptions/useGetSubscriptions'
-import { NewsletterIcon } from '../../components/elements/icons/NewsletterIcon'
-import { FollowingIcon } from '../../components/elements/icons/FollowingIcon'
 import { escapeQuotes } from '../../utils/helper'
-import { Tag } from '@phosphor-icons/react'
 
 function flattenShortcuts(shortcuts: Shortcut[]): string[] {
   let result: string[] = []
@@ -288,7 +288,7 @@ const Subscriptions = (props: ListProps) => {
                             ? `subscription:\"${escapeQuotes(
                                 subscription.name
                               )}\"`
-                            : `rss:\"${subscription.url}\"`,
+                            : `rss:\"${encodeURIComponent(subscription.url)}\"`,
                       }
                       if (checked) {
                         props.dispatchList({