fix: add rsshub discover error boundary

Signed-off-by: Innei <tukon479@gmail.com>
This commit is contained in:
Innei 2024-10-31 19:56:27 +08:00
parent b1c5d84810
commit 665c009bf8
No known key found for this signature in database
GPG Key ID: 0F62D33977F021F7
8 changed files with 61 additions and 15 deletions

View File

@ -0,0 +1,31 @@
import type { FC } from "react"
import { attachOpenInEditor } from "~/lib/dev"
import type { AppErrorFallbackProps } from "../common/AppErrorBoundary"
import { FeedbackIssue } from "../common/ErrorElement"
import { parseError } from "./helper"
const RSSHubErrorFallback: FC<AppErrorFallbackProps> = (props) => {
const { message, stack } = parseError(props.error)
return (
<div className="flex flex-col items-center justify-center">
<div className="m-auto max-w-prose text-center">
<p className="center my-3 gap-2 font-bold">
<i className="i-mgc-bug-cute-re text-red-500" />
RSSHub has a temporary problem, please contact the our team.
</p>
<div className="text-lg">{message}</div>
{import.meta.env.DEV && stack ? (
<pre className="mt-4 max-h-48 cursor-text overflow-auto whitespace-pre-line rounded-md bg-red-50 p-4 text-left font-mono text-sm text-red-600">
{attachOpenInEditor(stack)}
</pre>
) : null}
<FeedbackIssue message={message!} stack={stack} />
</div>
</div>
)
}
export default RSSHubErrorFallback

View File

@ -5,4 +5,6 @@ export enum ErrorComponentType {
// Feed
FeedFoundCanBeFollow = "FeedFoundCanBeFollow",
FeedNotFound = "FeedNotFound",
// Section
RSSHubDiscoverError = "RSSHubDiscoverError",
}

View File

@ -9,6 +9,7 @@ const ErrorFallbackMap = {
() => import("./FeedFoundCanBeFollowErrorFallback"),
),
[ErrorComponentType.FeedNotFound]: lazy(() => import("./FeedNotFound")),
[ErrorComponentType.RSSHubDiscoverError]: lazy(() => import("./RSSHubError")),
}
export const getErrorFallback = (type: ErrorComponentType) => ErrorFallbackMap[type]

View File

@ -112,7 +112,7 @@ export function GuideModalContent({ onClose }: { onClose: () => void }) {
{
title: t.app("new_user_guide.step.shortcuts.title"),
content: (
<div className="w-[400px] space-y-2">
<div className="space-y-2">
<p>{t.app("new_user_guide.step.shortcuts.description1")}</p>
<p>
<Trans

View File

@ -47,16 +47,22 @@ export function BehaviorGuide() {
wrapperClassName="border rounded-lg p-3 has-[:checked]:bg-theme-accent has-[:checked]:text-white transition-colors"
label={t("new_user_guide.step.behavior.unread_question.option1")}
value="radical"
className="hidden"
labelClassName="pl-0"
/>
<Radio
wrapperClassName="border rounded-lg p-3 has-[:checked]:bg-theme-accent has-[:checked]:text-white transition-colors"
label={t("new_user_guide.step.behavior.unread_question.option2")}
value="balanced"
className="hidden"
labelClassName="pl-0"
/>
<Radio
wrapperClassName="border rounded-lg p-3 has-[:checked]:bg-theme-accent has-[:checked]:text-white transition-colors"
label={t("new_user_guide.step.behavior.unread_question.option3")}
value="conservative"
className="hidden"
labelClassName="pl-0"
/>
</RadioGroup>
</div>

View File

@ -1,5 +1,7 @@
import { ScrollArea } from "@follow/components/ui/scroll-area/index.js"
import { AppErrorBoundary } from "~/components/common/AppErrorBoundary"
import { ErrorComponentType } from "~/components/errors/enum"
import { useAuthQuery } from "~/hooks/common"
import { Recommendations } from "~/modules/discover/recommendations"
import { Queries } from "~/queries"
@ -27,10 +29,12 @@ export function RSSHubGuide() {
}
return (
<ScrollArea.ScrollArea viewportClassName="h-[450px]">
<div className="space-y-3">
<Recommendations hideTitle className="grid-cols-4" />
</div>
</ScrollArea.ScrollArea>
<AppErrorBoundary errorType={ErrorComponentType.RSSHubDiscoverError}>
<ScrollArea.ScrollArea viewportClassName="h-[450px]">
<div className="space-y-3">
<Recommendations hideTitle className="grid-cols-4" />
</div>
</ScrollArea.ScrollArea>
</AppErrorBoundary>
)
}

View File

@ -6,6 +6,8 @@ import { useTranslation } from "react-i18next"
import { useSearchParams } from "react-router-dom"
import { useUserRole } from "~/atoms/user"
import { AppErrorBoundary } from "~/components/common/AppErrorBoundary"
import { ErrorComponentType } from "~/components/errors/enum"
import { useActivationModal } from "~/modules/activation"
import { DiscoverForm } from "~/modules/discover/form"
import { DiscoverImport } from "~/modules/discover/import"
@ -114,7 +116,9 @@ export function Component() {
</TabsContent>
))}
</Tabs>
<Recommendations />
<AppErrorBoundary errorType={ErrorComponentType.RSSHubDiscoverError}>
<Recommendations />
</AppErrorBoundary>
</div>
)
}

View File

@ -9,9 +9,10 @@ export const Radio: FC<
React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> & {
label: ReactNode
wrapperClassName?: string
labelClassName?: string
}
> = (props) => {
const { id, label, className, wrapperClassName, value, onChange, ...rest } = props
const { id, label, className, wrapperClassName, labelClassName, value, onChange, ...rest } = props
const { onChange: ctxOnChange } = useRadioContext() || {}
const fallbackId = useId()
@ -22,7 +23,7 @@ export const Radio: FC<
onChange?.(e)
})
return (
<div className={cn("flex items-center", wrapperClassName)}>
<label className={cn("flex items-center", wrapperClassName)} htmlFor={id ?? fallbackId}>
<input
{...rest}
type="radio"
@ -36,12 +37,9 @@ export const Radio: FC<
onChange={handleChange}
/>
<label
className={cn(rest.disabled ? "text-theme-disabled" : "", "pl-2")}
htmlFor={id ?? fallbackId}
>
<span className={cn(rest.disabled ? "text-theme-disabled" : "", "pl-2", labelClassName)}>
{label}
</label>
</div>
</span>
</label>
)
}