refactor: component files export only components; lint fails on a warning
The 43 react-refresh/only-export-components warnings the gate let through meant an edit to a provider (or AnchoredPopover, Toaster, plexDetailUi, …) could not be hot-swapped: Fast Refresh reloads a module that also exports hooks or helpers. - Each provider's contexts, the types its hooks return and the hooks themselves live in a sibling context module (navigationContext.ts, channelsContext.ts, …); the provider file keeps the component. loadAccountFilters moved next to the feed filters' defaults (feedFiltersInit.ts), following navigationInit/playlistsInit. - Helpers that sat in component files have their own modules: welcomeMode, downloadTitle, plexPlayable, channelSync, ui/anchoredPopoverHooks, ui/pageToolbarSlot, ui/pagerContent, ui/toastLevels, ui/overlayOrder, ui/tableAlign, lib/plexDetail; the cells of the channel columns and the registry's page wrappers are components files of their own (channelCells, modulePages). - usePersistedTab, an alias of useAccountPersistedState, is gone; its callers use the original. npm run lint is now eslint --max-warnings 0, so a warning fails the gate like an error does.
This commit is contained in:
@@ -1,65 +1,10 @@
|
||||
import { createContext, useCallback, useContext, useState, type ReactNode } from "react";
|
||||
import { useCallback, useState, type ReactNode } from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import Modal from "./ui/Modal";
|
||||
import { Button } from "./ui/Button";
|
||||
import { ChoiceContext, type ChoiceFn, type ChoiceOptions } from "./confirmContext";
|
||||
|
||||
// App-styled, promise-based replacement for window.confirm. Wrap the tree in
|
||||
// <ConfirmProvider> once, then anywhere: const confirm = useConfirm();
|
||||
// if (await confirm({ message: "…", danger: true })) { … }
|
||||
//
|
||||
// For a decision with more than two outcomes use `useChoice()` instead — never chain two
|
||||
// confirms, because the second dialog's Cancel/Escape/backdrop is then indistinguishable from
|
||||
// a deliberate answer (the playlist delete used to read a dismissal as "delete here only" and
|
||||
// went ahead and deleted).
|
||||
interface ConfirmOptions {
|
||||
title?: string;
|
||||
message: ReactNode;
|
||||
confirmLabel?: string;
|
||||
cancelLabel?: string;
|
||||
danger?: boolean;
|
||||
}
|
||||
|
||||
interface Choice {
|
||||
id: string;
|
||||
label: string;
|
||||
danger?: boolean;
|
||||
}
|
||||
|
||||
export interface ChoiceOptions {
|
||||
title?: string;
|
||||
message: ReactNode;
|
||||
cancelLabel?: string;
|
||||
/** Rendered left→right after Cancel. Resolves to the clicked choice's `id`. */
|
||||
choices: Choice[];
|
||||
}
|
||||
|
||||
type ChoiceFn = (opts: ChoiceOptions) => Promise<string | null>;
|
||||
type ConfirmFn = (opts: ConfirmOptions) => Promise<boolean>;
|
||||
|
||||
const ChoiceContext = createContext<ChoiceFn>(() => Promise.resolve(null));
|
||||
|
||||
/** Two outcomes: resolves true on confirm, false on cancel/Escape/backdrop. */
|
||||
export function useConfirm(): ConfirmFn {
|
||||
const ask = useContext(ChoiceContext);
|
||||
return useCallback(
|
||||
async (opts: ConfirmOptions) => {
|
||||
const picked = await ask({
|
||||
title: opts.title,
|
||||
message: opts.message,
|
||||
cancelLabel: opts.cancelLabel,
|
||||
choices: [{ id: "confirm", label: opts.confirmLabel ?? "", danger: opts.danger }],
|
||||
});
|
||||
return picked === "confirm";
|
||||
},
|
||||
[ask],
|
||||
);
|
||||
}
|
||||
|
||||
/** Three or more outcomes. Resolves to the chosen id, or **null** when the user cancels,
|
||||
* presses Escape or clicks the backdrop — dismissal is never one of the actions. */
|
||||
export function useChoice(): ChoiceFn {
|
||||
return useContext(ChoiceContext);
|
||||
}
|
||||
// The dialog behind useConfirm()/useChoice() (see confirmContext.ts for the hooks and their contract).
|
||||
|
||||
export function ConfirmProvider({ children }: { children: ReactNode }) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
Reference in New Issue
Block a user