abc-constants

Constants and configuration package for the ABC system. This package provides centralized constants, API endpoints, routing configurations, and type definitions used across the entire application ecosystem.

📦 Installation

pnpm add abc-constants

🚀 Key Features

1. API Configuration

• Centralized API endpoints and URLs
• Environment-specific configurations
• SEO API endpoints for different apps
• Base URLs for development and production

2. Routing Constants

• Application routing paths
• Dynamic slug generation
• Parent app routing logic
• Test and study route configurations

3. Type Definitions

• Game mode types and status
• Application state configurations
• Color palettes and styling constants
• Validation patterns and regex

4. SEO & Tracking

• SEO configuration constants
• Tracking endpoints and keys
• Canonical URL management
• Contact and attribute configurations

📚 API Reference

Router Constants

RouterApp

Application routing paths and configurations.

import { RouterApp } from "abc-constants/router";

// Basic routes
RouterApp.Home; // "/"
RouterApp.About; // "/about" or "/about-us" (parent dependent)
RouterApp.Contacts; // "/contact"

// Test routes
RouterApp.Diagnostic_test; // "/diagnostic-test"
RouterApp.Custom_test; // "/custom-test"
RouterApp.Final_test; // Dynamic final test path
RouterApp.Practice_Tests; // "/practice-test"

// Dynamic slug generation
RouterApp.Dynamic_slug({
  appName: "asvab",
  slug: "math-practice",
  state: "california",
}); // "/asvab/california/math-practice"

API_PATH

API endpoint configurations.

import { API_PATH } from "abc-constants/router";

API_PATH.APP_INFO; // "/api/appInfos"
API_PATH.GET_SEO; // "/api/getSeo"
API_PATH.TRACKING_PROGRESS; // "api/tracking/question-progress"

Type Constants

GameTypeStatus

Game mode status constants.

import { GameTypeStatus } from "abc-constants/type";

GameTypeStatus.learn; // 0
GameTypeStatus.practiceTests; // 1
GameTypeStatus.finalTests; // 9
GameTypeStatus.diagnosticTest; // 10

RANDOM_COLORS

Color palette for UI components.

import { RANDOM_COLORS } from "abc-constants/type";

// Array of 27 predefined colors
RANDOM_COLORS[0]; // "#30749F"
RANDOM_COLORS[1]; // "#E68A4F"
// ... and more

EMAIL_REGEX

Email validation pattern.

import { EMAIL_REGEX } from "abc-constants/type";

const isValidEmail = EMAIL_REGEX.test("[email protected]");

API Configuration

getBaseSeo(props)

Generate SEO API endpoints based on app configuration.

import { getBaseSeo } from "abc-constants/api";

const seoUrl = getBaseSeo({
  slug: "california",
  app: "asvab",
  state: "ca",
});

App-specific SEO APIs

import { API_SEO_ASVAB, API_SEO_CDL } from "abc-constants/api";

const asvabSeoUrl = API_SEO_ASVAB("california");
const cdlSeoUrl = API_SEO_CDL("texas");

Environment Constants

Base URLs

import { BASE_URL, BASE_URL_PROP, BASE_URL_DEV } from "abc-constants/type";

BASE_URL; // Development API
BASE_URL_PROP; // Production API
BASE_URL_DEV; // Dev environment API

PayPal Configuration

import {
  PAYPAL_CLIENT_ID,
  PAYPAL_CURRENCY,
  PAYPAL_SUBSCRIPTION_CLIENT_ID,
} from "abc-constants/type";

// Environment-specific PayPal configurations

🔧 Usage Examples

Complete Routing Example

import { RouterApp, API_PATH } from "abc-constants";

function AppRouter() {
  const appName = "asvab";
  const state = "california";

  const routes = {
    home: RouterApp.Home,
    about: RouterApp.About,
    diagnostic: RouterApp.Diagnostic_test,
    practice: RouterApp.Practice_Tests,
    final: RouterApp.Final_test,
    dynamic: RouterApp.Dynamic_slug({
      appName,
      slug: "math-practice",
      state,
    }),
  };

  return routes;
}

Game Mode Configuration

import { GameTypeStatus } from "abc-constants/type";

function getGameModeStatus(mode: string) {
  switch (mode) {
    case "learn":
      return GameTypeStatus.learn;
    case "practice":
      return GameTypeStatus.practiceTests;
    case "final":
      return GameTypeStatus.finalTests;
    case "diagnostic":
      return GameTypeStatus.diagnosticTest;
    default:
      return GameTypeStatus.learn;
  }
}

SEO Configuration

import { getBaseSeo } from "abc-constants/api";

function getSeoData(slug: string, state?: string) {
  const seoUrl = getBaseSeo({
    slug,
    state,
    app: process.env.NEXT_PUBLIC_APP_SHORT_NAME,
  });

  return fetch(seoUrl).then((res) => res.json());
}

Color Management

import { RANDOM_COLORS } from "abc-constants/type";

function getRandomColor(index: number) {
  return RANDOM_COLORS[index % RANDOM_COLORS.length];
}

function getColorPalette(count: number) {
  return RANDOM_COLORS.slice(0, count);
}

📋 Type Definitions

// Router types
interface DynamicSlugProps {
  appName?: string;
  slug: string;
  state?: string;
}

// Game mode types
type IGameMode =
  | "finalTests"
  | "practiceTests"
  | "diagnosticTest"
  | "customTests"
  | "learn"
  | "branchTest"
  | "review";

// SEO API types
interface SeoProps {
  slug?: string;
  app?: string;
  state?: string;
}

🔧 Development

# Build package
pnpm build

# Development mode with watch
pnpm dev

# Type checking
pnpm check-types

# Lint
pnpm lint

# Clean dist
pnpm clean

📦 Dependencies

Production Dependencies

• abc-model - Data models and types

Development Dependencies

• @testing-library/jest-dom - Jest DOM matchers
• @testing-library/react - React testing utilities
• @types/jest - Jest types
• @types/node - Node.js types
• @repo/eslint-config - ESLint configuration
• tsup - TypeScript bundler
• typescript - TypeScript compiler

📁 Module Structure

src/
├── api/          # API endpoints and configurations
├── attribute/    # Attribute constants
├── branch/       # Branch-specific constants
├── canonical/    # Canonical URL configurations
├── contact/      # Contact information constants
├── images/       # Image-related constants
├── list/         # List configurations
├── router/       # Routing constants and paths
├── seo/          # SEO configurations
├── tracking/     # Tracking and analytics constants
└── type/         # Type definitions and game modes

🔄 Environment Variables

The package uses several environment variables:

• NEXT_PUBLIC_APP_SHORT_NAME - Current app name
• NODE_ENV - Environment (development/production)
• Various PayPal and API configurations

📄 License

ISC