feat: add feedback if feed fetched error

Signed-off-by: Innei <i@innei.in>
RSSNext · Jul 26, 2024 · 55a3ec5 · 55a3ec5
1 parent 64979c4
commit 55a3ec5
Show file tree

Hide file tree

Showing 5 changed files with 72 additions and 17 deletions.
diff --git a/src/renderer/src/components/common/ErrorElement.tsx b/src/renderer/src/components/common/ErrorElement.tsx
@@ -1,5 +1,6 @@
-import pkg, { repository } from "@pkg"
+import pkg from "@pkg"
 import { attachOpenInEditor } from "@renderer/lib/dev"
+import { getNewIssueUrl } from "@renderer/lib/issues"
 import { clearLocalPersistStoreData } from "@renderer/store/utils/clear"
 import { useEffect, useRef } from "react"
 import { isRouteErrorResponse, useRouteError } from "react-router-dom"
@@ -63,8 +64,8 @@ export function ErrorElement() {
       <p className="my-8">
         {APP_NAME}
         {" "}
-        has a temporary problem, click the button below to try reloading
-        the app or another solution?
+        has a temporary problem, click the button below to try
+        reloading the app or another solution?
       </p>
 
       <div className="center gap-4">
@@ -86,11 +87,11 @@ export function ErrorElement() {
         Still having this issue? Please give feedback in Github, thanks!
         <a
           className="ml-2 cursor-pointer text-theme-accent-500 duration-200 hover:text-theme-accent"
-          href={`${repository.url}/issues/new?title=${encodeURIComponent(
-            `Error: ${message}`,
-          )}&body=${encodeURIComponent(
-            `### Error\n\n${message}\n\n### Stack\n\n\`\`\`\n${stack}\n\`\`\``,
-          )}&label=bug`}
+          href={getNewIssueUrl({
+            title: `Error: ${message}`,
+            body: `### Error\n\n${message}\n\n### Stack\n\n\`\`\`\n${stack}\n\`\`\``,
+            label: "bug",
+          })}
           target="_blank"
           rel="noreferrer"
         >

diff --git a/src/renderer/src/components/errors/ModalError.tsx b/src/renderer/src/components/errors/ModalError.tsx
@@ -1,5 +1,5 @@
-import { repository } from "@pkg"
 import { attachOpenInEditor } from "@renderer/lib/dev"
+import { getNewIssueUrl } from "@renderer/lib/issues"
 import type { FallbackRender } from "@sentry/react"
 import type { FC } from "react"
 
@@ -53,11 +53,11 @@ export const ModalErrorFallback: FC<Parameters<FallbackRender>[0]> = (
           Still having this issue? Please give feedback in Github, thanks!
           <a
             className="ml-2 cursor-pointer text-theme-accent-500 duration-200 hover:text-theme-accent"
-            href={`${repository.url}/issues/new?title=${encodeURIComponent(
-              `Error: ${message}`,
-            )}&body=${encodeURIComponent(
-              `### Error\n\n${message}\n\n### Stack\n\n\`\`\`\n${stack}\n\`\`\``,
-            )}&label=bug`}
+            href={getNewIssueUrl({
+              title: `Error: ${message}`,
+              body: `### Error\n\n${message}\n\n### Stack\n\n\`\`\`\n${stack}\n\`\`\``,
+              label: "bug",
+            })}
             target="_blank"
             rel="noreferrer"
           >

diff --git a/src/renderer/src/lib/issues.ts b/src/renderer/src/lib/issues.ts
@@ -0,0 +1,21 @@
+import { repository } from "@pkg"
+
+interface IssueOptions {
+  title: string
+  body: string
+  label: string
+}
+export const getNewIssueUrl = ({
+  body,
+  label,
+  title,
+}: Partial<IssueOptions> = {}) => {
+  const baseUrl = `${repository.url}/issues/new`
+
+  const searchParams = new URLSearchParams()
+  if (body) searchParams.set("body", (body))
+  if (label) searchParams.set("label", label)
+  if (title) searchParams.set("title", (title))
+
+  return `${baseUrl}?${searchParams.toString()}`
+}
diff --git a/src/renderer/src/modules/feed-column/item.tsx b/src/renderer/src/modules/feed-column/item.tsx
@@ -11,6 +11,7 @@ import { useFeedActions } from "@renderer/hooks/biz/useFeedActions"
 import { useNavigateEntry } from "@renderer/hooks/biz/useNavigateEntry"
 import { useRouteParamsSelector } from "@renderer/hooks/biz/useRouteParams"
 import { nextFrame } from "@renderer/lib/dom"
+import { getNewIssueUrl } from "@renderer/lib/issues"
 import { showNativeMenu } from "@renderer/lib/native-menu"
 import { cn } from "@renderer/lib/utils"
 import { useFeedById } from "@renderer/store/feed"
@@ -74,7 +75,36 @@ const FeedItemImpl = ({
         window.open(`${WEB_URL}/feed/${feedId}?view=${view}`, "_blank")
       }}
       onContextMenu={(e) => {
-        showNativeMenu(items, e)
+        const nextItems = items.concat()
+        if (feed.errorAt && feed.errorMessage) {
+          nextItems.push(
+            {
+              type: "separator",
+              disabled: false,
+            },
+            {
+              label: "Feedback",
+              type: "text",
+              click: () => {
+                window.open(
+                  getNewIssueUrl({
+                    body:
+                      `### Error\n\nError Message: ${feed.errorMessage}\n\n### Info\n\n` +
+                      `\`\`\`json\n${
+                      JSON.stringify(feed, null, 2)
+                      }\n\`\`\``,
+                    label: "bug",
+                    title: `Feed Error: ${feed.title}, ${feed.errorMessage}`,
+                  }),
+                )
+              },
+            },
+          )
+        }
+        showNativeMenu(
+          nextItems,
+          e,
+        )
       }}
     >
       <div

diff --git a/src/renderer/src/modules/settings/tabs/about.tsx b/src/renderer/src/modules/settings/tabs/about.tsx
@@ -3,6 +3,7 @@ import { Logo } from "@renderer/components/icons/logo"
 import { Button, StyledButton } from "@renderer/components/ui/button"
 import { Divider } from "@renderer/components/ui/divider"
 import { SocialMediaLinks } from "@renderer/constants/social"
+import { getNewIssueUrl } from "@renderer/lib/issues"
 
 export const SettingAbout = () => (
   <div>
@@ -46,7 +47,9 @@ export const SettingAbout = () => (
       </p>
       <p className="mt-3 text-balance text-sm">
         The icon library used by Follow is mgc which is copyrighted by
-        <a href="https://mgc.mingcute.com/" target="_blank" rel="noreferrer">https://mgc.mingcute.com/</a>
+        <a href="https://mgc.mingcute.com/" target="_blank" rel="noreferrer">
+          https://mgc.mingcute.com/
+        </a>
         {" "}
         and cannot be redistributed.
       </p>
@@ -62,7 +65,7 @@ export const SettingAbout = () => (
         {" "}
         <a
           className="inline-flex cursor-pointer items-center gap-1 hover:underline"
-          href={`${repository.url}/issues/new`}
+          href={getNewIssueUrl()}
           target="_blank"
         >
           open an issue