Utility Functions

Configuration Utilities

The application includes utility functions for working with the base path configuration. These functions are located in src/utils/config.js.

getBasePath()

Returns the base path from the application configuration.

import { getBasePath } from '../utils/config';

// Example usage
const basePath = getBasePath(); // Returns the base path, e.g., '/Merchant-app'

getAssetPath(path)

Constructs a complete path for an asset by prepending the base path.

import { getAssetPath } from '../utils/config';

// Example usage
const logoPath = getAssetPath('/images/logo.png');
// If base path is '/Merchant-app', returns '/Merchant-app/images/logo.png'

// Works with paths with or without leading slash
const cssPath = getAssetPath('styles/main.css');
// Returns '/Merchant-app/styles/main.css'

When to Use These Functions

Use these utility functions whenever you need to reference:

Static assets (images, CSS, JavaScript)
API endpoints
Navigation links
Any URL that should be relative to the application's base path

Example in a React Component

import React from 'react';
import { getAssetPath } from '../utils/config';

function Header() {
  return (
    <header>
      <img src={getAssetPath('/logo.svg')} alt="Company Logo" />
      <nav>
        <a href={getAssetPath('/')}>Home</a>
        <a href={getAssetPath('/about')}>About</a>
        <a href={getAssetPath('/contact')}>Contact</a>
      </nav>
    </header>
  );
}

export default Header;

1.5 KiB Raw Blame History