Fix url encoding in search + error page not showing any error info

This commit is contained in:
mrjvs 2023-11-29 18:30:35 +01:00
parent 8bf6510eaf
commit 9772711a2f
3 changed files with 24 additions and 10 deletions

View File

@ -1,7 +1,7 @@
import { LoadableSource, SourceQuality } from "@/stores/player/utils/qualities";
import { Listener } from "@/utils/events";
export type DisplayErrorType = "hls" | "htmlvideo";
export type DisplayErrorType = "hls" | "htmlvideo" | "global";
export type DisplayError = {
stackTrace?: string;
message?: string;

View File

@ -1,6 +1,10 @@
import { useEffect, useState } from "react";
import { generatePath, useHistory, useParams } from "react-router-dom";
function decode(query: string | null | undefined) {
return query ? decodeURIComponent(query) : "";
}
export function useSearchQuery(): [
string,
(inp: string, force?: boolean) => void,
@ -8,10 +12,10 @@ export function useSearchQuery(): [
] {
const history = useHistory();
const params = useParams<{ query: string }>();
const [search, setSearch] = useState(params.query ?? "");
const [search, setSearch] = useState(decode(params.query));
useEffect(() => {
setSearch(params.query ?? "");
setSearch(decode(params.query));
}, [params.query]);
const updateParams = (inp: string, commitToUrl = false) => {

View File

@ -3,25 +3,35 @@ import { useTranslation } from "react-i18next";
import { ButtonPlain } from "@/components/buttons/Button";
import { Icons } from "@/components/Icon";
import { IconPill } from "@/components/layout/IconPill";
import { DisplayError } from "@/components/player/display/displayInterface";
import { Title } from "@/components/text/Title";
import { Paragraph } from "@/components/utils/Text";
import { ErrorContainer, ErrorLayout } from "@/pages/layouts/ErrorLayout";
import { ErrorCard } from "@/pages/parts/errors/ErrorCard";
export function ErrorPart(props: { error: any; errorInfo: any }) {
const data = JSON.stringify({
error: props.error,
errorInfo: props.errorInfo,
});
const { t } = useTranslation();
const maxLineCount = 5;
const errorLines = (props.errorInfo.componentStack || "")
.split("\n")
.slice(0, maxLineCount);
const error: DisplayError = {
errorName: "What does this do",
type: "global",
message: errorLines.join("\n"),
};
return (
<div className="relative flex flex-1 flex-col">
<div className="relative flex flex-1 flex-col min-h-screen">
<div className="flex h-full flex-1 flex-col items-center justify-center p-5 text-center">
<ErrorLayout>
<ErrorContainer>
<ErrorContainer maxWidth="max-w-2xl">
<IconPill icon={Icons.EYE_SLASH}>{t("errors.badge")}</IconPill>
<Title>{t("errors.title")}</Title>
<Paragraph>{data}</Paragraph>
<Paragraph>{props.error.toString()}</Paragraph>
<ErrorCard error={error} />
<ButtonPlain
theme="purple"
className="mt-6 md:px-12 p-2.5"