|
1 | 1 | import { useParams, Link } from 'react-router'
|
2 | 2 | import { Button } from '#src/components/button.tsx'
|
3 | 3 | import { Icon } from '#src/components/icon.tsx'
|
| 4 | +import data from '#src/data.json' |
4 | 5 |
|
5 |
| -type Message = { |
6 |
| - id: string |
7 |
| - text: string |
8 |
| -} & ( |
9 |
| - | { |
10 |
| - status: 'sent' |
11 |
| - sentAt: string |
12 |
| - } |
13 |
| - | { |
14 |
| - status: 'scheduled' |
15 |
| - scheduledFor: string |
16 |
| - } |
17 |
| -) |
18 |
| - |
19 |
| -type Recipient = { |
20 |
| - id: string |
21 |
| - name: string |
22 |
| - phone: string |
23 |
| - schedule: { day: string; time: string } | null |
24 |
| - messages: Array<Message> |
25 |
| -} |
26 |
| - |
27 |
| -const recipients: Array<Recipient> = [ |
28 |
| - { |
29 |
| - id: '1', |
30 |
| - name: 'Vojta', |
31 |
| - phone: '+ 420 606 754 513', |
32 |
| - schedule: { day: 'Thu', time: '10 AM GMT+2' }, |
33 |
| - messages: [ |
34 |
| - { |
35 |
| - id: '1', |
36 |
| - text: 'Thank you for being my partner in every adventure and my comfort in every storm. I love you more than you know.', |
37 |
| - sentAt: '2024-06-06T10:00:00Z', |
38 |
| - status: 'sent', |
39 |
| - }, |
40 |
| - { |
41 |
| - id: '2', |
42 |
| - text: 'You are my best friend, my confidant, and my greatest support. Thank you for being you.', |
43 |
| - sentAt: '2024-06-13T10:00:00Z', |
44 |
| - status: 'sent', |
45 |
| - }, |
46 |
| - { |
47 |
| - id: '3', |
48 |
| - text: 'Thank you for all the sacrifices you make for our family. Your hard work and dedication mean the world to me.', |
49 |
| - scheduledFor: '2024-06-20T10:00:00Z', |
50 |
| - status: 'scheduled', |
51 |
| - }, |
52 |
| - { |
53 |
| - id: '4', |
54 |
| - text: 'Thank you for being my rock and always supporting me. I am grateful for your unwavering love.', |
55 |
| - scheduledFor: '2024-06-27T10:00:00Z', |
56 |
| - status: 'scheduled', |
57 |
| - }, |
58 |
| - ], |
59 |
| - }, |
60 |
| - { |
61 |
| - id: '2', |
62 |
| - name: 'Mom', |
63 |
| - phone: '+ 420 777 131 355', |
64 |
| - schedule: { day: 'Wed', time: '10 AM GMT+2' }, |
65 |
| - messages: [ |
66 |
| - { |
67 |
| - id: '1', |
68 |
| - text: "Happy Mother's Day! Thank you for all the love, guidance, and support you've given me throughout my life.", |
69 |
| - sentAt: '2024-05-12T10:00:00Z', |
70 |
| - status: 'sent', |
71 |
| - }, |
72 |
| - { |
73 |
| - id: '2', |
74 |
| - text: "Just wanted to let you know I'm thinking of you and I love you. Your strength and wisdom inspire me every day.", |
75 |
| - scheduledFor: '2024-06-19T10:00:00Z', |
76 |
| - status: 'scheduled', |
77 |
| - }, |
78 |
| - ], |
79 |
| - }, |
80 |
| - { |
81 |
| - id: '3', |
82 |
| - name: 'Dad', |
83 |
| - phone: '+ 420 773 213 133', |
84 |
| - schedule: null, |
85 |
| - messages: [ |
86 |
| - { |
87 |
| - id: '1', |
88 |
| - text: "Happy Father's Day! Thank you for being the best role model and for always believing in me.", |
89 |
| - sentAt: '2024-06-16T10:00:00Z', |
90 |
| - status: 'sent', |
91 |
| - }, |
92 |
| - { |
93 |
| - id: '2', |
94 |
| - text: "I really appreciate all the life lessons you've taught me. You've shaped who I am today.", |
95 |
| - sentAt: '2024-06-17T10:00:00Z', |
96 |
| - status: 'sent', |
97 |
| - }, |
98 |
| - { |
99 |
| - id: '3', |
100 |
| - text: 'Looking forward to our fishing trip next month. Those moments mean the world to me.', |
101 |
| - scheduledFor: '2024-07-01T10:00:00Z', |
102 |
| - status: 'scheduled', |
103 |
| - }, |
104 |
| - ], |
105 |
| - }, |
106 |
| - { |
107 |
| - id: '4', |
108 |
| - name: 'Sarah', |
109 |
| - phone: '+ 420 608 442 789', |
110 |
| - schedule: { day: 'Mon', time: '9 AM GMT+2' }, |
111 |
| - messages: [ |
112 |
| - { |
113 |
| - id: '1', |
114 |
| - text: 'Happy birthday to my amazing sister! Wishing you all the joy and success in the world.', |
115 |
| - sentAt: '2024-05-20T09:00:00Z', |
116 |
| - status: 'sent', |
117 |
| - }, |
118 |
| - { |
119 |
| - id: '2', |
120 |
| - text: "Can't wait for our weekend getaway! It's going to be so much fun catching up.", |
121 |
| - scheduledFor: '2024-06-21T09:00:00Z', |
122 |
| - status: 'scheduled', |
123 |
| - }, |
124 |
| - ], |
125 |
| - }, |
126 |
| - { |
127 |
| - id: '5', |
128 |
| - name: 'Grandma Eva', |
129 |
| - phone: '+ 420 776 554 321', |
130 |
| - schedule: { day: 'Sun', time: '11 AM GMT+2' }, |
131 |
| - messages: [ |
132 |
| - { |
133 |
| - id: '1', |
134 |
| - text: "Thank you for all your wonderful stories and the delicious recipes you've shared with me. They keep our family traditions alive.", |
135 |
| - sentAt: '2024-06-02T11:00:00Z', |
136 |
| - status: 'sent', |
137 |
| - }, |
138 |
| - { |
139 |
| - id: '2', |
140 |
| - text: 'Looking forward to Sunday lunch together. Your cooking always makes everything better.', |
141 |
| - scheduledFor: '2024-06-23T11:00:00Z', |
142 |
| - status: 'scheduled', |
143 |
| - }, |
144 |
| - ], |
145 |
| - }, |
146 |
| -] |
| 6 | +const recipients = data.recipients |
147 | 7 |
|
148 | 8 | export function RecipientRoute() {
|
149 | 9 | const { id } = useParams()
|
@@ -236,27 +96,34 @@ export function RecipientRoute() {
|
236 | 96 | <Icon name="Check">
|
237 | 97 | <span className="text-sm opacity-80 md:text-base">
|
238 | 98 | Sent on{' '}
|
239 |
| - {new Date(message.sentAt).toLocaleDateString('en-US', { |
240 |
| - weekday: 'short', |
241 |
| - month: 'short', |
242 |
| - day: 'numeric', |
243 |
| - year: 'numeric', |
244 |
| - })} |
| 99 | + {message.sentAt |
| 100 | + ? new Date(message.sentAt).toLocaleDateString( |
| 101 | + 'en-US', |
| 102 | + { |
| 103 | + weekday: 'short', |
| 104 | + month: 'short', |
| 105 | + day: 'numeric', |
| 106 | + year: 'numeric', |
| 107 | + }, |
| 108 | + ) |
| 109 | + : 'Unknown date'} |
245 | 110 | </span>
|
246 | 111 | </Icon>
|
247 | 112 | ) : (
|
248 | 113 | <Icon name="Clock">
|
249 | 114 | <span className="text-sm opacity-80 md:text-base">
|
250 | 115 | Scheduled for{' '}
|
251 |
| - {new Date(message.scheduledFor).toLocaleDateString( |
252 |
| - 'en-US', |
253 |
| - { |
254 |
| - weekday: 'short', |
255 |
| - month: 'short', |
256 |
| - day: 'numeric', |
257 |
| - year: 'numeric', |
258 |
| - }, |
259 |
| - )} |
| 116 | + {message.scheduledFor |
| 117 | + ? new Date(message.scheduledFor).toLocaleDateString( |
| 118 | + 'en-US', |
| 119 | + { |
| 120 | + weekday: 'short', |
| 121 | + month: 'short', |
| 122 | + day: 'numeric', |
| 123 | + year: 'numeric', |
| 124 | + }, |
| 125 | + ) |
| 126 | + : 'Unknown date'} |
260 | 127 | </span>
|
261 | 128 | </Icon>
|
262 | 129 | )}
|
|
0 commit comments