Merge branch '423-refactor-default-exports-to-named-exports-in-javasc…

…ript-modules-for-enhanced-code-clarity-and' into 'dev'

Resolve "Refactor default exports to named exports in JavaScript modules for enhanced code clarity and maintainability"

Closes #423

See merge request ergo/rosen-bridge/ui!351

.changeset/curly-bobcats-hang.md

@@ -0,0 +1,5 @@
+---
+'@rosen-bridge/rosen-app': patch
+---
+
+Refactor default exports to named exports in JavaScript modules for enhanced code clarity and maintainability

apps/rosen/app/(bridge)/BridgeForm.tsx

@@ -18,13 +18,13 @@ import {
 import { NETWORKS } from '@rosen-ui/constants';
 import { getDecimalString } from '@rosen-ui/utils';
 
-import useBridgeForm from '@/_hooks/useBridgeForm';
+import { useBridgeForm } from '@/_hooks/useBridgeForm';
 import { useMaxTransfer } from '@/_hooks/useMaxTransfer';
 import { useNetwork } from '@/_hooks/useNetwork';
-import useTokenBalance from '@/_hooks/useTokenBalance';
+import { useTokenBalance } from '@/_hooks/useTokenBalance';
 import { useTokenMap } from '@/_hooks/useTokenMap';
-import useTransactionFormData from '@/_hooks/useTransactionFormData';
-import useWallet from '@/_hooks/useWallet';
+import { useTransactionFormData } from '@/_hooks/useTransactionFormData';
+import { useWallet } from '@/_hooks/useWallet';
 import { getTokenNameAndId } from '@/_utils';
 
 import { UseAllAmount } from './UseAllAmount';

apps/rosen/app/(bridge)/BridgeTransaction.tsx

@@ -13,9 +13,9 @@ import {
 
 import { useNetwork } from '@/_hooks/useNetwork';
 import { useTokenMap } from '@/_hooks/useTokenMap';
-import useTransactionFees from '@/_hooks/useTransactionFees';
-import useTransactionFormData from '@/_hooks/useTransactionFormData';
-import useWallet from '@/_hooks/useWallet';
+import { useTransactionFees } from '@/_hooks/useTransactionFees';
+import { useTransactionFormData } from '@/_hooks/useTransactionFormData';
+import { useWallet } from '@/_hooks/useWallet';
 import { getTokenNameAndId } from '@/_utils';
 
 import { ChooseWalletModal } from './ChooseWalletModal';

apps/rosen/app/(bridge)/ConnectOrSubmitButton.tsx

@@ -18,9 +18,9 @@ import {
 import { useNetwork } from '@/_hooks/useNetwork';
 import { useTokenMap } from '@/_hooks/useTokenMap';
 import { useTransaction } from '@/_hooks/useTransaction';
-import useTransactionFees from '@/_hooks/useTransactionFees';
-import useTransactionFormData from '@/_hooks/useTransactionFormData';
-import useWallet from '@/_hooks/useWallet';
+import { useTransactionFees } from '@/_hooks/useTransactionFees';
+import { useTransactionFormData } from '@/_hooks/useTransactionFormData';
+import { useWallet } from '@/_hooks/useWallet';
 import { getTokenNameAndId } from '@/_utils';
 
 interface ConnectOrSubmitButtonProps {

apps/rosen/app/App.tsx

@@ -19,7 +19,7 @@ import { theme } from '@/_theme/theme';
 
 import { WalletContextProvider } from './_contexts/walletContext';
 import { SideBar } from './SideBar';
-import Toolbar from './Toolbar';
+import { Toolbar } from './Toolbar';
 
 const Root = styled('div')(({ theme }) => ({
   width: '100vw',
@@ -44,7 +44,7 @@ interface AppProps {
   children?: React.ReactNode;
 }
 
-const App = ({ children }: AppProps) => {
+export const App = ({ children }: AppProps) => {
   return (
     <NoSsr>
       <ThemeProvider theme={theme}>
@@ -67,5 +67,3 @@ const App = ({ children }: AppProps) => {
     </NoSsr>
   );
 };
-
-export default App;

apps/rosen/app/Toolbar.tsx

@@ -18,7 +18,7 @@ const pageTitleMap: Record<string, string> = {
 /**
  * render toolbar containing page title and some actions
  */
-const Toolbar = () => {
+export const Toolbar = () => {
   const page = useSelectedLayoutSegment();
 
   return (
@@ -28,5 +28,3 @@ const Toolbar = () => {
     />
   );
 };
-
-export default Toolbar;

apps/rosen/app/_backend/assets/repository.ts

@@ -5,9 +5,9 @@ import {
 } from '@rosen-ui/asset-calculator';
 import { Network } from '@rosen-ui/types';
 
-import NotFoundError from '@/_errors/NotFoundError';
+import { NotFoundError } from '@/_errors/NotFoundError';
 
-import dataSource from '../dataSource';
+import { dataSource } from '../dataSource';
 import '../initialize-datasource-if-needed';
 
 const bridgedAssetRepository = dataSource.getRepository(BridgedAssetEntity);

apps/rosen/app/_backend/dataSource.ts

@@ -18,7 +18,7 @@ import {
   migrations as assetCalculatorMigrations,
 } from '@rosen-ui/asset-calculator';
 
-const dataSource = new DataSource({
+export const dataSource = new DataSource({
   type: 'postgres',
   url: process.env.POSTGRES_URL,
   ssl: process.env.POSTGRES_USE_SSL === 'true',
@@ -39,5 +39,3 @@ const dataSource = new DataSource({
     ...assetCalculatorMigrations.postgres,
   ],
 });
-
-export default dataSource;

apps/rosen/app/_backend/events/repository.ts

@@ -3,7 +3,7 @@ import { BlockEntity } from '@rosen-bridge/scanner';
 import { EventTriggerEntity } from '@rosen-bridge/watcher-data-extractor';
 import { Network } from '@rosen-ui/types';
 
-import dataSource from '../dataSource';
+import { dataSource } from '../dataSource';
 import '../initialize-datasource-if-needed';
 
 const blockRepository = dataSource.getRepository(BlockEntity);

apps/rosen/app/_backend/initialize-datasource-if-needed.ts

@@ -1,4 +1,4 @@
-import dataSource from './dataSource';
+import { dataSource } from './dataSource';
 
 if (!dataSource.isInitialized) {
   await dataSource.initialize();

apps/rosen/app/_errors/NotFoundError.ts

@@ -1,3 +1 @@
-class NotFoundError extends Error {}
-
-export default NotFoundError;
+export class NotFoundError extends Error {}

apps/rosen/app/_hooks/useBridgeForm.ts

@@ -11,14 +11,14 @@ import { unwrap } from '@/_safeServerAction';
 import { getMaxTransfer, getMinTransfer } from '@/_utils';
 
 import { useTokenMap } from './useTokenMap';
-import useTransactionFormData from './useTransactionFormData';
+import { useTransactionFormData } from './useTransactionFormData';
 
 /**
  * handles the form field registrations and form state changes
  * and validations
  */
 
-const useBridgeForm = () => {
+export const useBridgeForm = () => {
   const { control, resetField, reset, setValue, formState, setFocus } =
     useTransactionFormData();
 
@@ -141,5 +141,3 @@ const useBridgeForm = () => {
     formState,
   };
 };
-
-export default useBridgeForm;

apps/rosen/app/_hooks/useMaxTransfer.ts

@@ -6,9 +6,9 @@ import { RosenAmountValue } from '@rosen-ui/types';
 import { getMaxTransfer } from '@/_utils';
 
 import { useNetwork } from './useNetwork';
-import useTokenBalance from './useTokenBalance';
-import useTransactionFormData from './useTransactionFormData';
-import useWallet from './useWallet';
+import { useTokenBalance } from './useTokenBalance';
+import { useTransactionFormData } from './useTransactionFormData';
+import { useWallet } from './useWallet';
 
 /**
  * a hook version of `getMaxTransfer` util

apps/rosen/app/_hooks/useNetwork.ts

@@ -6,7 +6,7 @@ import { Network } from '@rosen-ui/types';
 
 import { AvailableNetworks, availableNetworks } from '@/_networks';
 
-import useBridgeForm from './useBridgeForm';
+import { useBridgeForm } from './useBridgeForm';
 import { useTokenMap } from './useTokenMap';
 
 type BlackList = {

apps/rosen/app/_hooks/useTokenBalance.ts

@@ -4,8 +4,8 @@ import { TokenInfo } from '@rosen-ui/types';
 import { RosenAmountValue } from '@rosen-ui/types';
 import { Wallet } from '@rosen-ui/wallet-api';
 
-import useBridgeForm from './useBridgeForm';
-import useWallet from './useWallet';
+import { useBridgeForm } from './useBridgeForm';
+import { useWallet } from './useWallet';
 
 interface UseTokenBalance {
   isLoading: boolean;
@@ -18,7 +18,7 @@ interface UseTokenBalance {
  * returns the amount of currently selected asset
  * @returns CONTAINS A WRAPPED-VALUE
  */
-const useTokenBalance = () => {
+export const useTokenBalance = () => {
   const [balanceState, setBalanceState] = useState<UseTokenBalance>({
     isLoading: false,
     amount: 0n,
@@ -65,5 +65,3 @@ const useTokenBalance = () => {
 
   return balanceState;
 };
-
-export default useTokenBalance;

apps/rosen/app/_hooks/useTransaction.ts

@@ -7,8 +7,8 @@ import { getNonDecimalString } from '@rosen-ui/utils';
 
 import { useNetwork } from './useNetwork';
 import { useTokenMap } from './useTokenMap';
-import useTransactionFormData from './useTransactionFormData';
-import useWallet from './useWallet';
+import { useTransactionFormData } from './useTransactionFormData';
+import { useWallet } from './useWallet';
 
 /**
  * a react hook to create and sign and submit transactions

apps/rosen/app/_hooks/useTransactionFees.ts

@@ -15,7 +15,7 @@ import { useTokenMap } from './useTokenMap';
  * calculates the fees for a token swap between
  * two networks
  */
-const useTransactionFees = (
+export const useTransactionFees = (
   sourceChain: Network | null,
   targetChain: Network | null,
   token: RosenChainToken | null,
@@ -167,5 +167,3 @@ const useTransactionFees = (
 
   return transactionFees;
 };
-
-export default useTransactionFees;

apps/rosen/app/_hooks/useTransactionFormData.ts

@@ -8,7 +8,7 @@ import type { BridgeForm } from '@/(bridge)/page';
  * provide access to the bridge form context and current form values
  */
 
-const useTransactionFormData = () => {
+export const useTransactionFormData = () => {
   const { control, ...rest } = useFormContext<FieldValues, BridgeForm>();
 
   const sourceValue = useWatch({ control, name: 'source' }) as Network | null;
@@ -27,5 +27,3 @@ const useTransactionFormData = () => {
     ...rest,
   };
 };
-
-export default useTransactionFormData;

apps/rosen/app/_hooks/useWallet.ts

@@ -27,7 +27,7 @@ const toWalletDescriptor = (wallet: WalletBase): WalletDescriptor => {
  * handles the wallet connections for all the networks
  * and reconnect to the wallet on app startup
  */
-const useWallet = () => {
+export const useWallet = () => {
   const walletGlobalContext = useContext(WalletContext);
   const isConnecting = useRef<boolean>(false);
   const { get, set } = useLocalStorageManager();
@@ -127,5 +127,3 @@ const useWallet = () => {
       }
     : {};
 };
-
-export default useWallet;

apps/rosen/app/_networks/bitcoin/index.ts

@@ -27,7 +27,7 @@ const config = {
  * providing access to network info and wallets and network specific
  * functionality
  */
-const BitcoinNetwork: BitcoinNetworkType = {
+export const BitcoinNetwork: BitcoinNetworkType = {
   name: NETWORKS.BITCOIN,
   label: NETWORK_LABELS.BITCOIN,
   logo: BitcoinIcon,
@@ -37,5 +37,3 @@ const BitcoinNetwork: BitcoinNetworkType = {
   getMaxTransfer: unwrap(getMaxTransfer),
   toSafeAddress: (address) => address,
 };
-
-export default BitcoinNetwork;

apps/rosen/app/_networks/cardano/index.ts

@@ -30,7 +30,7 @@ const config = {
  * providing access to network info and wallets and network specific
  * functionality
  */
-const CardanoNetwork: CardanoNetworkType = {
+export const CardanoNetwork: CardanoNetworkType = {
   name: NETWORKS.CARDANO,
   label: NETWORK_LABELS.CARDANO,
   wallets: [
@@ -45,5 +45,3 @@ const CardanoNetwork: CardanoNetworkType = {
   getMaxTransfer: unwrap(getMaxTransfer),
   toSafeAddress: (address) => address,
 };
-
-export default CardanoNetwork;

apps/rosen/app/_networks/ergo/index.ts

@@ -19,7 +19,7 @@ const config = {
  * providing access to network info and wallets and network specific
  * functionality
  */
-const ErgoNetwork: ErgoNetworkType = {
+export const ErgoNetwork: ErgoNetworkType = {
   name: NETWORKS.ERGO,
   label: NETWORK_LABELS.ERGO,
   wallets: [nautilusWalletCreator(config)],
@@ -29,5 +29,3 @@ const ErgoNetwork: ErgoNetworkType = {
   getMaxTransfer: unwrap(getMaxTransfer),
   toSafeAddress: (address) => address,
 };
-
-export default ErgoNetwork;

apps/rosen/app/_networks/ethereum/index.ts

@@ -14,7 +14,7 @@ import { generateLockData, generateTxParameters } from './server';
  * providing access to network info and wallets and network specific
  * functionality
  */
-const EthereumNetwork: EthereumNetworkType = {
+export const EthereumNetwork: EthereumNetworkType = {
   name: NETWORKS.ETHEREUM,
   label: NETWORK_LABELS.ETHEREUM,
   wallets: [
@@ -30,5 +30,3 @@ const EthereumNetwork: EthereumNetworkType = {
   getMaxTransfer: unwrap(getMaxTransfer),
   toSafeAddress: (address) => address.toLowerCase(),
 };
-
-export default EthereumNetwork;

apps/rosen/app/_networks/index.ts

@@ -1,9 +1,9 @@
 import { NETWORKS } from '@rosen-ui/constants';
 
-import BitcoinNetwork from './bitcoin';
-import CardanoNetwork from './cardano';
-import ErgoNetwork from './ergo';
-import EthereumNetwork from './ethereum';
+import { BitcoinNetwork } from './bitcoin';
+import { CardanoNetwork } from './cardano';
+import { ErgoNetwork } from './ergo';
+import { EthereumNetwork } from './ethereum';
 
 export const availableNetworks = {
   [NETWORKS.ERGO]: ErgoNetwork,

apps/rosen/app/api/v1/assets/detail/[id]/route.ts

@@ -1,6 +1,6 @@
 import { getAsset } from '@/_backend/assets';
 
-import withValidation from '../../../withValidation';
+import { withValidation } from '../../../withValidation';
 import { validateGet } from './validations';
 
 export const GET = withValidation(validateGet, (value) => getAsset(value.id));

apps/rosen/app/api/v1/assets/route.ts

@@ -2,7 +2,7 @@ import { pick } from 'lodash-es';
 
 import { getAllAssets } from '@/_backend/assets';
 
-import withValidation from '../withValidation';
+import { withValidation } from '../withValidation';
 import { validateGet } from './validations';
 
 export const GET = withValidation(validateGet, (value) =>

apps/rosen/app/api/v1/events/route.ts

@@ -1,8 +1,8 @@
 import { getEventsWithFullTokenData } from '@/_backend/events';
 
-import withValidation from '../withValidation';
-import EventsValidations from './validations';
+import { withValidation } from '../withValidation';
+import { validateGet } from './validations';
 
-export const GET = withValidation(EventsValidations.GET, (value) =>
+export const GET = withValidation(validateGet, (value) =>
   getEventsWithFullTokenData(value.offset, value.limit),
 );

apps/rosen/app/api/v1/events/validations.ts

@@ -15,12 +15,6 @@ const getQueryParamsSchema = Joi.object<GETQueryParams>().keys({
  * validate get requests
  * @param request
  */
-const validateGet = ({ nextUrl: { searchParams } }: NextRequest) => {
+export const validateGet = ({ nextUrl: { searchParams } }: NextRequest) => {
   return getQueryParamsSchema.validate(Object.fromEntries(searchParams));
 };
-
-const EventsValidations = {
-  GET: validateGet,
-};
-
-export default EventsValidations;