Simplify the structure of modals

After separating the `content` directory for modals, there was a problem with cycle dependencies. Therefore, all files were moved to a higher directory. This solves the problem with dependencies. In addition, it simplifies the directory structure. However, if we find a new approach in the near future we can easily update it.

dapp/src/components/TransactionModal/content/ActionFormModal.tsx → dapp/src/components/TransactionModal/ActionFormModal.tsx

@@ -17,16 +17,12 @@ import {
 import { ACTION_FLOW_TYPES, ActionFlowType } from "#/types"
 import { TokenAmountFormValues } from "#/components/shared/TokenAmountForm/TokenAmountFormBase"
 import { logPromiseFailure } from "#/utils"
-import StakeFormModal from "../ActiveStakingStep/StakeFormModal"
-import UnstakeFormModal from "../ActiveUnstakingStep/UnstakeFormModal"
+import StakeFormModal from "./ActiveStakingStep/StakeFormModal"
+import UnstakeFormModal from "./ActiveUnstakingStep/UnstakeFormModal"
 
 const TABS = Object.values(ACTION_FLOW_TYPES)
 
-export function ActionFormModal({
-  defaultType,
-}: {
-  defaultType: ActionFlowType
-}) {
+function ActionFormModal({ defaultType }: { defaultType: ActionFlowType }) {
   const { btcAccount, ethAccount } = useWalletContext()
   const { type, setType } = useModalFlowContext()
   const { setTokenAmount } = useTransactionContext()
@@ -103,3 +99,5 @@ export function ActionFormModal({
     </>
   )
 }
+
+export default ActionFormModal

dapp/src/components/TransactionModal/ActiveStakingStep/StakingErrorModal/index.tsx

@@ -8,7 +8,7 @@ import { PROCESS_STATUSES } from "#/types"
 import { logPromiseFailure } from "#/utils"
 import ServerErrorModal from "./ServerErrorModal"
 import RetryModal from "./RetryModal"
-import { LoadingModal } from "../../content"
+import LoadingModal from "../../LoadingModal"
 
 export default function StakingErrorModal() {
   const { setStatus } = useModalFlowContext()

dapp/src/components/TransactionModal/content/ErrorModal.tsx → dapp/src/components/TransactionModal/ErrorModal.tsx

@@ -1,8 +1,8 @@
 import React from "react"
 import { ActionFlowType } from "#/types"
-import StakingErrorModal from "../ActiveStakingStep/StakingErrorModal"
+import StakingErrorModal from "./ActiveStakingStep/StakingErrorModal"
 
-export function ErrorModal({ type }: { type: ActionFlowType }) {
+export default function ErrorModal({ type }: { type: ActionFlowType }) {
   if (type === "stake") return <StakingErrorModal />
   // TODO: Handle the case of unstake action
   return null

dapp/src/components/TransactionModal/content/LoadingModal.tsx → dapp/src/components/TransactionModal/LoadingModal.tsx

@@ -3,7 +3,7 @@ import { ModalBody, ModalHeader, VStack } from "@chakra-ui/react"
 import Spinner from "#/components/shared/Spinner"
 import Skeleton from "#/components/shared/Skeleton"
 
-export function LoadingModal() {
+export default function LoadingModal() {
   return (
     <>
       <ModalHeader>Loading...</ModalHeader>

dapp/src/components/TransactionModal/content/MissingAccountModal.tsx → dapp/src/components/TransactionModal/MissingAccountModal.tsx

@@ -21,7 +21,7 @@ type MissingAccountModalProps = {
   requestAccount: (...params: RequestAccountParams) => Promise<void>
 }
 
-export function MissingAccountModal({
+export default function MissingAccountModal({
   currency,
   icon,
   requestAccount,

dapp/src/components/TransactionModal/ModalContentWrapper.tsx

@@ -9,14 +9,12 @@ import {
 import { BitcoinIcon, EthereumIcon } from "#/assets/icons"
 import { ActionFlowType, PROCESS_STATUSES } from "#/types"
 import { isSupportedBTCAddressType } from "#/utils"
-import {
-  MissingAccountModal,
-  ActionFormModal,
-  ResumeModal,
-  LoadingModal,
-  SuccessModal,
-  ErrorModal,
-} from "./content"
+import ActionFormModal from "./ActionFormModal"
+import ErrorModal from "./ErrorModal"
+import LoadingModal from "./LoadingModal"
+import MissingAccountModal from "./MissingAccountModal"
+import ResumeModal from "./ResumeModal"
+import SuccessModal from "./SuccessModal"
 
 export default function ModalContentWrapper({
   defaultType,

dapp/src/components/TransactionModal/content/ResumeModal.tsx → dapp/src/components/TransactionModal/ResumeModal.tsx

@@ -11,7 +11,7 @@ import Spinner from "#/components/shared/Spinner"
 import { PauseIcon } from "#/assets/icons"
 import { TextMd } from "#/components/shared/Typography"
 
-export function ResumeModal({
+export default function ResumeModal({
   onResume,
   onClose,
 }: {

dapp/src/components/TransactionModal/content/SuccessModal.tsx → dapp/src/components/TransactionModal/SuccessModal.tsx

@@ -23,7 +23,7 @@ type SuccessModalProps = {
   tokenAmount: TokenAmount
 }
 
-export function SuccessModal({ type, tokenAmount }: SuccessModalProps) {
+export default function SuccessModal({ type, tokenAmount }: SuccessModalProps) {
   const { onClose } = useModalFlowContext()
 
   return (