@portosaur/theme 0.1.4 → 0.2.0

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 (31) hide show
  1. package/package.json +10 -3
  2. package/src/plugins/theme.mjs +2 -0
  3. package/theme/DocCategoryGeneratedIndexPage/index.jsx +4 -10
  4. package/theme/MDXComponents.jsx +1 -1
  5. package/theme/Root.jsx +1 -1
  6. package/theme/components/AboutSection/index.jsx +89 -249
  7. package/theme/components/ContactSection/index.jsx +72 -153
  8. package/theme/components/ExperienceSection/index.jsx +35 -106
  9. package/theme/components/HeroSection/index.jsx +64 -186
  10. package/theme/components/NavArrow/index.jsx +38 -55
  11. package/theme/components/NoteIndex/index.jsx +50 -116
  12. package/theme/components/Preview/components/FeedbackStates.jsx +45 -190
  13. package/theme/components/Preview/components/FileTabs.jsx +17 -24
  14. package/theme/components/Preview/components/PreviewContent.jsx +37 -62
  15. package/theme/components/Preview/components/PreviewHeader.jsx +146 -380
  16. package/theme/components/Preview/components/Triggers/Pv.jsx +50 -78
  17. package/theme/components/Preview/components/Triggers/SrcPv.jsx +16 -47
  18. package/theme/components/Preview/components/Triggers/index.jsx +2 -2
  19. package/theme/components/Preview/components/ViewerWindow.jsx +160 -268
  20. package/theme/components/Preview/index.jsx +3 -3
  21. package/theme/components/Preview/renderers/CodeRenderer.jsx +81 -109
  22. package/theme/components/Preview/renderers/ImageRenderer.jsx +30 -67
  23. package/theme/components/Preview/renderers/PdfRenderer.jsx +31 -52
  24. package/theme/components/Preview/renderers/WebRenderer.jsx +18 -32
  25. package/theme/components/Preview/state/index.jsx +46 -30
  26. package/theme/components/ProjectsSection/index.jsx +278 -573
  27. package/theme/components/SocialLinks/index.jsx +43 -55
  28. package/theme/components/Tooltip/index.jsx +28 -39
  29. package/theme/pages/index.jsx +23 -87
  30. package/theme/pages/notes.jsx +26 -104
  31. package/theme/pages/tasks.jsx +220 -903
package/theme/pages/tasks.jsx CHANGED
@@ -14,70 +14,32 @@ import {
14
14
  FaTasks,
15
15
  FaExclamationTriangle,
16
16
  } from "react-icons/fa";
