Fix circular imports of error provider

This commit is contained in:
Zoe Roux 2025-02-15 01:12:22 +01:00
parent e3bde0cd57
commit 474a0a546b
No known key found for this signature in database
5 changed files with 21 additions and 21 deletions

View File

@ -1,5 +1,5 @@
import { Slot } from "one";
import { ErrorConsumer } from "~/providers/error-provider";
import { ErrorConsumer } from "~/providers/error-consumer";
export default function Layout() {
return (

View File

@ -0,0 +1,14 @@
import { type ReactNode, useContext } from "react";
import { ErrorView, errorHandlers } from "~/ui/errors";
import { ErrorContext } from "./error-provider";
export const ErrorConsumer = ({ children, scope }: { children: ReactNode; scope: string }) => {
const error = useContext(ErrorContext);
if (!error) return children;
const handler = errorHandlers[error.key] ?? { view: ErrorView };
if (handler.forbid && handler.forbid !== scope) return children;
const Handler = handler.view;
const { key, ...val } = error;
return <Handler {...(val as any)} />;
};

View File

@ -8,7 +8,6 @@ import {
useState,
} from "react";
import type { KyooError } from "~/models";
import { ErrorView, errorHandlers } from "~/ui/errors";
type Error = {
key: string;
@ -16,7 +15,7 @@ type Error = {
retry?: () => void;
};
const ErrorContext = createContext<Error | null>(null);
export const ErrorContext = createContext<Error | null>(null);
const ErrorSetterContext = createContext<{
setError: (error: Error | null) => void;
clearError: (key: string) => void;
@ -45,16 +44,6 @@ export const ErrorProvider = ({ children }: { children: ReactNode }) => {
);
};
export const ErrorConsumer = ({ children, scope }: { children: ReactNode; scope: string }) => {
const error = useContext(ErrorContext);
if (!error) return children;
const handler = errorHandlers[error.key] ?? { view: ErrorView };
if (handler.forbid && handler.forbid !== scope) return children;
const Handler = handler.view;
const { key, ...val } = error;
return <Handler {...(val as any)} />;
};
export const useSetError = (key: string) => {
const { setError, clearError } = useContext(ErrorSetterContext);
const set = ({ key: nKey, ...obj }: Omit<Error, "key"> & { key?: Error["key"] }) =>

View File

@ -5,12 +5,9 @@ import { type ReactNode, useMemo, useState } from "react";
import { ThemeSelector } from "~/primitives/theme";
import { createQueryClient } from "~/query";
import { AccountProvider } from "./account-provider";
import { ErrorConsumer, ErrorProvider } from "./error-provider";
const { TranslationsProvider } =
typeof window === "undefined"
? await import("./translations.ssr")
: await import("./translations");
import { ErrorConsumer } from "./error-consumer";
import { ErrorProvider } from "./error-provider";
import { TranslationsProvider } from "./translations";
const QueryProvider = ({ children }: { children: ReactNode }) => {
const [queryClient] = useState(() => createQueryClient());

View File

@ -1,6 +1,6 @@
import { useLayoutEffect, type ReactElement } from "react";
import { type ReactElement, useLayoutEffect } from "react";
import { useSetError } from "~/providers/error-provider";
import { ErrorView } from "~/ui/errors";
import { ErrorView } from "~/ui/errors/error";
import { type QueryIdentifier, useFetch } from "./query";
export const Fetch = <Data,>({