Add documentation

frontend/src/utils/material.ts

@@ -0,0 +1,25 @@
+/**
+ * @fileoverview MDUI component imports and configuration
+ * @description Imports all required MDUI components and sets up the theme
+ * @author Cursor
+ * @version 1.0.0
+ */
+
+import 'mdui/components/tabs';
+import 'mdui/components/tab';
+import 'mdui/components/tab-panel';
+import 'mdui/components/list';
+import 'mdui/components/list-item';
+import 'mdui/components/bottom-app-bar';
+import 'mdui/components/button-icon';
+import 'mdui/components/fab';
+import 'mdui/components/dialog';
+import 'mdui/components/button';
+import 'mdui/components/text-field';
+import 'mdui/components/button-icon';
+import 'mdui/components/top-app-bar';
+import 'mdui/components/top-app-bar-title';
+
+import { setColorScheme } from 'mdui/functions/setColorScheme.js';
+
+setColorScheme("#91cef4");

frontend/src/utils/notification.ts

@@ -0,0 +1,69 @@
+/**
+ * @fileoverview User notification system
+ * @description Provides toast-style notifications for user feedback
+ * @author Cursor
+ * @version 1.0.0
+ */
+
+/**
+ * Notification type enumeration
+ * @typedef {'success' | 'error'} NotificationType
+ */
+export type NotificationType = 'success' | 'error';
+
+/**
+ * Shows a notification with the specified message and type
+ * @param {string} message - The message to display
+ * @param {NotificationType} type - The type of notification (success or error)
+ * @function showNotification
+ * @private
+ */
+function showNotification(message: string, type: NotificationType): void {
+    const notification = document.createElement('div');
+    notification.textContent = message;
+    notification.style.cssText = `
+        position: fixed;
+        top: 20px;
+        right: 20px;
+        padding: 12px 16px;
+        border-radius: 4px;
+        color: white;
+        background: ${type === 'success' ? '#4caf50' : '#f44336'};
+        z-index: 10000;
+        font-family: inherit;
+        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
+        transition: opacity 0.3s ease;
+    `;
+    
+    document.body.appendChild(notification);
+    
+    // Fade out and remove
+    setTimeout(() => {
+        notification.style.opacity = '0';
+        setTimeout(() => {
+            notification.remove();
+        }, 300);
+    }, 3000);
+}
+
+/**
+ * Shows a success notification
+ * @param {string} message - The success message to display
+ * @function showSuccess
+ * @example
+ * showSuccess('Profile updated successfully!');
+ */
+export function showSuccess(message: string): void {
+    showNotification(message, 'success');
+}
+
+/**
+ * Shows an error notification
+ * @param {string} message - The error message to display
+ * @function showError
+ * @example
+ * showError('Failed to update profile');
+ */
+export function showError(message: string): void {
+    showNotification(message, 'error');
+}

frontend/src/utils/utils.ts

@@ -0,0 +1,33 @@
+/**
+ * @fileoverview Utility functions used throughout the application
+ * @description Contains helper functions for common operations
+ * @author Cursor
+ * @version 1.0.0
+ */
+
+/**
+ * Formats a timestamp string to HH:MM format
+ * @param {string} dateString - ISO timestamp string to format
+ * @returns {string} Formatted time string in HH:MM format
+ * @example
+ * formatTime('2024-01-15T14:30:00Z'); // Returns "14:30"
+ */
+export function formatTime(dateString: string): string {
+    const date = new Date(dateString);
+    let hours = date.getHours();
+    let minutes = date.getMinutes();
+    const hoursString = hours < 10 ? '0' + hours : hours;
+    const minutesString = minutes < 10 ? '0' + minutes : minutes;
+    return hoursString + ':' + minutesString;
+}
+
+/**
+ * Creates a promise that resolves after a specified delay
+ * @param {number} ms - Delay time in milliseconds
+ * @returns {Promise<void>} Promise that resolves after the delay
+ * @example
+ * await delay(1000); // Wait for 1 second
+ */
+export function delay(ms: number): Promise<void> {
+    return new Promise(resolve => setTimeout(resolve, ms));
+}