the-tip-top-frontend/__tests__/utils/theme.test.ts

/**
 * Tests for the theme utility
 */

import {
  STATUS_COLORS,
  BADGE_COLORS,
  BUTTON_STYLES,
  INPUT_STYLES,
  CARD_STYLES,
  ALERT_STYLES,
  ROLE_COLORS,
  PRIZE_COLORS,
  getStatusColor,
  getButtonStyle,
  getInputStyle,
  getRoleColor,
  getPrizeColor,
} from '@/utils/theme';

describe('Theme Utility', () => {
  describe('Constants', () => {
    it('should have all status colors defined', () => {
      expect(STATUS_COLORS.PENDING).toBe('bg-secondary-100 text-secondary-800');
      expect(STATUS_COLORS.CLAIMED).toBe('bg-primary-100 text-primary-800');
      expect(STATUS_COLORS.REJECTED).toBe('bg-red-100 text-red-800');
      expect(STATUS_COLORS.ACTIVE).toBe('bg-primary-100 text-primary-800');
      expect(STATUS_COLORS.INACTIVE).toBe('bg-gray-100 text-gray-800');
      expect(STATUS_COLORS.EXPIRED).toBe('bg-red-100 text-red-800');
    });

    it('should have all badge colors defined', () => {
      expect(BADGE_COLORS.info).toBe('bg-blue-100 text-blue-800');
      expect(BADGE_COLORS.success).toBe('bg-primary-100 text-primary-800');
      expect(BADGE_COLORS.warning).toBe('bg-secondary-100 text-secondary-800');
      expect(BADGE_COLORS.error).toBe('bg-red-100 text-red-800');
      expect(BADGE_COLORS.purple).toBe('bg-purple-100 text-purple-800');
      expect(BADGE_COLORS.pink).toBe('bg-pink-100 text-pink-800');
      expect(BADGE_COLORS.amber).toBe('bg-secondary-200 text-secondary-800');
      expect(BADGE_COLORS.gray).toBe('bg-gray-100 text-gray-800');
    });

    it('should have all button styles defined', () => {
      expect(BUTTON_STYLES.primary).toContain('bg-primary-500');
      expect(BUTTON_STYLES.secondary).toContain('bg-secondary-500');
      expect(BUTTON_STYLES.success).toContain('bg-primary-500');
      expect(BUTTON_STYLES.danger).toContain('bg-red-600');
      expect(BUTTON_STYLES.warning).toContain('bg-secondary-400');
      expect(BUTTON_STYLES.outline).toContain('border-primary-500');
      expect(BUTTON_STYLES.ghost).toContain('text-gray-600');
    });

    it('should have input styles defined', () => {
      expect(INPUT_STYLES.base).toContain('w-full');
      expect(INPUT_STYLES.base).toContain('rounded-lg');
      expect(INPUT_STYLES.error).toBe('border-red-500');
      expect(INPUT_STYLES.normal).toBe('border-gray-300');
    });

    it('should have card styles defined', () => {
      expect(CARD_STYLES.base).toContain('bg-white');
      expect(CARD_STYLES.base).toContain('rounded-lg');
      expect(CARD_STYLES.hover).toContain('hover:shadow-lg');
      expect(CARD_STYLES.bordered).toContain('border-gray-200');
    });

    it('should have alert styles defined', () => {
      expect(ALERT_STYLES.info).toContain('bg-blue-50');
      expect(ALERT_STYLES.success).toContain('bg-green-50');
      expect(ALERT_STYLES.warning).toContain('bg-yellow-50');
      expect(ALERT_STYLES.error).toContain('bg-red-50');
    });

    it('should have role colors defined', () => {
      expect(ROLE_COLORS.ADMIN).toBe('bg-red-100 text-red-800');
      expect(ROLE_COLORS.EMPLOYEE).toBe('bg-blue-100 text-blue-800');
      expect(ROLE_COLORS.CLIENT).toBe('bg-primary-100 text-primary-800');
    });

    it('should have prize colors defined', () => {
      expect(PRIZE_COLORS.INFUSEUR).toBe('bg-blue-100 text-blue-800');
      expect(PRIZE_COLORS.THE_SIGNATURE).toBe('bg-primary-100 text-primary-800');
      expect(PRIZE_COLORS.COFFRET_DECOUVERTE).toBe('bg-purple-100 text-purple-800');
      expect(PRIZE_COLORS.COFFRET_PRESTIGE).toBe('bg-secondary-200 text-secondary-800');
      expect(PRIZE_COLORS.THE_GRATUIT).toBe('bg-pink-100 text-pink-800');
    });
  });

  describe('getStatusColor', () => {
    it('should return correct color for known statuses', () => {
      expect(getStatusColor('PENDING')).toBe('bg-secondary-100 text-secondary-800');
      expect(getStatusColor('CLAIMED')).toBe('bg-primary-100 text-primary-800');
      expect(getStatusColor('REJECTED')).toBe('bg-red-100 text-red-800');
    });

    it('should handle lowercase statuses', () => {
      expect(getStatusColor('pending')).toBe('bg-secondary-100 text-secondary-800');
      expect(getStatusColor('claimed')).toBe('bg-primary-100 text-primary-800');
    });

    it('should return gray for unknown statuses', () => {
      expect(getStatusColor('UNKNOWN')).toBe('bg-gray-100 text-gray-800');
      expect(getStatusColor('random')).toBe('bg-gray-100 text-gray-800');
    });
  });

  describe('getButtonStyle', () => {
    it('should return primary style by default', () => {
      expect(getButtonStyle()).toContain('bg-primary-500');
    });

    it('should return correct style for variant', () => {
      expect(getButtonStyle('primary')).toContain('bg-primary-500');
      expect(getButtonStyle('secondary')).toContain('bg-secondary-500');
      expect(getButtonStyle('success')).toContain('bg-primary-500');
      expect(getButtonStyle('danger')).toContain('bg-red-600');
      expect(getButtonStyle('warning')).toContain('bg-secondary-400');
      expect(getButtonStyle('outline')).toContain('border-primary-500');
      expect(getButtonStyle('ghost')).toContain('text-gray-600');
    });
  });

  describe('getInputStyle', () => {
    it('should return normal input style when no error', () => {
      const style = getInputStyle(false);
      expect(style).toContain('w-full');
      expect(style).toContain('border-gray-300');
      expect(style).not.toContain('border-red-500');
    });

    it('should return error input style when has error', () => {
      const style = getInputStyle(true);
      expect(style).toContain('w-full');
      expect(style).toContain('border-red-500');
      expect(style).not.toContain('border-gray-300');
    });
  });

  describe('getRoleColor', () => {
    it('should return correct color for known roles', () => {
      expect(getRoleColor('ADMIN')).toBe('bg-red-100 text-red-800');
      expect(getRoleColor('EMPLOYEE')).toBe('bg-blue-100 text-blue-800');
      expect(getRoleColor('CLIENT')).toBe('bg-primary-100 text-primary-800');
    });

    it('should handle lowercase roles', () => {
      expect(getRoleColor('admin')).toBe('bg-red-100 text-red-800');
      expect(getRoleColor('employee')).toBe('bg-blue-100 text-blue-800');
      expect(getRoleColor('client')).toBe('bg-primary-100 text-primary-800');
    });

    it('should return gray for unknown roles', () => {
      expect(getRoleColor('UNKNOWN')).toBe('bg-gray-100 text-gray-800');
    });
  });

  describe('getPrizeColor', () => {
    it('should return correct color for known prize types', () => {
      expect(getPrizeColor('INFUSEUR')).toBe('bg-blue-100 text-blue-800');
      expect(getPrizeColor('THE_SIGNATURE')).toBe('bg-primary-100 text-primary-800');
      expect(getPrizeColor('COFFRET_DECOUVERTE')).toBe('bg-purple-100 text-purple-800');
      expect(getPrizeColor('COFFRET_PRESTIGE')).toBe('bg-secondary-200 text-secondary-800');
      expect(getPrizeColor('THE_GRATUIT')).toBe('bg-pink-100 text-pink-800');
    });

    it('should handle lowercase prize types', () => {
      expect(getPrizeColor('infuseur')).toBe('bg-blue-100 text-blue-800');
    });

    it('should return gray for unknown prize types', () => {
      expect(getPrizeColor('UNKNOWN')).toBe('bg-gray-100 text-gray-800');
    });
  });
});