@umituz/react-native-design-system 4.23.97 → 4.23.101

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (77) hide show
  1. package/package.json +1 -1
  2. package/src/atoms/AtomicInput.tsx +0 -2
  3. package/src/atoms/button/AtomicButton.tsx +7 -0
  4. package/src/atoms/button/types/index.ts +4 -0
  5. package/src/atoms/input/hooks/useInputState.ts +3 -7
  6. package/src/haptics/infrastructure/services/HapticService.ts +1 -1
  7. package/src/media/domain/entities/{MultimediaFlashcardTypes.ts → MediaAttachments.ts} +13 -32
  8. package/src/media/index.ts +24 -23
  9. package/src/media/{presentation/hooks/useCardMediaGeneration.ts → infrastructure/hooks/useGenericMediaGeneration.ts} +77 -31
  10. package/src/media/infrastructure/services/MediaGenerationService.ts +1 -1
  11. package/src/media/infrastructure/services/MediaOptimizerService.ts +1 -1
  12. package/src/media/infrastructure/services/MediaUploadService.ts +1 -1
  13. package/src/media/infrastructure/services/MediaValidationService.ts +1 -1
  14. package/src/media/infrastructure/services/MultimediaFlashcardService.ts +1 -1
  15. package/src/media/infrastructure/utils/PermissionManager.ts +1 -1
  16. package/src/media/infrastructure/utils/media-collection-utils.ts +4 -2
  17. package/src/media/infrastructure/utils/mediaPickerMappers.ts +1 -1
  18. package/src/media/presentation/hooks/multimedia.types.ts +1 -1
  19. package/src/media/presentation/hooks/useCardMultimediaFlashcard.ts +4 -4
  20. package/src/media/presentation/hooks/useMedia.ts +2 -2
  21. package/src/media/presentation/hooks/useMediaGeneration.ts +5 -88
  22. package/src/media/presentation/hooks/useMediaUpload.ts +1 -1
  23. package/src/media/presentation/hooks/useMediaValidation.ts +1 -1
  24. package/src/media/presentation/hooks/useMultimediaFlashcard.ts +1 -1
  25. package/src/molecules/navigation/components/NavigationHeader.tsx +3 -3
  26. package/src/molecules/navigation/utils/AppNavigation.ts +3 -3
  27. package/src/offline/index.ts +1 -0
  28. package/src/offline/infrastructure/storage/OfflineConfigStore.ts +34 -0
  29. package/src/offline/presentation/hooks/useOffline.ts +8 -4
  30. package/src/storage/domain/utils/devUtils.ts +0 -24
  31. package/src/storage/index.ts +1 -1
  32. package/src/storage/infrastructure/adapters/StorageService.ts +5 -10
  33. package/src/storage/infrastructure/repositories/BaseStorageOperations.ts +5 -8
  34. package/src/storage/presentation/hooks/CacheStorageOperations.ts +5 -11
  35. package/src/storage/presentation/hooks/useStore.ts +13 -5
  36. package/src/utilities/sharing/presentation/hooks/useSharing.ts +3 -3
  37. package/src/layouts/ScreenLayout/ScreenLayout.example.tsx +0 -92
  38. package/src/media/domain/entities/CardMultimedia.types.README.md +0 -129
  39. package/src/media/domain/entities/CardMultimedia.types.ts +0 -120
  40. package/src/media/domain/entities/Media.README.md +0 -80
  41. package/src/media/domain/entities/MultimediaFlashcardTypes.README.md +0 -144
  42. package/src/media/domain/utils/MediaUtils.README.md +0 -178
  43. package/src/media/index.ts.README.md +0 -191
  44. package/src/media/infrastructure/services/CardMediaGenerationService.README.md +0 -99
  45. package/src/media/infrastructure/services/CardMediaGenerationService.ts +0 -101
  46. package/src/media/infrastructure/services/CardMediaOptimizerService.README.md +0 -167
  47. package/src/media/infrastructure/services/CardMediaOptimizerService.ts +0 -36
  48. package/src/media/infrastructure/services/CardMediaUploadService.README.md +0 -123
  49. package/src/media/infrastructure/services/CardMediaUploadService.ts +0 -62
  50. package/src/media/infrastructure/services/CardMediaValidationService.README.md +0 -134
  51. package/src/media/infrastructure/services/CardMediaValidationService.ts +0 -81
  52. package/src/media/infrastructure/services/CardMultimediaService.README.md +0 -176
  53. package/src/media/infrastructure/services/CardMultimediaService.ts +0 -98
  54. package/src/media/infrastructure/services/MediaGenerationService.README.md +0 -142
  55. package/src/media/infrastructure/services/MediaOptimizerService.README.md +0 -145
  56. package/src/media/infrastructure/services/MediaPickerService.README.md +0 -106
  57. package/src/media/infrastructure/services/MediaSaveService.README.md +0 -120
  58. package/src/media/infrastructure/services/MediaUploadService.README.md +0 -135
  59. package/src/media/infrastructure/services/MediaValidationService.README.md +0 -135
  60. package/src/media/infrastructure/services/MultimediaFlashcardService.README.md +0 -142
  61. package/src/media/infrastructure/utils/mediaHelpers.README.md +0 -96
  62. package/src/media/infrastructure/utils/mediaPickerMappers.README.md +0 -129
  63. package/src/media/presentation/hooks/card-multimedia.types.README.md +0 -177
  64. package/src/media/presentation/hooks/card-multimedia.types.ts +0 -53
  65. package/src/media/presentation/hooks/multimedia.types.README.md +0 -201
  66. package/src/media/presentation/hooks/useCardMediaGeneration.README.md +0 -164
  67. package/src/media/presentation/hooks/useCardMediaUpload.README.md +0 -153
  68. package/src/media/presentation/hooks/useCardMediaUpload.ts +0 -84
  69. package/src/media/presentation/hooks/useCardMediaValidation.README.md +0 -176
  70. package/src/media/presentation/hooks/useCardMediaValidation.ts +0 -101
  71. package/src/media/presentation/hooks/useCardMultimediaFlashcard.README.md +0 -158
  72. package/src/media/presentation/hooks/useMedia.README.md +0 -94
  73. package/src/media/presentation/hooks/useMediaGeneration.README.md +0 -118
  74. package/src/media/presentation/hooks/useMediaUpload.README.md +0 -108
  75. package/src/media/presentation/hooks/useMediaValidation.README.md +0 -134
  76. package/src/media/presentation/hooks/useMultimediaFlashcard.README.md +0 -141
  77. package/src/storage/domain/utils/__tests__/devUtils.test.ts +0 -97
