hyapp-admin-platform/src/features/app-config/hooks/useExploreConfigPage.js

import { useCallback, useMemo, useState } from "react";
import { createExploreTab, deleteExploreTab, listExploreTabs, updateExploreTab } from "@/features/app-config/api";
import { useAppConfigAbilities } from "@/features/app-config/permissions.js";
import { exploreTabSchema } from "@/features/app-config/schema";
import { parseForm } from "@/shared/forms/validation";
import { useAdminQuery } from "@/shared/hooks/useAdminQuery.js";
import { useConfirm } from "@/shared/ui/ConfirmProvider.jsx";
import { useToast } from "@/shared/ui/ToastProvider.jsx";

const emptyData = { items: [], total: 0 };

const emptyForm = () => ({
    enabled: true,
    h5Url: "",
    sortOrder: "0",
    tab: "",
});

export function useExploreConfigPage() {
    const abilities = useAppConfigAbilities();
    const confirm = useConfirm();
    const { showToast } = useToast();
    const [keyword, setKeyword] = useState("");
    const [enabled, setEnabled] = useState("");
    const [activeAction, setActiveAction] = useState("");
    const [editingItem, setEditingItem] = useState(null);
    const [form, setFormState] = useState(emptyForm);
    const [loadingAction, setLoadingAction] = useState("");

    const filters = useMemo(() => ({ enabled, keyword }), [enabled, keyword]);
    const queryFn = useCallback(() => listExploreTabs(filters), [filters]);
    const {
        data = emptyData,
        error,
        loading,
        reload,
    } = useAdminQuery(queryFn, {
        errorMessage: "加载 Explore 配置失败",
        initialData: emptyData,
        queryKey: ["app-config", "explore-tabs", filters],
    });

    const setForm = (patch) => {
        setFormState((current) => ({ ...current, ...patch }));
    };

    const openCreate = () => {
        setEditingItem(null);
        setFormState(emptyForm());
        setActiveAction("create");
    };

    const openEdit = (item) => {
        setEditingItem(item);
        setFormState(formFromExploreTab(item));
        setActiveAction("edit");
    };

    const closeDialog = () => {
        setActiveAction("");
        setEditingItem(null);
        setFormState(emptyForm());
    };

    const resetFilters = () => {
        setKeyword("");
        setEnabled("");
    };

    const submitExploreTab = async (event) => {
        event.preventDefault();
        const payload = parseForm(exploreTabSchema, normalizeForm(form));
        const action = editingItem ? "edit" : "create";
        setLoadingAction(action);
        try {
            if (editingItem) {
                await updateExploreTab(editingItem.id, payload);
                showToast("Explore 配置已更新", "success");
            } else {
                await createExploreTab(payload);
                showToast("Explore 配置已新增", "success");
            }
            closeDialog();
            await reload();
        } catch (err) {
            showToast(err.message || "操作失败", "error");
        } finally {
            setLoadingAction("");
        }
    };

    const toggleExploreTab = async (item, nextEnabled) => {
        setLoadingAction(`toggle:${item.id}`);
        try {
            await updateExploreTab(item.id, {
                enabled: nextEnabled,
                h5Url: item.h5Url || "",
                sortOrder: item.sortOrder || 0,
                tab: item.tab || "",
            });
            await reload();
            showToast(nextEnabled ? "Explore tab 已启用" : "Explore tab 已关闭", "success");
        } catch (err) {
            showToast(err.message || "操作失败", "error");
        } finally {
            setLoadingAction("");
        }
    };

    const removeExploreTab = async (item) => {
        const ok = await confirm({
            confirmText: "删除",
            message: item.tab || `Explore ${item.id}`,
            title: "删除 Explore tab",
            tone: "danger",
        });
        if (!ok) {
            return;
        }
        setLoadingAction(`delete:${item.id}`);
        try {
            await deleteExploreTab(item.id);
            await reload();
            showToast("Explore 配置已删除", "success");
        } catch (err) {
            showToast(err.message || "删除失败", "error");
        } finally {
            setLoadingAction("");
        }
    };

    return {
        abilities,
        activeAction,
        closeDialog,
        data,
        editingItem,
        enabled,
        error,
        form,
        keyword,
        loading,
        loadingAction,
        openCreate,
        openEdit,
        reload,
        removeExploreTab,
        resetFilters,
        setEnabled,
        setForm,
        setKeyword,
        submitExploreTab,
        toggleExploreTab,
    };
}

function normalizeForm(form) {
    return {
        ...form,
        sortOrder: form.sortOrder || 0,
    };
}

function formFromExploreTab(item) {
    return {
        enabled: Boolean(item.enabled),
        h5Url: item.h5Url || "",
        sortOrder: String(item.sortOrder || 0),
        tab: item.tab || "",
    };
}