文件操作 - Router.tsx

文件: /home/www/public/wp-content/plugins/give/src/Views/Components/AdminDetailsPage/Tabs/Router.tsx

编辑文件内容

import { useEffect, useState } from 'react';
import type { PressEvent } from 'react-aria-components';
import { TabsContext, LinkContext, Tabs } from 'react-aria-components';
import { Tab } from '../types';

/**
 * @since 4.4.0
 */
export default function TabsRouter({ children, tabDefinitions }: { children: React.ReactNode, tabDefinitions: Tab[] }) {
    const [selectedKey, onSelectionChange] = useState(tabDefinitions[0].id);

const onPress = (e: PressEvent) => {
        onSelectionChange(e.target.getAttribute('data-href'));
    };

const getTabFromURL = () => {
        const urlParams = new URLSearchParams(window.location.search);
        const tabId = urlParams.get('tab') || selectedKey;
        return tabDefinitions.find((tab) => tab.id === tabId);
    };

const handleTabNavigation = (tabId: string) => {
        const newTab = tabDefinitions.find((tab) => tab.id === tabId);

if (!newTab) {
            return;
        }

const urlParams = new URLSearchParams(window.location.search);
        urlParams.set('tab', newTab.id);

window.history.pushState(null, newTab.title, `${window.location.pathname}?${urlParams.toString()}`);

onSelectionChange(newTab.id);
    };

useEffect(() => {
        handleUrlTabParamOnFirstLoad();

const handlePopState = () => onSelectionChange(getTabFromURL()?.id);

// Updates state based on URL when user navigates with "Back" or "Forward" buttons
        window.addEventListener('popstate', handlePopState);

// Cleanup listener on unmount
        return () => {
            window.removeEventListener('popstate', handlePopState);
        };
    }, []);

return (
        <TabsContext.Provider value={{ selectedKey, onSelectionChange: handleTabNavigation }}>
            <LinkContext.Provider value={{ onPress }}>
                <Tabs>
                    {children}
                </Tabs>
            </LinkContext.Provider>
        </TabsContext.Provider>
    );
}

文件操作 - Router.tsx

文件: /home/www/public/wp-content/plugins/give/src/Views/Components/AdminDetailsPage/Tabs/Router.tsx

编辑文件内容

修改文件时间

删除文件