@@ -1,53 +0,0 @@
1
- /**
2
- * Card Multimedia Flashcard Hook Types
3
- * Type definitions for card multimedia hooks
4
- */
5
-
6
- import type {
7
- CardMediaAttachment,
8
- CardMediaFile,
9
- CardMediaGenerationRequest,
10
- CardMediaGenerationResult,
11
- CardMediaCompressionOptions,
12
- CardMediaValidation,
13
- CardMediaUploadProgress,
14
- CardMultimediaFlashcard,
15
- CreateCardMultimediaData,
16
- } from "../../domain/entities/CardMultimedia.types";
17
-
18
- export interface UseCardMediaUploadResult {
19
- uploadMedia: (
20
- file: CardMediaFile,
21
- options?: CardMediaCompressionOptions,
22
- ) => Promise<CardMediaAttachment>;
23
- isUploading: boolean;
24
- uploadProgress: CardMediaUploadProgress | null;
25
- error: string | null;
26
- }
27
-
28
- export interface UseCardMediaGenerationResult {
29
- generateMedia: (
30
- request: CardMediaGenerationRequest,
31
- ) => Promise<CardMediaGenerationResult>;
32
- isGenerating: boolean;
33
- generationResult: CardMediaGenerationResult | null;
34
- error: string | null;
35
- }
36
-
37
- export interface UseCardMediaValidationResult {
38
- validateMedia: (file: CardMediaFile) => Promise<CardMediaValidation>;
39
- isValidating: boolean;
40
- validation: CardMediaValidation | null;
41
- error: string | null;
42
- }
43
-
44
- export interface UseCardMultimediaFlashcardResult {
45
- createCardMultimedia: (cardData: CreateCardMultimediaData) => Promise<CardMultimediaFlashcard>;
46
- updateCardMedia: (
47
- cardId: string,
48
- media: CardMediaAttachment[],
49
- ) => Promise<CardMultimediaFlashcard>;
50
- deleteCardMedia: (attachmentId: string) => Promise<void>;
51
- isProcessing: boolean;
52
- error: string | null;
53
- }
@@ -1,201 +0,0 @@
1
- # Multimedia Hook Types
2
-
3
- ## Purpose
4
- TypeScript return type interfaces for general multimedia hooks in the presentation layer.
5
-
6
- ## File Location
7
- `src/presentation/hooks/multimedia.types.ts`
8
-
9
- ## Strategy
10
- - Define contracts for general multimedia hook implementations
11
- - Ensure type safety across media operations
12
- - Provide consistent return types for upload, generation, and validation
13
- - Support general-purpose media operations
14
- - Enable proper error handling and loading states
15
- - Maintain separation from card-specific multimedia types
16
-
17
- ## Forbidden
18
- - **DO NOT** import implementation details or hooks in type files
19
- - **DO NOT** mix MediaAttachment and CardMediaAttachment types
20
- - **DO NOT** add business logic to type definitions
21
- - **DO NOT** use `any` type for function parameters or returns
22
- - **DO NOT** create circular dependencies with domain types
23
- - **DO NOT** export implementation-specific types
24
- - **DO NOT** modify these types without updating all hook implementations
25
-
26
- ## Rules
27
- 1. All hook returns must include loading state, error state, and operation function
28
- 2. Async operations must return Promise with appropriate type
29
- 3. Error states must be string | null (not Error objects)
30
- 4. Progress/results must be null when not active
31
- 5. Boolean states must clearly indicate operation in progress
32
- 6. All interfaces must be exported and public
33
- 7. Type names must follow Use*Result pattern
34
- 8. Functions must accept domain types, not external types
35
- 9. Optional parameters must be clearly marked
36
- 10. Return types must match hook implementations exactly
37
-
38
- ## AI Agent Guidelines
39
-
40
- When working with multimedia hook types:
41
-
42
- 1. **Type Imports**: Always import types from this file for general multimedia hooks
43
- 2. **Hook Implementation**: Implement hooks that return these exact interfaces
44
- 3. **General vs Card**: Use Media* types for general operations, Card* for card-specific
45
- 4. **Error Handling**: Always check error state before using results
46
- 5. **Loading States**: Respect loading states to prevent race conditions
47
- 6. **Progress Tracking**: Use progress objects for upload operations
48
- 7. **Type Safety**: Use these types for all general multimedia hook return values
49
- 8. **Testing**: Mock these interfaces when testing media operations
50
-
51
- ### Hook Return Type Structure
52
-
53
- All multimedia hook returns follow this consistent pattern:
54
-
55
- **Core Components**:
56
- - **operationFunction**: An async function that accepts parameters and returns a Promise with the result type
57
- - **isOperationInProgress**: A boolean flag indicating whether the operation is currently running
58
- - **operationResult**: The result object or null when no operation is active
59
- - **error**: A string containing error messages or null when no error exists
60
-
61
- ### UseMediaUploadResult
62
-
63
- **Purpose**: General media upload operations with compression options
64
-
65
- **Key Features**:
66
- - Upload function accepts file and compression options
67
- - Tracks upload progress
68
- - Returns MediaAttachment
69
- - Handles upload errors
70
-
71
- **Usage Pattern**:
72
- 1. Check `isUploading` before calling
73
- 2. Call `uploadMedia()` with file and optional compression
74
- 3. Monitor `uploadProgress` during upload
75
- 4. Check `error` state on completion
76
- 5. Use returned MediaAttachment on success
77
-
78
- ### UseMediaGenerationResult
79
-
80
- **Purpose**: General media generation (AI-based generation without image search)
81
-
82
- **Key Features**:
83
- - Generation function accepts request parameters
84
- - Tracks generation status
85
- - Returns MediaGenerationResult
86
- - Supports core generation methods
87
-
88
- **Usage Pattern**:
89
- 1. Prepare MediaGenerationRequest
90
- 2. Check `isGenerating` before calling
91
- 3. Call `generateMedia()` with request
92
- 4. Access `generationResult` when complete
93
- 5. Handle `error` if generation fails
94
-
95
- ### UseMediaValidationResult
96
-
97
- **Purpose**: General media validation before upload or processing
98
-
99
- **Key Features**:
100
- - Validation function accepts file
101
- - Tracks validation status
102
- - Returns MediaValidation result
103
- - Provides detailed validation errors
104
-
105
- **Usage Pattern**:
106
- 1. Check `isValidating` before calling
107
- 2. Call `validateMedia()` with file
108
- 3. Access `validation` result for validity check
109
- 4. Use `validation.errors` array for error details
110
- 5. Check `error` state for validation failures
111
-
112
- ### UseMultimediaFlashcardResult
113
-
114
- **Purpose**: General flashcard CRUD operations
115
-
116
- **Key Features**:
117
- - Create flashcard with multimedia
118
- - Update flashcard media
119
- - Delete specific media attachment
120
- - Tracks processing state
121
- - Returns MultimediaFlashcard
122
-
123
- **Usage Pattern**:
124
- 1. Create: Call `createMultimediaCard()` with card data
125
- 2. Update: Call `updateMedia()` with cardId and media array
126
- 3. Delete: Call `deleteMedia()` with attachmentId
127
- 4. Check `isProcessing` before operations
128
- 5. Handle `error` state for failures
129
-
130
- ### General vs Card Multimedia Types
131
-
132
- | Operation | General Types | Card Types | Key Difference |
133
- |-----------|--------------|------------|----------------|
134
- | Upload | MediaAttachment | CardMediaAttachment | Different entity structures |
135
- | Generation | MediaGenerationRequest | CardMediaGenerationRequest | Cards include image search |
136
- | Validation | MediaValidation | CardMediaValidation | Different validation rules |
137
- | Flashcard | MultimediaFlashcard | CardMultimediaFlashcard | Different entity types |
138
- | Features | Core operations | Core + image search | Card has extended features |
139
-
140
- ### When to Use Which Types
141
-
142
- **Use Media* Types (General)**:
143
- - Generic media handling
144
- - Non-card-specific operations
145
- - Reusable media components
146
- - General-purpose flashcards
147
-
148
- **Use Card* Types (Card-Specific)**:
149
- - Card-specific operations
150
- - Image search functionality
151
- - Card entity management
152
- - Card-specific validation rules
153
-
154
- ### Type Guards and Validation
155
-
156
- 1. **Upload Hook**: Check for `uploadMedia` function and `isUploading` boolean
157
- 2. **Generation Hook**: Check for `generateMedia` function and `isGenerating` boolean
158
- 3. **Validation Hook**: Check for `validateMedia` function and `isValidating` boolean
159
- 4. **Flashcard Hook**: Check for all three CRUD functions and `isProcessing` boolean
160
-
161
- ### Error Handling Patterns
162
-
163
- 1. Always check if `error !== null` before using results
164
- 2. Errors are strings, not Error objects
165
- 3. Clear error before starting new operation
166
- 4. Show user-friendly error messages
167
- 5. Handle null states for progress/results
168
-
169
- ### Async Operation Patterns
170
-
171
- 1. **Before Call**: Check loading state to prevent concurrent calls
172
- 2. **During Call**: Show loading indicator based on boolean state
173
- 3. **After Call**: Check error state, then use result
174
- 4. **Error Case**: Display error, reset loading state
175
- 5. **Success Case**: Use result, clear error
176
-
177
- ### Composable Hooks Pattern
178
-
179
- Combine multiple hook types for complex workflows:
180
-
181
- 1. **Validate Then Upload**: Use validation result before calling upload
182
- 2. **Generate Then Upload**: Chain generation and upload operations
183
- 3. **Upload Then Create Card**: Use upload result to create flashcard
184
- 4. **Parallel Operations**: Use multiple hooks independently
185
-
186
- ### Related Domain Types
187
-
188
- These interfaces use domain types:
189
- - MediaAttachment
190
- - MediaGenerationRequest
191
- - MediaGenerationResult
192
- - MediaCompressionOptions
193
- - MediaValidation
194
- - MediaUploadProgress
195
- - MultimediaFlashcard
196
-
197
- ## Dependencies
198
-
199
- - Domain layer types (Media* entities)
200
- - Presentation layer hooks
201
- - No external dependencies
@@ -1,164 +0,0 @@
1
- # useCardMediaGeneration
2
-
3
- ## Purpose
4
- Card-specific React hook for AI-powered media generation (text-to-image, text-to-audio, image-search) for flashcards.
5
-
6
- ## File Location
7
- `src/presentation/hooks/useCardMediaGeneration.ts`
8
-
9
- ## Strategy
10
- - Provide card-specific interface for AI media generation
11
- - Support text-to-image, text-to-audio, and image-search operations
12
- - Return CardMediaAttachment with position property
13
- - Track generation status and metadata
14
- - Manage credit costs for card media generation
15
- - Handle generation errors with proper feedback
16
- - Support card-specific generation options
17
-
18
- ## Forbidden
19
- - **DO NOT** start generation while previous is in progress
20
- - **DO NOT** ignore credit costs before generation
21
- - **DO NOT** mock generation in production without AI API
22
- - **DO NOT** assume generation will succeed - check result.success
23
- - **DO NOT** expose API keys or AI implementation details
24
- - **DO NOT** allow unlimited concurrent generations
25
- - **DO NOT** bypass timeout handling for long generations
26
- - **DO NOT** store large results permanently in hook state
27
- - **DO NOT** use empty or invalid prompts
28
- - **DO NOT** mix with MediaAttachment (must use CardMediaAttachment)
29
-
30
- ## Rules
31
- 1. Always validate prompt text before generation
32
- 2. Check credit availability before operations
33
- 3. Track processing time for each request
34
- 4. Return CardMediaAttachment with position property
35
- 5. Return unique requestId for tracking
36
- 6. Include creditsUsed in result metadata
37
- 7. Support maxResults for multiple outputs
38
- 8. Clear generation state on new operations
39
- 9. Handle both success and failure gracefully
40
- 10. Support language, voice, speed options for audio
41
-
42
- ## AI Agent Guidelines
43
-
44
- When working with useCardMediaGeneration hook:
45
-
46
- 1. **Type Specificity**: Use CardMediaAttachment (not MediaAttachment)
47
- 2. **Position Awareness**: Generated media has position property
48
- 3. **Prompt Quality**: Use descriptive prompts for better results
49
- 4. **Credit Tracking**: Monitor credit costs and balance
50
- 5. **Error Handling**: Always check result.success field
51
-
52
- ### Generation Types
53
-
54
- **Text-to-Image** (type: 'text_to_image')
55
- - Generates images from text descriptions
56
- - Credit cost: 5 per generation
57
- - Default maxResults: 1
58
- - Returns CardMediaAttachment with position: 'both'
59
- - Supports style customization
60
-
61
- **Text-to-Audio** (type: 'text_to_audio')
62
- - Generates audio from text (TTS)
63
- - Credit cost: 3 per generation
64
- - Default duration: 10 seconds
65
- - Returns CardMediaAttachment with position: 'back'
66
- - Supports voice, language, speed options
67
-
68
- **Image Search** (type: 'image_search')
69
- - Searches for existing images
70
- - Credit cost: 2 per search
71
- - Default maxResults: 5
72
- - Returns CardMediaAttachment with position: 'both'
73
- - Finds relevant images from database
74
-
75
- ### Generation Workflow
76
-
77
- 1. Validate prompt text quality
78
- 2. Check credit balance
79
- 3. Select generation type
80
- 4. Configure options (maxResults, voice, language, etc.)
81
- 5. Call generateMedia with request
82
- 6. Monitor isGenerating state
83
- 7. Process CardMediaGenerationResult
84
- 8. Handle success or error
85
-
86
- ### Result Structure
87
-
88
- CardMediaGenerationResult includes:
89
- - success: Boolean success/failure
90
- - attachments: Array of CardMediaAttachment (with position)
91
- - creditsUsed: Credits consumed
92
- - processingTime: Duration in milliseconds
93
- - requestId: Unique identifier
94
- - error: Error message if failed
95
-
96
- ### CardMediaAttachment Features
97
-
98
- Generated attachments include:
99
- - id: Unique ID with card_media_ prefix
100
- - type: CardMediaType (IMAGE, VIDEO, AUDIO)
101
- - position: CardMediaPosition (front, back, or both)
102
- - url: Generated media URL
103
- - filename: Generated filename
104
- - fileSize: Size in bytes
105
- - mimeType: MIME type
106
- - duration: Audio/video duration
107
- - thumbnailUrl: Thumbnail for visual media
108
- - isDownloaded: Download status
109
- - createdAt: ISO timestamp
110
-
111
- ### Generation Options
112
-
113
- **Image Options:**
114
- - maxResults: Number of images (default: 1)
115
- - style: Image style preset
116
-
117
- **Audio Options:**
118
- - voice: Voice type (male/female)
119
- - language: Language code ('tr-TR', 'en-US')
120
- - speed: Playback speed (default: 1.0)
121
-
122
- **Image Search Options:**
123
- - maxResults: Number of results (default: 5)
124
-
125
- ### Integration with Card Creation
126
-
127
- Typical workflow:
128
- 1. Generate media with useCardMediaGeneration
129
- 2. Receive CardMediaAttachment objects
130
- 3. Use in createCardMultimedia call
131
- 4. Position is automatically assigned by generation type
132
- 5. Complete card with generated media
133
-
134
- ### Credit Costs
135
-
136
- | Operation | Credits |
137
- |-----------|---------|
138
- | Text-to-Image | 5 |
139
- | Text-to-Audio | 3 |
140
- | Image Search | 2 |
141
-
142
- ### Error Scenarios
143
-
144
- - Insufficient credits: Check balance before generation
145
- - Invalid prompt: Validate text quality
146
- - API timeout: Implement retry logic
147
- - Content policy: Filter prompts appropriately
148
- - Service unavailable: Graceful error handling
149
-
150
- ### Integration Requirements
151
-
152
- - Configure AI service endpoints
153
- - Implement authentication for AI APIs
154
- - Handle rate limiting and quotas
155
- - Implement retry logic for failures
156
- - Cache results when appropriate
157
- - Monitor credit usage
158
-
159
- ## Dependencies
160
-
161
- - CardMediaGenerationService (infrastructure layer)
162
- - Domain types: CardMediaGenerationRequest, CardMediaGenerationResult, CardMediaAttachment
163
- - Credit tracking system
164
- - AI service APIs (text-to-image, TTS, image search)
@@ -1,153 +0,0 @@
1
- # useCardMediaUpload
2
-
3
- ## Purpose
4
- Card-specific React hook for uploading flashcard media files to server with progress tracking and compression support.
5
-
6
- ## File Location
7
- `src/presentation/hooks/useCardMediaUpload.ts`
8
-
9
- ## Strategy
10
- - Provide card-specific media upload interface
11
- - Support compression options for optimization
12
- - Track upload progress with percentage and status
13
- - Return CardMediaAttachment with position property
14
- - Handle upload errors gracefully
15
- - Generate thumbnails for visual media
16
- - Support various media types for cards
17
-
18
- ## Forbidden
19
- - **DO NOT** start upload while previous is in progress
20
- - **DO NOT** ignore compression options
21
- - **DO NOT** upload without validation (use useCardMediaValidation)
22
- - **DO NOT** mock upload in production without backend integration
23
- - **DO NOT** modify file during upload (compress before)
24
- - **DO NOT** assume upload will succeed
25
- - **DO NOT** use hardcoded API endpoints
26
- - **DO NOT** bypass progress tracking
27
- - **DO NOT** store upload results permanently in state
28
- - **DO NOT** use incorrect ID prefixes (must use card_media_)
29
-
30
- ## Rules
31
- 1. Always validate before uploading (use useCardMediaValidation)
32
- 2. Compression quality must be in 0-1 range
33
- 3. Dimensions must be in pixels
34
- 4. Progress updates every 10% or on status change
35
- 5. Clear upload state on error or completion
36
- 6. Return CardMediaAttachment with position property
37
- 7. Generate thumbnail URL automatically
38
- 8. Calculate duration for audio/video
39
- 9. Update progress status: uploading -> completed/error
40
- 10. Include unique fileId in progress tracking
41
-
42
- ## AI Agent Guidelines
43
-
44
- When working with useCardMediaUpload hook:
45
-
46
- 1. **Type Correctness**: Returns CardMediaAttachment (not MediaAttachment)
47
- 2. **Position Property**: Uploaded media includes position field
48
- 3. **Pre-upload Validation**: Always use useCardMediaValidation first
49
- 4. **Progress Tracking**: Monitor uploadProgress for real-time updates
50
- 5. **Compression**: Apply appropriate compression settings
51
-
52
- ### Upload Workflow
53
-
54
- 1. Validate file with useCardMediaValidation
55
- 2. Select compression options based on type and size
56
- 3. Call uploadMedia with file and options
57
- 4. Monitor uploadProgress state
58
- 5. Handle completion (success or error)
59
- 6. Process returned CardMediaAttachment
60
-
61
- ### CardMediaAttachment Structure
62
-
63
- Returned object includes:
64
- - id: Unique ID with card_media_ prefix
65
- - type: CardMediaType (IMAGE, VIDEO, AUDIO)
66
- - position: CardMediaPosition (defaults to 'both')
67
- - url: Uploaded file URL
68
- - filename: Original filename
69
- - fileSize: Size in bytes
70
- - mimeType: MIME type string
71
- - duration: Audio/video duration
72
- - thumbnailUrl: Thumbnail for visual media
73
- - caption: Optional caption text
74
- - isDownloaded: Download status
75
- - createdAt: ISO timestamp
76
-
77
- ### Compression Guidelines
78
-
79
- **High Quality** (quality: 0.9, maxWidth: 4096)
80
- - Use for detailed card images
81
- - Larger file size, best quality
82
-
83
- **Medium Quality** (quality: 0.7, maxWidth: 1920) - RECOMMENDED
84
- - Balanced quality and size
85
- - Good for most card media
86
-
87
- **Low Quality** (quality: 0.5, maxWidth: 1280)
88
- - Use for card thumbnails
89
- - Smallest size, reduced quality
90
-
91
- ### Upload Progress States
92
-
93
- - **uploading**: Upload in progress (0-99%)
94
- - **completed**: Upload finished successfully (100%)
95
- - **error**: Upload failed with error message
96
-
97
- ### CardMediaUploadProgress
98
-
99
- Progress object includes:
100
- - fileId: Unique file identifier
101
- - progress: Percentage (0-100)
102
- - status: Current state (uploading/completed/error)
103
- - url: Final URL when completed
104
-
105
- ### Integration with Card Creation
106
-
107
- Typical workflow:
108
- 1. Select or generate media
109
- 2. Validate with useCardMediaValidation
110
- 3. Upload with useCardMediaUpload
111
- 4. Receive CardMediaAttachment with position
112
- 5. Add to card media array
113
- 6. Create card with useCardMultimediaFlashcard
114
-
115
- ### Position Assignment
116
-
117
- Uploaded media gets position property:
118
- - Default: 'both' (shown on both sides)
119
- - Can be overridden: 'front' or 'back'
120
- - Used to control media display on card sides
121
-
122
- ### Multiple File Upload
123
-
124
- For multiple media files:
125
- 1. Upload files sequentially or in parallel
126
- 2. Collect CardMediaAttachment objects
127
- 3. Assign positions appropriately
128
- 4. Add to card media array
129
- 5. Track individual upload progress
130
-
131
- ### Integration Requirements
132
-
133
- - Configure API endpoint for card media upload
134
- - Implement authentication for uploads
135
- - Handle file size limits
136
- - Support retry logic for failures
137
- - Generate thumbnails automatically
138
- - Calculate media duration for audio/video
139
-
140
- ### Error Handling
141
-
142
- Common error scenarios:
143
- - File too large: Validate before upload
144
- - Unsupported type: Check MIME type
145
- - Network timeout: Implement retry with backoff
146
- - Server error: Display user-friendly message
147
- - Authentication failure: Check token validity
148
-
149
- ## Dependencies
150
-
151
- - CardMediaUploadService (infrastructure layer)
152
- - Domain types: CardMediaAttachment, CardMediaCompressionOptions, CardMediaUploadProgress
153
- - useCardMediaValidation (for pre-upload validation)
@@ -1,84 +0,0 @@
1
- /**
2
- * Card Media Upload Hook
3
- * Hook for uploading card media files
4
- */
5
-
6
- import { useState, useCallback } from "react";
7
- import { generateThumbnail, getMediaDuration } from "../../infrastructure/utils/file-media-utils";
8
- import { getMediaTypeFromMime } from "../../infrastructure/utils/mime-type-detector";
9
- import type { UseCardMediaUploadResult } from "./card-multimedia.types";
10
- import type {
11
- CardMediaAttachment,
12
- CardMediaCompressionOptions,
13
- CardMediaFile,
14
- CardMediaUploadProgress,
15
- } from "../../domain/entities/CardMultimedia.types";
16
-
17
- export const useCardMediaUpload = (): UseCardMediaUploadResult => {
18
- const [isUploading, setIsUploading] = useState(false);
19
- const [uploadProgress, setUploadProgress] =
20
- useState<CardMediaUploadProgress | null>(null);
21
- const [error, setError] = useState<string | null>(null);
22
-
23
- const uploadMedia = useCallback(
24
- async (file: CardMediaFile, _options?: CardMediaCompressionOptions) => {
25
- try {
26
- setIsUploading(true);
27
- setError(null);
28
-
29
- // Simulate upload progress
30
- setUploadProgress({
31
- fileId: `upload_${Date.now()}`,
32
- progress: 0,
33
- status: "uploading",
34
- });
35
-
36
- // Simulate progress updates
37
- for (let i = 1; i <= 100; i += 10) {
38
- await new Promise((resolve) => setTimeout(resolve, 50));
39
- setUploadProgress((prev) => (prev ? { ...prev, progress: i } : null));
40
- }
41
-
42
- const attachment: CardMediaAttachment = {
43
- id: `card_media_${Date.now()}`,
44
- type: getMediaTypeFromMime(file.type),
45
- position: "both",
46
- url: `https://storage.example.com/media/${Date.now()}_${file.name}`,
47
- filename: file.name,
48
- fileSize: file.size || 100000,
49
- mimeType: file.type,
50
- duration: await getMediaDuration(file),
51
- thumbnailUrl: generateThumbnail(file),
52
- caption: "",
53
- isDownloaded: true,
54
- createdAt: new Date().toISOString(),
55
- };
56
-
57
- setUploadProgress({
58
- fileId: `upload_${Date.now()}`,
59
- progress: 100,
60
- status: "completed",
61
- url: attachment.url,
62
- });
63
-
64
- return attachment;
65
- } catch (err) {
66
- const errorMessage =
67
- err instanceof Error ? err.message : "Upload failed";
68
- setError(errorMessage);
69
- setIsUploading(false);
70
- throw err;
71
- } finally {
72
- setIsUploading(false);
73
- }
74
- },
75
- [],
76
- );
77
-
78
- return {
79
- uploadMedia,
80
- isUploading,
81
- uploadProgress,
82
- error,
83
- };
84
- };