import { Feature } from '@common-stack/client-react';
import { createStackNavigator } from '@react-navigation/stack';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import { createDrawerNavigator } from '@react-navigation/drawer';
import routeConfigKeyReplace from './routeConfigKeyReplace';
import {
    appDrawerFeature,
    appBottomTabFeature,
    appDrawerBottomTabFeature,
    appBottomTabDrawerFeature,
    appHostBottomTabFeature,
} from '../components/Layout/compute.test';

const MyComponent = () => {};

describe('route config key replace', () => {
    const routerConfig = {
        ['/']: {
            exact: false,
            container: createStackNavigator(),
            name: 'MainStack',
            props: {
                initialRouteName: 'MainStack.MainBottomTab',
                screenOptions: {
                    headerShown: false,
                },
            },
        },
        // ['//:orgName']: {
        //     exact: false,
        //    // container: createStackNavigator(),
        //     name: 'OrgNameStack',
        //     props: {
        //         initialRouteName: 'MainStack.OrgNameStack.MainDrawer',
        //         component: MyComponent,
        //         screenOptions: {
        //             headerShown: false,
        //         },
        //     },
        // },
        ['//sample']: {
            name: 'Sample',
            props: {
                priority: 1,
                initialParams: { orgName: 'test' },
                component: MyComponent,
                options: {
                    headerShown: true,
                },
            },
        },
        ['//:orgName/l/home']: {
            name: 'Home',
            props: {
                priority: 1,
                initialParams: { orgName: 'test' },
                component: MyComponent,
                options: {
                    headerShown: true,
                    tabBarLabel: 'Home',
                    headerTitle: 'Home',
                    // tabBarIcon: ({ color }) => <Ionicons name="home" size={24} color={color} />,
                },
            },
        },
        ['//:orgName/l/home/:about']: {
            exact: false,
            name: 'About',
            props: {
                priority: 2,
                initialParams: {},
                component: MyComponent,
                options: {
                    headerShown: true,
                    tabBarLabel: 'About',
                    headerTitle: 'About',
                },
            },
        },
        ['//:orgName/l/account']: {
            name: 'Account',
            props: {
                priority: 3,
                initialParams: {},
                component: MyComponent,
                options: {
                    headerShown: true,
                    tabBarLabel: 'Account',
                    headerTitle: 'Account',
                    // tabBarIcon: ({ color }) => <Ionicons name="home" size={24} color={color} />,
                },
            },
        },
    };

    it('getSortedNavigations with routeConfigKeyReplace ', () => {
        //******************Layout Settings for test*************************/
        // For layout 'side', keyReplaceWith='/main_drawer/',appLayout=appDrawerFeature()
        // For layout 'mixSide', keyReplaceWith='/main_drawer/bottom_tab/',appLayout=appDrawerBottomTabFeature()
        // For layout 'bottom', keyReplaceWith='/bottom_tab/',appLayout=appBottomTabFeature
        // For layout 'host-bottom', keyReplaceWith='/host_tab/',appLayout=appHostBottomTabFeature
        //*******************************************************************/
        const routeConfigFeature = new Feature({ routeConfig: [routerConfig] });

        let keyReplacedWith = '/bottom_tab/';
        const appLayout = appBottomTabFeature;

        const { appFeatures } = routeConfigKeyReplace(keyReplacedWith, routeConfigFeature, appLayout);
        // const appFeatures = new Feature(appLayoutConfig, appLayoutFeatures);
        const Render = appFeatures.getRoutes2('/', 'MainStack');
        const configuredRoute = appFeatures.getConfiguredRoutes2('/');
        expect(Render).toMatchSnapshot();
    });
});