17
+
18
+ // --- TaskList ---
19
+
17
20
  function TaskList({ filterStatus, taskList }) {
18
21
  if (!taskList || !Array.isArray(taskList)) {
19
- return jsxDEV_7x81h0kn(
20
- "div",
21
- {
22
- className: "task-empty-state",
23
- children: [
24
- jsxDEV_7x81h0kn(
25
- FaTasks,
26
- { className: "task-empty-icon" },
27
- undefined,
28
- false,
29
- undefined,
30
- this,
31
- ),
32
- jsxDEV_7x81h0kn(
33
- "p",
34
- { children: "No tasks available" },
35
- undefined,
36
- false,
37
- undefined,
38
- this,
39
- ),
40
- ],
41
- },
42
- undefined,
43
- true,
44
- undefined,
45
- this,
22
+ return (
23
+ <div className="task-empty-state">
24
+ <FaTasks className="task-empty-icon" />
25
+ <p>No tasks available</p>
26
+ </div>
46
27
  );
47
28
  }
29
+
48
30
  const filteredTasks = taskList.filter((task) =>
49
31
  filterStatus ? task.status === filterStatus : true,
50
32
  );
33
+
51
34
  if (filteredTasks.length === 0) {
52
- return jsxDEV_7x81h0kn(
53
- "div",
54
- {
55
- className: "task-empty-state",
56
- children: [
57
- jsxDEV_7x81h0kn(
58
- FaTasks,
59
- { className: "task-empty-icon" },
60
- undefined,
61
- false,
62
- undefined,
63
- this,
64
- ),
65
- jsxDEV_7x81h0kn(
66
- "p",
67
- { children: "No tasks in this category" },
68
- undefined,
69
- false,
70
- undefined,
71
- this,
72
- ),
73
- ],
74
- },
75
- undefined,
76
- true,
77
- undefined,
78
- this,
35
+ return (
36
+ <div className="task-empty-state">
37
+ <FaTasks className="task-empty-icon" />
38
+ <p>No tasks in this category</p>
39
+ </div>
79
40
  );
80
41
  }
42
+
81
43
  const sortedTasks = [...filteredTasks].sort((a, b) => {
82
44
  const statusOrder = { active: 1, pending: 2, completed: 3 };
83
45
  const statusDiff = statusOrder[a.status] - statusOrder[b.status];
@@ -85,307 +47,88 @@ function TaskList({ filterStatus, taskList }) {
85
47
  const priorityOrder = { high: 1, medium: 2, low: 3 };
86
48
  return priorityOrder[a.priority] - priorityOrder[b.priority];
87
49
  });
88
- return jsxDEV_7x81h0kn(
89
- "div",
90
- {
91
- className: "task-list-container",
92
- children: jsxDEV_7x81h0kn(
93
- "div",
94
- {
95
- className: "task-list-table",
96
- children: [
97
- jsxDEV_7x81h0kn(
98
- "div",
99
- {
100
- className: "task-list-header",
101
- children: [
102
- jsxDEV_7x81h0kn(
103
- "div",
104
- {
105
- className: "task-cell task-cell-status",
106
- children: "Status",
107
- },
108
- undefined,
109
- false,
110
- undefined,
111
- this,
112
- ),
113
- jsxDEV_7x81h0kn(
114
- "div",
115
- {
116
- className: "task-cell task-cell-title",
117
- children: "Task Details",
118
- },
119
- undefined,
120
- false,
121
- undefined,
122
- this,
123
- ),
124
- jsxDEV_7x81h0kn(
125
- "div",
126
- {
127
- className: "task-cell task-cell-priority",
128
- children: "Priority",
129
- },
130
- undefined,
131
- false,
132
- undefined,
133
- this,
134
- ),
135
- ],
136
- },
137
- undefined,
138
- true,
139
- undefined,
140
- this,
141
- ),
142
- jsxDEV_7x81h0kn(
143
- "div",
144
- {
145
- className: "task-rows",
146
- children: sortedTasks.map((task, index) =>
147
- jsxDEV_7x81h0kn(
148
- "div",
149
- {
150
- className: `task-row ${task.status === "completed" ? "task-row-completed" : ""} ${index % 2 === 1 ? "task-row-striped" : ""}`,
151
- children: [
152
- jsxDEV_7x81h0kn(
153
- "div",
154
- {
155
- className: "task-cell task-cell-status",
156
- children: jsxDEV_7x81h0kn(
157
- "span",
158
- {
159
- className: `badge badge-status-${task.status}`,
160
- children: [
161
- task.status === "completed" &&
162
- jsxDEV_7x81h0kn(
163
- Fragment_8vg9x3sq,
164
- {
165
- children: [
166
- jsxDEV_7x81h0kn(
167
- FaCheckCircle,
168
- { className: "badge-icon" },
169
- undefined,
170
- false,
171
- undefined,
172
- this,
173
- ),
174
- " Done",
175
- ],
176
- },
177
- undefined,
178
- true,
179
- undefined,
180
- this,
181
- ),
182
- task.status === "active" &&
183
- jsxDEV_7x81h0kn(
184
- Fragment_8vg9x3sq,
185
- {
186
- children: [
187
- jsxDEV_7x81h0kn(
188
- FaSyncAlt,
189
- { className: "badge-icon spin" },
190
- undefined,
191
- false,
192
- undefined,
193
- this,
194
- ),
195
- " In Progress",
196
- ],
197
- },
198
- undefined,
199
- true,
200
- undefined,
201
- this,
202
- ),
203
- task.status === "pending" &&
204
- jsxDEV_7x81h0kn(
205
- Fragment_8vg9x3sq,
206
- {
207
- children: [
208
- jsxDEV_7x81h0kn(
209
- FaClock,
210
- { className: "badge-icon" },
211
- undefined,
212
- false,
213
- undefined,
214
- this,
215
- ),
216
- " Planned",
217
- ],
218
- },
219
- undefined,
220
- true,
221
- undefined,
222
- this,
223
- ),
224
- ],
225
- },
226
- undefined,
227
- true,
228
- undefined,
229
- this,
230
- ),
231
- },
232
- undefined,
233
- false,
234
- undefined,
235
- this,
236
- ),
237
- jsxDEV_7x81h0kn(
238
- "div",
239
- {
240
- className: "task-cell task-cell-title",
241
- children: [
242
- jsxDEV_7x81h0kn(
243
- "div",
244
- {
245
- className: "task-title",
246
- children: task.title,
247
- },
248
- undefined,
249
- false,
250
- undefined,
251
- this,
252
- ),
253
- task.desc &&
254
- jsxDEV_7x81h0kn(
255
- "div",
256
- {
257
- className: "task-description",
258
- children: task.desc,
259
- },
260
- undefined,
261
- false,
262
- undefined,
263
- this,
264
- ),
265
- ],
266
- },
267
- undefined,
268
- true,
269
- undefined,
270
- this,
271
- ),
272
- jsxDEV_7x81h0kn(
273
- "div",
274
- {
275
- className: "task-cell task-cell-priority",
276
- children: jsxDEV_7x81h0kn(
277
- "span",
278
- {
279
- className: `badge badge-priority-${task.priority}`,
280
- children: [
281
- task.priority === "high" &&
282
- jsxDEV_7x81h0kn(
283
- Fragment_8vg9x3sq,
284
- {
285
- children: [
286
- jsxDEV_7x81h0kn(
287
- FaFire,
288
- { className: "badge-icon" },
289
- undefined,
290
- false,
291
- undefined,
292
- this,
293
- ),
294
- " High",
295
- ],
296
- },
297
- undefined,
298
- true,
299
- undefined,
300
- this,
301
- ),
302
- task.priority === "medium" &&
303
- jsxDEV_7x81h0kn(
304
- Fragment_8vg9x3sq,
305
- {
306
- children: [
307
- jsxDEV_7x81h0kn(
308
- FaThermometerHalf,
309
- { className: "badge-icon" },
310
- undefined,
311
- false,
312
- undefined,
313
- this,
314
- ),
315
- " Medium",
316
- ],
317
- },
318
- undefined,
319
- true,
320
- undefined,
321
- this,
322
- ),
323
- task.priority === "low" &&
324
- jsxDEV_7x81h0kn(
325
- Fragment_8vg9x3sq,
326
- {
327
- children: [
328
- jsxDEV_7x81h0kn(
329
- FaSnowflake,
330
- { className: "badge-icon" },
331
- undefined,
332
- false,
333
- undefined,
334
- this,
335
- ),
336
- " Low",
337
- ],
338
- },
339
- undefined,
340
- true,
341
- undefined,
342
- this,
343
- ),
344
- ],
345
- },
346
- undefined,
347
- true,
348
- undefined,
349
- this,
350
- ),
351
- },
352
- undefined,
353
- false,
354
- undefined,
355
- this,
356
- ),
357
- ],
358
- },
359
- index,
360
- true,
361
- undefined,
362
- this,
363
- ),
364
- ),
365
- },
366
- undefined,
367
- false,
368
- undefined,
369
- this,
370
- ),
371
- ],
372
- },
373
- undefined,
374
- true,
375
- undefined,
376
- this,
377
- ),
378
- },
379
- undefined,
380
- false,
381
- undefined,
382
- this,
50
+
51
+ return (
52
+ <div className="task-list-container">
53
+ <div className="task-list-table">
54
+ {/* Table header */}
55
+ <div className="task-list-header">
56
+ <div className="task-cell task-cell-status">Status</div>
57
+ <div className="task-cell task-cell-title">Task Details</div>
58
+ <div className="task-cell task-cell-priority">Priority</div>
59
+ </div>
60
+
61
+ {/* Task rows */}
62
+ <div className="task-rows">
63
+ {sortedTasks.map((task, index) => (
64
+ <div
65
+ key={index}
66
+ className={`task-row ${task.status === "completed" ? "task-row-completed" : ""} ${index % 2 === 1 ? "task-row-striped" : ""}`}
67
+ >
68
+ {/* Status cell */}
69
+ <div className="task-cell task-cell-status">
70
+ <span className={`badge badge-status-${task.status}`}>
71
+ {task.status === "completed" && (
72
+ <>
73
+ <FaCheckCircle className="badge-icon" /> Done
74
+ </>
75
+ )}
76
+ {task.status === "active" && (
77
+ <>
78
+ <FaSyncAlt className="badge-icon spin" /> In Progress
79
+ </>
80
+ )}
81
+ {task.status === "pending" && (
82
+ <>
83
+ <FaClock className="badge-icon" /> Planned
84
+ </>
85
+ )}
86
+ </span>
87
+ </div>
88
+
89
+ {/* Title cell */}
90
+ <div className="task-cell task-cell-title">
91
+ <div className="task-title">{task.title}</div>
92
+ {task.desc && (
93
+ <div className="task-description">{task.desc}</div>
94
+ )}
95
+ </div>
96
+
97
+ {/* Priority cell */}
98
+ <div className="task-cell task-cell-priority">
99
+ <span className={`badge badge-priority-${task.priority}`}>
100
+ {task.priority === "high" && (
101
+ <>
102
+ <FaFire className="badge-icon" /> High
103
+ </>
104
+ )}
105
+ {task.priority === "medium" && (
106
+ <>
107
+ <FaThermometerHalf className="badge-icon" /> Medium
108
+ </>
109
+ )}
110
+ {task.priority === "low" && (
111
+ <>
112
+ <FaSnowflake className="badge-icon" /> Low
113
+ </>
114
+ )}
115
+ </span>
116
+ </div>
117
+ </div>
118
+ ))}
119
+ </div>
120
+ </div>
121
+ </div>
383
122
  );
384
123
  }
124
+
125
+ // --- TaskStats ---
126
+
385
127
  function TaskStats({ taskList }) {
386
128
  if (!taskList || !Array.isArray(taskList)) {
387
129
  return null;
388
130
  }
131
+
389
132
  const total = taskList.length;
390
133
  const completed = taskList.filter(
391
134
  (task) => task.status === "completed",
@@ -393,597 +136,171 @@ function TaskStats({ taskList }) {
393
136
  const active = taskList.filter((task) => task.status === "active").length;
394
137
  const pending = taskList.filter((task) => task.status === "pending").length;
395
138
  const percentComplete = total > 0 ? Math.round((completed / total) * 100) : 0;
396
- return jsxDEV_7x81h0kn(
397
- "div",
398
- {
399
- className: "stats-container",
400
- children: [
401
- jsxDEV_7x81h0kn(
402
- "div",
403
- {
404
- className: "stat-box",
405
- children: [
406
- jsxDEV_7x81h0kn(
407
- "div",
408
- { className: "stat-label", children: "Total Tasks" },
409
- undefined,
410
- false,
411
- undefined,
412
- this,
413
- ),
414
- jsxDEV_7x81h0kn(
415
- "div",
416
- { className: "stat-value", children: total },
417
- undefined,
418
- false,
419
- undefined,
420
- this,
421
- ),
422
- ],
423
- },
424
- undefined,
425
- true,
426
- undefined,
427
- this,
428
- ),
429
- jsxDEV_7x81h0kn(
430
- "div",
431
- {
432
- className: "stat-box",
433
- children: [
434
- jsxDEV_7x81h0kn(
435
- "div",
436
- { className: "stat-label", children: "Completed" },
437
- undefined,
438
- false,
439
- undefined,
440
- this,
441
- ),
442
- jsxDEV_7x81h0kn(
443
- "div",
444
- {
445
- className: "stat-value stat-value-completed",
446
- children: completed,
447
- },
448
- undefined,
449
- false,
450
- undefined,
451
- this,
452
- ),
453
- ],
454
- },
455
- undefined,
456
- true,
457
- undefined,
458
- this,
459
- ),
460
- jsxDEV_7x81h0kn(
461
- "div",
462
- {
463
- className: "stat-box",
464
- children: [
465
- jsxDEV_7x81h0kn(
466
- "div",
467
- { className: "stat-label", children: "In Progress" },
468
- undefined,
469
- false,
470
- undefined,
471
- this,
472
- ),
473
- jsxDEV_7x81h0kn(
474
- "div",
475
- { className: "stat-value stat-value-active", children: active },
476
- undefined,
477
- false,
478
- undefined,
479
- this,
480
- ),
481
- ],
482
- },
483
- undefined,
484
- true,
485
- undefined,
486
- this,
487
- ),
488
- jsxDEV_7x81h0kn(
489
- "div",
490
- {
491
- className: "stat-box",
492
- children: [
493
- jsxDEV_7x81h0kn(
494
- "div",
495
- { className: "stat-label", children: "Planned" },
496
- undefined,
497
- false,
498
- undefined,
499
- this,
500
- ),
501
- jsxDEV_7x81h0kn(
502
- "div",
503
- {
504
- className: "stat-value stat-value-pending",
505
- children: pending,
506
- },
507
- undefined,
508
- false,
509
- undefined,
510
- this,
511
- ),
512
- ],
513
- },
514
- undefined,
515
- true,
516
- undefined,
517
- this,
518
- ),
519
- jsxDEV_7x81h0kn(
520
- "div",
521
- {
522
- className: "stat-box",
523
- children: [
524
- jsxDEV_7x81h0kn(
525
- "div",
526
- { className: "stat-label", children: "Progress" },
527
- undefined,
528
- false,
529
- undefined,
530
- this,
531
- ),
532
- jsxDEV_7x81h0kn(
533
- "div",
534
- { className: "stat-value", children: [percentComplete, "%"] },
535
- undefined,
536
- true,
537
- undefined,
538
- this,
539
- ),
540
- jsxDEV_7x81h0kn(
541
- "div",
542
- {
543
- className: "progress-bar-container",
544
- children: jsxDEV_7x81h0kn(
545
- "div",
546
- {
547
- className: "progress-bar",
548
- style: { width: `${percentComplete}%` },
549
- },
550
- undefined,
551
- false,
552
- undefined,
553
- this,
554
- ),
555
- },
556
- undefined,
557
- false,
558
- undefined,
559
- this,
560
- ),
561
- ],
562
- },
563
- undefined,
564
- true,
565
- undefined,
566
- this,
567
- ),
568
- ],
569
- },
570
- undefined,
571
- true,
572
- undefined,
573
- this,
139
+
140
+ return (
141
+ <div className="stats-container">
142
+ <div className="stat-box">
143
+ <div className="stat-label">Total Tasks</div>
144
+ <div className="stat-value">{total}</div>
145
+ </div>
146
+ <div className="stat-box">
147
+ <div className="stat-label">Completed</div>
148
+ <div className="stat-value stat-value-completed">{completed}</div>
149
+ </div>
150
+ <div className="stat-box">
151
+ <div className="stat-label">In Progress</div>
152
+ <div className="stat-value stat-value-active">{active}</div>
153
+ </div>
154
+ <div className="stat-box">
155
+ <div className="stat-label">Planned</div>
156
+ <div className="stat-value stat-value-pending">{pending}</div>
157
+ </div>
158
+ <div className="stat-box">
159
+ <div className="stat-label">Progress</div>
160
+ <div className="stat-value">{percentComplete}%</div>
161
+ <div className="progress-bar-container">
162
+ <div
163
+ className="progress-bar"
164
+ style={{ width: `${percentComplete}%` }}
165
+ />
166
+ </div>
167
+ </div>
168
+ </div>
574
169
  );
575
170
  }
171
+
172
+ // --- TaskTabs ---
173
+
576
174
  function TaskTabs({ taskList }) {
577
175
  const [activeTab, setActiveTab] = useState("all");
176
+
578
177
  if (!taskList || !Array.isArray(taskList)) {
579
178
  return null;
580
179
  }
180
+
581
181
  const tabData = [
582
182
  {
583
183
  id: "all",
584
184
  label: "All Tasks",
585
- icon: jsxDEV_7x81h0kn(
586
- FaClipboardList,
587
- {},
588
- undefined,
589
- false,
590
- undefined,
591
- this,
592
- ),
185
+ icon: <FaClipboardList />,
593
186
  count: taskList.length,
594
187
  },
595
188
  {
596
189
  id: "active",
597
190
  label: "In Progress",
598
- icon: jsxDEV_7x81h0kn(
599
- FaSyncAlt,
600
- { className: "spin" },
601
- undefined,
602
- false,
603
- undefined,
604
- this,
605
- ),
191
+ icon: <FaSyncAlt className="spin" />,
606
192
  count: taskList.filter((t) => t.status === "active").length,
607
193
  },
608
194
  {
609
195
  id: "pending",
610
196
  label: "Planned",
611
- icon: jsxDEV_7x81h0kn(FaClock, {}, undefined, false, undefined, this),
197
+ icon: <FaClock />,
612
198
  count: taskList.filter((t) => t.status === "pending").length,
613
199
  },
614
200
  {
615
201
  id: "completed",
616
202
  label: "Completed",
617
- icon: jsxDEV_7x81h0kn(
618
- FaCheckCircle,
619
- {},
620
- undefined,
621
- false,
622
- undefined,
623
- this,
624
- ),
203
+ icon: <FaCheckCircle />,
625
204
  count: taskList.filter((t) => t.status === "completed").length,
626
205
  },
627
206
  ];
628
- return jsxDEV_7x81h0kn(
629
- "div",
630
- {
631
- className: "task-tabs-container",
632
- children: [
633
- jsxDEV_7x81h0kn(
634
- "div",
635
- {
636
- className: "task-tabs",
637
- role: "tablist",
638
- "aria-label": "Task categories",
639
- children: tabData.map((tab) =>
640
- jsxDEV_7x81h0kn(
641
- "button",
642
- {
643
- className: `task-tab ${activeTab === tab.id ? "task-tab-active" : ""}`,
644
- onClick: () => setActiveTab(tab.id),
645
- role: "tab",
646
- "aria-selected": activeTab === tab.id,
647
- "aria-controls": `tab-content-${tab.id}`,
648
- id: `tab-${tab.id}`,
649
- children: [
650
- jsxDEV_7x81h0kn(
651
- "span",
652
- {
653
- className: "task-tab-icon",
654
- "aria-hidden": "true",
655
- children: tab.icon,
656
- },
657
- undefined,
658
- false,
659
- undefined,
660
- this,
661
- ),
662
- jsxDEV_7x81h0kn(
663
- "span",
664
- { className: "task-tab-label", children: tab.label },
665
- undefined,
666
- false,
667
- undefined,
668
- this,
669
- ),
670
- jsxDEV_7x81h0kn(
671
- "span",
672
- { className: "task-tab-count", children: tab.count },
673
- undefined,
674
- false,
675
- undefined,
676
- this,
677
- ),
678
- ],
679
- },
680
- tab.id,
681
- true,
682
- undefined,
683
- this,
684
- ),
685
- ),
686
- },
687
- undefined,
688
- false,
689
- undefined,
690
- this,
691
- ),
692
- jsxDEV_7x81h0kn(
693
- "div",
694
- {
695
- className: "task-tab-content",
696
- role: "tabpanel",
697
- id: `tab-content-${activeTab}`,
698
- "aria-labelledby": `tab-${activeTab}`,
699
- children: [
700
- activeTab === "all" &&
701
- jsxDEV_7x81h0kn(
702
- TaskList,
703
- { taskList },
704
- undefined,
705
- false,
706
- undefined,
707
- this,
708
- ),
709
- activeTab === "active" &&
710
- jsxDEV_7x81h0kn(
711
- TaskList,
712
- { taskList, filterStatus: "active" },
713
- undefined,
714
- false,
715
- undefined,
716
- this,
717
- ),
718
- activeTab === "pending" &&
719
- jsxDEV_7x81h0kn(
720
- TaskList,
721
- { taskList, filterStatus: "pending" },
722
- undefined,
723
- false,
724
- undefined,
725
- this,
726
- ),
727
- activeTab === "completed" &&
728
- jsxDEV_7x81h0kn(
729
- TaskList,
730
- { taskList, filterStatus: "completed" },
731
- undefined,
732
- false,
733
- undefined,
734
- this,
735
- ),
736
- ],
737
- },
738
- undefined,
739
- true,
740
- undefined,
741
- this,
742
- ),
743
- ],
744
- },
745
- undefined,
746
- true,
747
- undefined,
748
- this,
207
+
208
+ return (
209
+ <div className="task-tabs-container">
210
+ <div className="task-tabs" role="tablist" aria-label="Task categories">
211
+ {tabData.map((tab) => (
212
+ <button
213
+ key={tab.id}
214
+ className={`task-tab ${activeTab === tab.id ? "task-tab-active" : ""}`}
215
+ onClick={() => setActiveTab(tab.id)}
216
+ role="tab"
217
+ aria-selected={activeTab === tab.id}
218
+ aria-controls={`tab-content-${tab.id}`}
219
+ id={`tab-${tab.id}`}
220
+ >
221
+ <span className="task-tab-icon" aria-hidden="true">
222
+ {tab.icon}
223
+ </span>
224
+ <span className="task-tab-label">{tab.label}</span>
225
+ <span className="task-tab-count">{tab.count}</span>
226
+ </button>
227
+ ))}
228
+ </div>
229
+
230
+ <div
231
+ className="task-tab-content"
232
+ role="tabpanel"
233
+ id={`tab-content-${activeTab}`}
234
+ aria-labelledby={`tab-${activeTab}`}
235
+ >
236
+ {activeTab === "all" && <TaskList taskList={taskList} />}
237
+ {activeTab === "active" && (
238
+ <TaskList taskList={taskList} filterStatus="active" />
239
+ )}
240
+ {activeTab === "pending" && (
241
+ <TaskList taskList={taskList} filterStatus="pending" />
242
+ )}
243
+ {activeTab === "completed" && (
244
+ <TaskList taskList={taskList} filterStatus="completed" />
245
+ )}
246
+ </div>
247
+ </div>
749
248
  );
750
249
  }
250
+
251
+ // --- TasksPage (default export) ---
252
+
751
253
  export default function TasksPage() {
752
254
  const { siteConfig } = useDocusaurusContext();
753
255
  const { customFields } = siteConfig || {};
754
256
  const tasksPage = customFields?.tasksPage;
755
- const heading = tasksPage.heading || "Tasks";
756
- const subheading = tasksPage.subheading || "Roadmap & Goals";
757
- const taskList =
758
- tasksPage.enable && tasksPage.taskList ? tasksPage.taskList : [];
257
+
759
258
  if (!tasksPage || !tasksPage.enable) {
760
- return jsxDEV_7x81h0kn(
761
- Layout,
762
- {
763
- title: "Tasks are Disabled",
764
- description: "Tasks are currently disabled",
765
- children: jsxDEV_7x81h0kn(
766
- "div",
767
- {
768
- className: "tasks-container",
769
- children: jsxDEV_7x81h0kn(
770
- "div",
771
- {
772
- className: "tasks-content",
773
- children: jsxDEV_7x81h0kn(
774
- "div",
775
- {
776
- className: "tasks-disabled-notice",
777
- children: [
778
- jsxDEV_7x81h0kn(
779
- "div",
780
- {
781
- className: "disabled-icon",
782
- children: jsxDEV_7x81h0kn(
783
- FaExclamationTriangle,
784
- { "aria-hidden": "true" },
785
- undefined,
786
- false,
787
- undefined,
788
- this,
789
- ),
790
- },
791
- undefined,
792
- false,
793
- undefined,
794
- this,
795
- ),
796
- jsxDEV_7x81h0kn(
797
- "h2",
798
- {
799
- className: "disabled-title",
800
- children: "Tasks are currently disabled",
801
- },
802
- undefined,
803
- false,
804
- undefined,
805
- this,
806
- ),
807
- jsxDEV_7x81h0kn(
808
- "p",
809
- {
810
- className: "disabled-help",
811
- children: [
812
- "To enable tasks, set ",
813
- jsxDEV_7x81h0kn(
814
- "code",
815
- { children: "tasks.enable" },
816
- undefined,
817
- false,
818
- undefined,
819
- this,
820
- ),
821
- " to",
822
- " ",
823
- jsxDEV_7x81h0kn(
824
- "code",
825
- { children: "true" },
826
- undefined,
827
- false,
828
- undefined,
829
- this,
830
- ),
831
- ],
832
- },
833
- undefined,
834
- true,
835
- undefined,
836
- this,
837
- ),
838
- ],
839
- },
840
- undefined,
841
- true,
842
- undefined,
843
- this,
844
- ),
845
- },
846
- undefined,
847
- false,
848
- undefined,
849
- this,
850
- ),
851
- },
852
- undefined,
853
- false,
854
- undefined,
855
- this,
856
- ),
857
- },
858
- undefined,
859
- false,
860
- undefined,
861
- this,
259
+ return (
260
+ <Layout
261
+ title="Tasks are Disabled"
262
+ description="Tasks are currently disabled"
263
+ >
264
+ <div className="tasks-container">
265
+ <div className="tasks-content">
266
+ <div className="tasks-disabled-notice">
267
+ <div className="disabled-icon">
268
+ <FaExclamationTriangle aria-hidden="true" />
269
+ </div>
270
+ <h2 className="disabled-title">Tasks are currently disabled</h2>
271
+ <p className="disabled-help">
272
+ To enable tasks, set <code>tasks.enable</code> to{" "}
273
+ <code>true</code>
274
+ </p>
275
+ </div>
276
+ </div>
277
+ </div>
278
+ </Layout>
862
279
  );
863
280
  }
864
- return jsxDEV_7x81h0kn(
865
- Layout,
866
- {
867
- title: heading,
868
- description: subheading,
869
- children: [
870
- jsxDEV_7x81h0kn(
871
- Head,
872
- {
873
- children: [
874
- jsxDEV_7x81h0kn(
875
- "meta",
876
- { property: "og:title", content: heading },
877
- undefined,
878
- false,
879
- undefined,
880
- this,
881
- ),
882
- jsxDEV_7x81h0kn(
883
- "meta",
884
- { property: "og:description", content: subheading },
885
- undefined,
886
- false,
887
- undefined,
888
- this,
889
- ),
890
- jsxDEV_7x81h0kn(
891
- "meta",
892
- { name: "twitter:title", content: heading },
893
- undefined,
894
- false,
895
- undefined,
896
- this,
897
- ),
898
- jsxDEV_7x81h0kn(
899
- "meta",
900
- { name: "twitter:description", content: subheading },
901
- undefined,
902
- false,
903
- undefined,
904
- this,
905
- ),
906
- ],
907
- },
908
- undefined,
909
- true,
910
- undefined,
911
- this,
912
- ),
913
- jsxDEV_7x81h0kn(
914
- "div",
915
- {
916
- className: "tasks-container",
917
- children: [
918
- jsxDEV_7x81h0kn(
919
- "div",
920
- {
921
- className: "tasks-header",
922
- children: [
923
- jsxDEV_7x81h0kn(
924
- "h1",
925
- { className: "tasks-heading", children: heading },
926
- undefined,
927
- false,
928
- undefined,
929
- this,
930
- ),
931
- subheading &&
932
- jsxDEV_7x81h0kn(
933
- "p",
934
- { className: "tasks-subheading", children: subheading },
935
- undefined,
936
- false,
937
- undefined,
938
- this,
939
- ),
940
- ],
941
- },
942
- undefined,
943
- true,
944
- undefined,
945
- this,
946
- ),
947
- jsxDEV_7x81h0kn(
948
- "div",
949
- {
950
- className: "tasks-content",
951
- children: [
952
- jsxDEV_7x81h0kn(
953
- TaskStats,
954
- { taskList },
955
- undefined,
956
- false,
957
- undefined,
958
- this,
959
- ),
960
- jsxDEV_7x81h0kn(
961
- TaskTabs,
962
- { taskList },
963
- undefined,
964
- false,
965
- undefined,
966
- this,
967
- ),
968
- ],
969
- },
970
- undefined,
971
- true,
972
- undefined,
973
- this,
974
- ),
975
- ],
976
- },
977
- undefined,
978
- true,
979
- undefined,
980
- this,
981
- ),
982
- ],
983
- },
984
- undefined,
985
- true,
986
- undefined,
987
- this,
281
+
282
+ const heading = tasksPage.heading || "Tasks";
283
+ const subheading = tasksPage.subheading || "Roadmap & Goals";
284
+ const taskList = tasksPage.taskList ?? [];
285
+
286
+ return (
287
+ <Layout title={heading} description={subheading}>
288
+ <Head>
289
+ <meta property="og:title" content={heading} />
290
+ <meta property="og:description" content={subheading} />
291
+ <meta name="twitter:title" content={heading} />
292
+ <meta name="twitter:description" content={subheading} />
293
+ </Head>
294
+ <div className="tasks-container">
295
+ <div className="tasks-header">
296
+ <h1 className="tasks-heading">{heading}</h1>
297
+ {subheading && <p className="tasks-subheading">{subheading}</p>}
298
+ </div>
299
+ <div className="tasks-content">
300
+ <TaskStats taskList={taskList} />
301
+ <TaskTabs taskList={taskList} />
302
+ </div>
303
+ </div>
304
+ </Layout>
988
305
  );
989
306
  }