@striae-org/striae 3.0.4

package/app/utils/device-detection.ts

@@ -0,0 +1,5 @@
+const mobileOrTabletUserAgentPattern = /mobile|android|iphone|ipad|ipod|blackberry|iemobile|opera mini|tablet|silk|kindle|playbook|webos|windows phone/i;
+
+export const isMobileOrTabletUserAgent = (userAgent: string): boolean => {
+	return mobileOrTabletUserAgentPattern.test(userAgent);
+};

package/app/utils/html-sanitizer.ts

@@ -0,0 +1,80 @@
+/**
+ * HTML Sanitization Utility
+ * 
+ * Provides secure HTML escaping for user-generated content
+ * embedded in email templates and other HTML contexts.
+ * 
+ * @module html-sanitizer
+ */
+
+/**
+ * Escapes HTML special characters to prevent injection attacks
+ * 
+ * Converts characters that have special meaning in HTML into their
+ * HTML entity equivalents to ensure they are rendered as text rather
+ * than interpreted as markup.
+ * 
+ * @param text - Raw user input that may contain HTML characters
+ * @returns Safely escaped string suitable for embedding in HTML
+ * 
+ * @example
+ * ```typescript
+ * escapeHtml('<script>alert("xss")</script>')
+ * // Returns: '&lt;script&gt;alert(&quot;xss&quot;)&lt;/script&gt;'
+ * 
+ * escapeHtml('John & Jane <test@example.com>')
+ * // Returns: 'John &amp; Jane &lt;test@example.com&gt;'
+ * ```
+ */
+export function escapeHtml(text: string | null | undefined): string {
+  if (!text) return '';
+  
+  return String(text)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#x27;')
+    .replace(/\//g, '&#x2F;');
+}
+
+/**
+ * Escapes multiple string values for safe HTML embedding
+ * 
+ * Convenience function for escaping an object of string values.
+ * Useful when preparing multiple user inputs for email templates.
+ * 
+ * @param values - Object containing string values to escape
+ * @returns New object with all string values HTML-escaped
+ * 
+ * @example
+ * ```typescript
+ * const userInput = {
+ *   name: '<script>alert("xss")</script>',
+ *   email: 'test@example.com',
+ *   company: 'ACME & Co.'
+ * };
+ * 
+ * const safe = escapeHtmlObject(userInput);
+ * // Returns: {
+ * //   name: '&lt;script&gt;alert(&quot;xss&quot;)&lt;/script&gt;',
+ * //   email: 'test@example.com',
+ * //   company: 'ACME &amp; Co.'
+ * // }
+ * ```
+ */
+export function escapeHtmlObject<T extends Record<string, any>>(
+  values: T
+): T {
+  const escaped = {} as T;
+  
+  for (const [key, value] of Object.entries(values)) {
+    if (typeof value === 'string') {
+      escaped[key as keyof T] = escapeHtml(value) as T[keyof T];
+    } else {
+      escaped[key as keyof T] = value;
+    }
+  }
+  
+  return escaped;
+}

package/app/utils/id-generator.ts

@@ -0,0 +1,36 @@
+/**
+ * Utility functions for generating unique identifiers
+ */
+
+/**
+ * Generate a unique alphanumeric ID
+ * @param length - Length of the ID (default: 10)
+ * @returns Unique alphanumeric string
+ */
+export function generateUniqueId(length: number = 10): string {
+  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
+  let result = '';
+  for (let i = 0; i < length; i++) {
+    result += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return result;
+}
+
+/**
+ * Generate a confirmation ID with specific format
+ * @returns Confirmation ID in format: CONF-XXXXXXXXXX
+ */
+export function generateConfirmationId(): string {
+  return `CONF-${generateUniqueId(10)}`;
+}
+
+/**
+ * Generate a workflow ID for audit trails
+ * @param caseNumber - Case number to include in workflow ID
+ * @returns Workflow ID in format: caseNumber-timestamp-random
+ */
+export function generateWorkflowId(caseNumber: string): string {
+  const timestamp = Date.now().toString(36);
+  const random = generateUniqueId(8);
+  return `${caseNumber}-${timestamp}-${random}`;
+}

package/app/utils/meta.ts

@@ -0,0 +1,48 @@
+import config from '~/config/meta-config.json';
+
+interface AppConfig {
+  name: string;
+  author: string;
+  title: string;
+  url: string;  
+}
+
+const { name, author, url } = config as AppConfig;
+const defaultOgImage = `${url}/social-image.png`;
+
+
+interface MetaParams {
+  title: string;
+  description: string;
+  prefix?: string;
+  ogImage?: string;
+}
+
+export function baseMeta({
+  title: pageTitle,
+  description,  
+  ogImage = defaultOgImage,
+}: MetaParams) {
+  const titleText = `${name} | ${pageTitle}`;
+
+  return [
+    { title: titleText },
+    { name: 'description', content: description },
+    { name: 'author', content: author },
+    { property: 'og:image', content: ogImage },
+    { property: 'og:image:alt', content: 'Banner for the site' },
+    { property: 'og:image:width', content: '1020' },
+    { property: 'og:image:height', content: '484' },
+    { property: 'og:title', content: titleText },
+    { property: 'og:site_name', content: name },
+    { property: 'og:type', content: 'website' },
+    { property: 'og:url', content: url },
+    { property: 'og:description', content: description },    
+    { property: 'twitter:card', content: 'summary_large_image' },
+    { property: 'twitter:description', content: description },
+    { property: 'twitter:title', content: titleText },
+    { property: 'twitter:site', content: url },
+    { property: 'twitter:creator', content: author },
+    { property: 'twitter:image', content: ogImage },
+  ];
+}

package/app/utils/mfa-phone.ts

@@ -0,0 +1,97 @@
+import type { MultiFactorInfo } from 'firebase/auth';
+import { getValidationError } from '~/services/firebase-errors';
+
+export interface PhoneValidationResult {
+  isValid: boolean;
+  errorMessage?: string;
+}
+
+export const formatPhoneNumberForMfa = (phone: string): string => {
+  const trimmedPhone = phone.trim();
+  if (trimmedPhone.startsWith('+')) {
+    return `+${trimmedPhone.slice(1).replace(/\D/g, '')}`;
+  }
+
+  const digitsOnly = trimmedPhone.replace(/\D/g, '');
+  if (digitsOnly.startsWith('1') && digitsOnly.length === 11) {
+    return `+${digitsOnly}`;
+  }
+
+  return `+1${digitsOnly}`;
+};
+
+export const maskPhoneNumber = (phone: string): string => {
+  const digits = phone.replace(/\D/g, '');
+  if (digits.length < 4) {
+    return '***-***-****';
+  }
+
+  return `***-***-${digits.slice(-4)}`;
+};
+
+export const getPhoneDisplayValue = (factor: MultiFactorInfo): string => {
+  const displayName = factor.displayName ?? '';
+  if (displayName.toLowerCase().startsWith('phone:')) {
+    return displayName.slice('phone:'.length).trim();
+  }
+
+  return displayName;
+};
+
+export const getMaskedFactorDisplay = (factor: MultiFactorInfo | null): string => {
+  if (!factor) {
+    return 'your enrolled phone';
+  }
+
+  const phoneDisplayValue = getPhoneDisplayValue(factor);
+  if (!phoneDisplayValue) {
+    return 'your enrolled phone';
+  }
+
+  return maskPhoneNumber(phoneDisplayValue);
+};
+
+export const validatePhoneNumber = (phone: string): PhoneValidationResult => {
+  if (!phone.trim()) {
+    return { isValid: false, errorMessage: getValidationError('MFA_INVALID_PHONE') };
+  }
+
+  const cleanPhone = phone.replace(/\D/g, '');
+  if (cleanPhone === '15551234567' || cleanPhone === '5551234567') {
+    return {
+      isValid: false,
+      errorMessage: 'Please enter your actual phone number, not the demo number.',
+    };
+  }
+
+  if (cleanPhone.length < 7 || cleanPhone.length > 15) {
+    return { isValid: false, errorMessage: 'Phone number must be between 7-15 digits.' };
+  }
+
+  if (phone.startsWith('+1') || (!phone.startsWith('+') && cleanPhone.length === 10)) {
+    const usPhone = cleanPhone.startsWith('1') ? cleanPhone.slice(1) : cleanPhone;
+    if (usPhone.length !== 10) {
+      return { isValid: false, errorMessage: 'US/Canada phone numbers must be 10 digits.' };
+    }
+
+    if (usPhone[0] === '0' || usPhone[0] === '1') {
+      return {
+        isValid: false,
+        errorMessage: 'Invalid area code. Area codes cannot start with 0 or 1.',
+      };
+    }
+
+    if (usPhone[3] === '0' || usPhone[3] === '1') {
+      return { isValid: false, errorMessage: 'Invalid phone number format.' };
+    }
+  }
+
+  if (phone.startsWith('+') && cleanPhone.length < 8) {
+    return {
+      isValid: false,
+      errorMessage: 'International phone numbers must have at least 8 digits including country code.',
+    };
+  }
+
+  return { isValid: true };
+};

package/app/utils/mfa.ts

@@ -0,0 +1,79 @@
+// MFA Configuration Helper
+// This file contains utilities and documentation for managing MFA in your Firebase project
+
+import { multiFactor, User } from 'firebase/auth';
+
+/**
+ * Check if a user has MFA enrolled
+ * @param user - Firebase User object
+ * @returns boolean indicating if user has any MFA factors enrolled
+ */
+export const userHasMFA = (user: User): boolean => {
+  return multiFactor(user).enrolledFactors.length > 0;
+};
+
+/**
+ * Get the number of MFA factors enrolled for a user
+ * @param user - Firebase User object
+ * @returns number of enrolled MFA factors
+ */
+export const getMFAFactorCount = (user: User): number => {
+  return multiFactor(user).enrolledFactors.length;
+};
+
+/**
+ * Get MFA factor information for a user
+ * @param user - Firebase User object
+ * @returns array of MFA factor information
+ */
+export const getMFAFactors = (user: User) => {
+  return multiFactor(user).enrolledFactors.map(factor => ({
+    uid: factor.uid,
+    factorId: factor.factorId,
+    displayName: factor.displayName,
+    enrollmentTime: factor.enrollmentTime
+  }));
+};
+
+/*
+FIREBASE CONSOLE CONFIGURATION STEPS:
+
+1. **Enable Multi-Factor Authentication in Firebase Console:**
+   - Go to Firebase Console → Authentication → Sign-in method
+   - Scroll down to "Multi-factor authentication"
+   - Click "Enable" next to SMS
+   - Configure your SMS settings
+
+2. **Enable reCAPTCHA for Phone Auth:**
+   - In the same section, make sure reCAPTCHA is enabled
+   - Add your domain to the authorized domains list
+
+3. **Configure Test Phone Numbers (Optional):**
+   - Go to Authentication → Sign-in method → Phone
+   - Add test phone numbers if needed for development
+
+4. **Set MFA Enforcement (Optional):**
+   - You can set MFA as required for all users in Firebase Console
+   - Or use the approach in this app where we enforce it programmatically
+
+5. **Monitor MFA Usage:**
+   - Go to Authentication → Users to see which users have MFA enabled
+   - Look for the "Multi-factor" column in the user list
+
+TESTING MFA:
+
+1. Create a new user account through registration
+2. After email verification and login, the MFA enrollment modal will appear
+3. Enter a valid phone number (use your real phone for testing)
+4. Complete the SMS verification process
+5. Try logging out and back in - you'll now need both password and SMS code
+
+PRODUCTION CONSIDERATIONS:
+
+- Ensure you have proper SMS quotas set up in Firebase
+- Consider implementing backup codes for users who lose phone access
+- Monitor SMS costs and usage
+- Test the flow thoroughly with real phone numbers
+- Consider implementing MFA recovery mechanisms
+
+*/

package/app/utils/password-policy.ts

@@ -0,0 +1,28 @@
+export interface PasswordPolicyResult {
+  hasMinLength: boolean;
+  hasUpperCase: boolean;
+  hasNumber: boolean;
+  hasSpecialChar: boolean;
+  passwordsMatch: boolean;
+  isStrong: boolean;
+}
+
+const MIN_PASSWORD_LENGTH = 10;
+const SPECIAL_CHAR_REGEX = /[!@#$%^&*(),.?":{}|<>]/;
+
+export const evaluatePasswordPolicy = (password: string, confirmPassword?: string): PasswordPolicyResult => {
+  const hasMinLength = password.length >= MIN_PASSWORD_LENGTH;
+  const hasUpperCase = /[A-Z]/.test(password);
+  const hasNumber = /[0-9]/.test(password);
+  const hasSpecialChar = SPECIAL_CHAR_REGEX.test(password);
+  const passwordsMatch = confirmPassword === undefined ? true : password === confirmPassword;
+
+  return {
+    hasMinLength,
+    hasUpperCase,
+    hasNumber,
+    hasSpecialChar,
+    passwordsMatch,
+    isStrong: hasMinLength && hasUpperCase && hasNumber && hasSpecialChar && passwordsMatch,
+  };
+};