/*
 * Copyright (c) 2023 AccelByte Inc. All Rights Reserved
 * This is licensed software from AccelByte Inc, for limitations
 * and restrictions contact your company contract manager.
 */

import React from 'react'

import { Link, NavLink, useLocation, useNavigate } from 'react-router-dom'

import { SdkWidget } from '@accelbyte/widgets-v2/SdkWidget'
import { RouteUtils } from '@accelbyte/widgets-v2/utils/RouteUtils'
import { Footer } from '@accelbyte/widgets-v2/widgets/footer/FooterWidget.stories'
import { widgetOptions } from './appConfig'
import { HeaderWidget } from '@accelbyte/widgets-v2/widgets/header'
import { Env } from '@od-shared/Env'

export const AppWrapper: React.FC<{}> = props => {
  const location = useLocation()
  const navigate = useNavigate()

  return (
    <SdkWidget
      routes={RouteUtils.createWidgetRoutes({})}
      sdkOptions={{
        baseURL: '/api',
        clientId: Env.CLIENT_ID,
        namespace: Env.NAMESPACE,
        redirectURI: Env.REDIRECT_URL
      }}
      widgetOptions={widgetOptions}
      history={{
        push(to) {
          navigate(to)
        },
        replace(to) {
          navigate(to, { replace: true })
        },
        location
      }}
      Link={({ to, children }) => <Link to={to}>{children}</Link>}
      NavLink={({ to, children }) => <NavLink to={to}>{children}</NavLink>}>
      <HeaderWidget userDropdownMenus={[]} />
      {props.children}
      <Footer areLinksHidden={false} />
    </SdkWidget>
  )
}