import { createContext } from 'react';
import { DispatchType } from './action';
import * as NavBar from '../views/NavigationBar/NavigationBar';
import { NavBarTextColorType } from '../views/NavigationBar/NavigationBar';

export interface IWindow {
  navigationBarBackgroundColor?: string;
  navigationBarTextStyle?: NavBarTextColorType;
  navigationBarTitleText?: string;
  navigationStyle?: string;
  backgroundColor?: string;
  enablePullDownRefresh?: boolean;
}

export interface ITabbarItem {
  pagePath: string;
  text: string;
  iconPath: string;
  selectedIconPath: string;
}
export interface ITabbar {
  textColor?: string;
  backgroundColor?: string;
  selectedColor?: string;
  list?: Array<ITabbarItem>;
}

export interface IPreviewImage {
  path: string;
  link?: string;
}

export interface IState {
  appName: string;
  version: string;
  baseLibraryVersion: string;
  pages: string[];
  window: IWindow;
  whiteListDomains: string[];
  tabBar?: ITabbar;
  headerImage?: string;
  previewImages?: string[];
  previewImagesV2?: IPreviewImage[];
}
export interface IMiniAppContext {
  state: IState;
  dispatch: DispatchType;
}

export const initialState: IState = {
  // default settings
  appName: '',
  version: '',
  baseLibraryVersion: '',
  pages: [],
  window: {
    navigationBarTextStyle: NavBar.NavBarTextColorType.black,
  },
  whiteListDomains: [],
  tabBar: {
    textColor: '#000000',
    backgroundColor: '#fffff',
    selectedColor: '#aaaaaa',
  },
  headerImage: '',
  previewImages: [],
};

export const MiniAppContext = createContext<IMiniAppContext>({
  state: initialState,
  dispatch: () => {},
});