import { BrowserRouter, Route, Routes } from "react-router-dom"
import Dashboard from "./components/dashboard/Dashboard"
import Home from "./components/home/Home"
import Login from "./components/login/Login";
import Register from "./components/register/Register";

import { ToastContainer } from 'react-toastify';
import ProcessStepTwo from "./components/process/processStepTwo/ProcessStepTwo";
import ProcessStepOne from "./components/process/processStepOne/ProcessStepOne";

import DocView from "./components/view/DocView";
import SignDocument from "./components/client/SignDocument";

import Transactions from "./components/transactions/Transactions";
import ProtectedRoute from "./components/routes_helper/ProtectedRoute";

import Setting from "./components/setting/Setting";
import Accounts from "./components/accounts/Accounts";
import Account from "./components/accounts/Account";
import TransactionView from "./components/transactions/TransactionView";
import Templates from "./components/templates/Templates";
import DocumentCompletionScreen from "./components/process/CompletionScreen/DocumentCompletionScreen";

const App = () => {
  return (
    <BrowserRouter>
      {/* <HashRouter> */}
      <ToastContainer />

      <Routes>

        <Route element={
          <ProtectedRoute>
            <Dashboard />
          </ProtectedRoute>
        }>
          <Route path="/" element={<Home />} />
          {/* <Route path="/s/settings" element={<Setting />} /> */}
          {/* <Route element={<AccountTransactionWrapper />}> */}
            <Route path="/accounts" element={<Accounts />} />
            <Route path="/accounts/:accountId/transactions" element={<Account />} />
            <Route path="/transactions" element={<Account />} />
            <Route path="/accounts/:accountId/transactions/:transactionId" element={<TransactionView />} />
            <Route path="/transactions/:filterParam" element={<Transactions />} />
            <Route path="/templates" element={<Templates />} />
          {/* </Route> */}

          <Route path="/s/:page1" element={<Setting />} />
        </Route>

        <Route path="/process-step-one/:accountId/:transactionId" element={
          <ProtectedRoute>
            <ProcessStepOne />
          </ProtectedRoute>
        } />

        <Route path="/process-step-one/:accountId/:transactionId/:signType" element={
          <ProtectedRoute>
            <ProcessStepOne />
          </ProtectedRoute>
        } />

        <Route path="/process-step-one/:accountId/template/:templateId" element={
          <ProtectedRoute>
            <ProcessStepOne />
          </ProtectedRoute>
        } />

        <Route path="/process-step-two/:accountId/template/:templateId" element={
          <ProtectedRoute>
            <ProcessStepTwo />
          </ProtectedRoute>
        } />

        <Route path="/process-step-two/:accountId/:transactionId" element={
          <ProtectedRoute>
            <ProcessStepTwo />
          </ProtectedRoute>
        } />

        <Route path="/document-completion-screen/:accountId/:transactionId" element={
          <ProtectedRoute>
            <DocumentCompletionScreen />
          </ProtectedRoute>
        } />

        {/* Links work wothout Login */}
        <Route path="/login" element={<Login />} />
        <Route path="/register" element={<Register />} />
        <Route path="/sign/:recipientId" element={<SignDocument />} />
        <Route path="/view" element={<DocView />} />

        {/* Links work wothout Login */}
      </Routes>

      {/* </HashRouter> */}
    </BrowserRouter>
  )
}

export default App