Skip to main content
Constants and configuration values used throughout the SSEGH Security Cameras application.

​
ITEMS_NAV_TOP

Top-level navigation items displayed in the main menu. 
const ITEMS_NAV_TOP = ["Productos", "Nosotros", "Contacto"]
Type: string[] Values:
  • "Productos" - Products page
  • "Nosotros" - About us page
  • "Contacto" - Contact page

​
Camera Field Constants

​
FIELDS_CARD

Standard fields displayed on camera product cards. 
const FIELDS_CARD = ["diseño", "resolucion", "conectividad", "marca", "tipo_de_camara"]
Type: string[] Fields:
  • "diseño" - Camera design/form factor
  • "resolucion" - Video resolution
  • "conectividad" - Connectivity type
  • "marca" - Brand name
  • "tipo_de_camara" - Camera type/category

​
Data Service Configuration

​
API Endpoint

The application fetches camera data from a remote JSON endpoint: 
const API_URL = "https://eduardo24cba.github.io/dataSsegh/camaras.json"

​
Data Limit

Camera data is limited to the first 100 items to optimize performance: 
const DATA_LIMIT = 100

​
String Utilities

Utility functions for string manipulation and URL generation.

​
normalizeString

Remove accents and diacritical marks from a string. 
normalizeString(string)
​
string
string
required
String to normalize
​
return
string
Normalized string without accents
Usage: 
normalizeString("diseño"); // Returns: "diseno"
normalizeString("resolución"); // Returns: "resolucion"

​
hasWhiteSpace

Check if a string contains whitespace characters. 
hasWhiteSpace(s)
​
s
string
required
String to check
​
return
boolean
True if the string contains whitespace, false otherwise
Usage: 
hasWhiteSpace("dome camera"); // Returns: true
hasWhiteSpace("bullet"); // Returns: false

​
createSlug

Convert a string to URL-friendly slug format by replacing spaces with underscores. 
createSlug(s)
​
s
string
required
String to convert to slug
​
return
string
Slug with underscores instead of spaces
Usage: 
createSlug("dome camera"); // Returns: "dome_camera"
createSlug("4K resolution"); // Returns: "4K_resolution"

​
deleteSlug

Convert a slug back to a readable string by replacing underscores with spaces. 
deleteSlug(s)
​
s
string
required
Slug to convert back to string
​
return
string
String with spaces instead of underscores
Usage: 
deleteSlug("dome_camera"); // Returns: "dome camera"
deleteSlug("4K_resolution"); // Returns: "4K resolution"

​
capitalize

Capitalize the first letter of a string. 
capitalize(string)
​
string
string
required
String to capitalize
​
return
string
String with first letter capitalized
Usage: 
capitalize("bullet"); // Returns: "Bullet"
capitalize("dome camera"); // Returns: "Dome camera"

​
Filter URL Utilities

Functions for creating and managing filter URLs in the application routing system.

​
urlFiltro

Generate a filter URL based on the current location and filter string. 
urlFiltro(cadena, location)
​
cadena
string
required
Filter string to convert to URL
​
location
object
required
React Router location object with pathname
​
return
string
URL-friendly filter string, with multiple filters joined by ’+’
Usage: 
// From /productos page
urlFiltro("Dome Camera", location); // Returns: "dome_camera"

// From /productos/hikvision page
urlFiltro("4K", location); // Returns: "hikvision+4k"

​
filterArray

Convert a filter URL string into an array of readable filter values. 
filterArray(filter)
​
filter
string
required
Filter URL string with filters joined by ’+’
​
return
array
Array of filter strings with slugs removed
Usage: 
filterArray("hikvision+dome_camera+4k");
// Returns: ["hikvision", "dome camera", "4k"]

​
createUrlFilter

Create a new filter URL by removing a specific filter from an existing filter string. 
createUrlFilter(filter, filtro)
​
filter
string
required
Current filter URL string
​
filtro
string
required
Filter value to remove
​
return
string
New filter URL with the specified filter removed
Usage: 
createUrlFilter("hikvision+dome_camera+4k", "dome camera");
// Returns: "hikvision+4k"
Use this function to create “remove filter” buttons in your UI.

​
React Router Aliases

The application uses aliased React Router components for easier access: 
const Routes = ReactRouterDOM.Routes
const Route = ReactRouterDOM.Route
const BrowserRouter = ReactRouterDOM.BrowserRouter
const Link = ReactRouterDOM.Link
const Navigate = ReactRouterDOM.Navigate
const HashRouter = ReactRouterDOM.HashRouter
const useLocation = ReactRouterDOM.useLocation
const useNavigate = ReactRouterDOM.useNavigate
const useParams = ReactRouterDOM.useParams

Build docs developers (and LLMs) love

Get started for freeTalk to us