Unknown error

[meodemsao]

I using with react-router 6

This my app config

export const AppProvider = ({ children }: AppProviderProps) => {
  return (
    <React.Suspense
      fallback={
        <div className="flex items-center justify-center w-screen h-screen">
          <Spinner size="xl" />
        </div>
      }
    >
      <ErrorBoundary FallbackComponent={ErrorFallback}>
        <HelmetProvider>
          <QueryClientProvider client={queryClient}>
            {process.env.NODE_ENV !== 'test' && <ReactQueryDevtools />}
            <AuthProvider>
              <BrowserRouter>
                <QueryParamProvider
                  adapter={ReactRouter6Adapter}
                  options={{
                    searchStringToObject: parse,
                    objectToSearchString: stringify,
                  }}
                >
                  {children}
                </QueryParamProvider>
              </BrowserRouter>
            </AuthProvider>
          </QueryClientProvider>
        </HelmetProvider>
      </ErrorBoundary>
    </React.Suspense>
  )
}

Example route

import { ContentLayout } from 'components/Layout'
import { AuthActionVerb, AuthPossession } from 'constants/enum/auth'
import { Authorization, useCheckAccess } from 'lib/authorization'

import { RoleCreateComponent } from '../components/RoleCreateComponent'

export const RoleCreate = () => {
  return (
    <ContentLayout title="Create role">
      
        <div className="mt-4">
          <RoleCreateComponent />
        </div>
      
    </ContentLayout>
  )
}

It's work perfect. But if i using

import { ContentLayout } from 'components/Layout'
import { AuthActionVerb, AuthPossession } from 'constants/enum/auth'
import { Authorization, useCheckAccess } from 'lib/authorization'

import { RoleCreateComponent } from '../components/RoleCreateComponent'

export const RoleCreate = () => {
  return (
    <ContentLayout title="Create role">
      <Authorization
        forbiddenFallback={<div>Only admin can view this.</div>}
        persmission={{
          resource: 'role',
          action: AuthActionVerb.CREATE,
          possession: AuthPossession.ANY,
        }}
      >
        <div className="mt-4">
          <RoleCreateComponent />
        </div>
      </Authorization>
    </ContentLayout>
  )
}

or any enum import

import { ContentLayout } from 'components/Layout'
import { AuthActionVerb, AuthPossession } from 'constants/enum/auth'
import { Authorization, useCheckAccess } from 'lib/authorization'

import { RoleCreateComponent } from '../components/RoleCreateComponent'

export const RoleCreate = () => {
	const checkAccess = useCheckAccess({
          resource: 'role',
          action: AuthActionVerb.CREATE,
          possession: AuthPossession.ANY,
        })
  return (
    <ContentLayout title="Create role">
        <div className="mt-4">
          <RoleCreateComponent />
        </div>
     </ContentLayout>
  )
}

I have error like that