Skip to content

Commit b01abcb

Browse files
committed
improve admin panel again
1 parent b226430 commit b01abcb

2 files changed

Lines changed: 97 additions & 8 deletions

File tree

devconnect/src/pages/community-events/admin.tsx

Lines changed: 96 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import Head from 'next/head'
44
import { supabase } from 'common/supabaseClient'
55
import NewSchedule from 'lib/components/event-schedule-new'
66
import FeedCoupons from 'common/components/perks/feed-coupons'
7+
import { Dialog, DialogContent } from 'lib/components/ui/dialog'
78

89
// Format Atproto event to our calendar component format
910
const formatATProtoEvent = (atprotoEvent: any) => {
@@ -57,6 +58,15 @@ const AdminPage = () => {
5758
const [statusFilter, setStatusFilter] = useState<'all' | 'needs_review' | 'changes_need_review' | 'approved'>('all')
5859
const [editingComments, setEditingComments] = useState<Set<string>>(new Set())
5960
const [commentValues, setCommentValues] = useState<Record<string, string>>({})
61+
const [expandedJson, setExpandedJson] = useState<{
62+
isOpen: boolean
63+
title: string
64+
data: any
65+
}>({
66+
isOpen: false,
67+
title: '',
68+
data: null,
69+
})
6070

6171
const fetchEvents = async () => {
6272
try {
@@ -352,6 +362,22 @@ const AdminPage = () => {
352362
setCommentValues(newCommentValues)
353363
}
354364

365+
const handleExpandJson = (title: string, data: any) => {
366+
setExpandedJson({
367+
isOpen: true,
368+
title,
369+
data,
370+
})
371+
}
372+
373+
const handleCloseJsonDialog = () => {
374+
setExpandedJson({
375+
isOpen: false,
376+
title: '',
377+
data: null,
378+
})
379+
}
380+
355381
// Filter events based on status filter
356382
const filteredEvents = events.filter(event => {
357383
if (statusFilter === 'needs_review') {
@@ -639,6 +665,15 @@ const AdminPage = () => {
639665
</div>
640666
)}
641667

668+
{!event.contact && recordData.organizer && recordData.organizer.contact && (
669+
<div className="mt-1">
670+
<span className="text-xs text-blue-600 font-medium">Contact: </span>
671+
<span className="text-xs text-gray-700">
672+
{recordData.organizer.contact}
673+
</span>
674+
</div>
675+
)}
676+
642677
{/* Status Badge */}
643678
<div className="mt-1 space-y-1">
644679
{hasChanges ? (
@@ -675,25 +710,60 @@ const AdminPage = () => {
675710
<div className="lg:col-span-5">
676711
{hasChanges ? (
677712
<div className="space-y-2">
678-
<div className="bg-green-50 rounded-md p-3 max-h-32 overflow-y-auto">
679-
<div className="text-xs font-medium text-green-800 mb-1">
680-
✓ Currently Live (Approved):
713+
<div className="bg-green-50 rounded-md p-3 max-h-32 overflow-y-auto relative">
714+
<div className="flex items-center justify-between mb-1">
715+
<div className="text-xs font-medium text-green-800">
716+
✓ Currently Live (Approved):
717+
</div>
718+
<button
719+
onClick={() =>
720+
handleExpandJson(
721+
'Currently Live (Approved)',
722+
event.record_passed_review
723+
)
724+
}
725+
className="text-xs text-green-600 hover:text-green-800 underline"
726+
>
727+
Expand
728+
</button>
681729
</div>
682730
<pre className="text-xs text-green-700 whitespace-pre-wrap break-words">
683731
{JSON.stringify(event.record_passed_review, null, 2)}
684732
</pre>
685733
</div>
686-
<div className="bg-orange-50 rounded-md p-3 max-h-32 overflow-y-auto">
687-
<div className="text-xs font-medium text-orange-800 mb-1">
688-
📝 Latest Update (Needs Review):
734+
<div className="bg-orange-50 rounded-md p-3 max-h-32 overflow-y-auto relative">
735+
<div className="flex items-center justify-between mb-1">
736+
<div className="text-xs font-medium text-orange-800">
737+
📝 Latest Update (Needs Review):
738+
</div>
739+
<button
740+
onClick={() =>
741+
handleExpandJson(
742+
'Latest Update (Needs Review)',
743+
event.record_needs_review
744+
)
745+
}
746+
className="text-xs text-orange-600 hover:text-orange-800 underline"
747+
>
748+
Expand
749+
</button>
689750
</div>
690751
<pre className="text-xs text-orange-700 whitespace-pre-wrap break-words">
691752
{JSON.stringify(event.record_needs_review, null, 2)}
692753
</pre>
693754
</div>
694755
</div>
695756
) : (
696-
<div className="bg-gray-50 rounded-md p-3 max-h-40 overflow-y-auto">
757+
<div className="bg-gray-50 rounded-md p-3 max-h-40 overflow-y-auto relative">
758+
<div className="flex items-center justify-between mb-2">
759+
<div className="text-xs font-medium text-gray-700">Event Data:</div>
760+
<button
761+
onClick={() => handleExpandJson('Event Data', recordData)}
762+
className="text-xs text-gray-600 hover:text-gray-800 underline"
763+
>
764+
Expand
765+
</button>
766+
</div>
697767
<pre className="text-xs text-gray-700 whitespace-pre-wrap break-words">
698768
{JSON.stringify(recordData, null, 2)}
699769
</pre>
@@ -866,6 +936,25 @@ const AdminPage = () => {
866936
setSelectedDay={() => {}}
867937
/>
868938
</div>
939+
940+
{/* JSON Expansion Dialog */}
941+
<Dialog open={expandedJson.isOpen} onOpenChange={handleCloseJsonDialog}>
942+
<DialogContent className="max-w-4xl max-h-[80vh] overflow-auto">
943+
<div className="flex flex-col h-full">
944+
<div className="flex items-center justify-between mb-4">
945+
<h3 className="text-lg font-semibold text-gray-900">{expandedJson.title}</h3>
946+
<button onClick={handleCloseJsonDialog} className="text-gray-400 hover:text-gray-600">
947+
948+
</button>
949+
</div>
950+
<div className="flex-1 overflow-auto bg-gray-50 rounded-md p-4">
951+
<pre className="text-sm text-gray-700 whitespace-pre-wrap break-words">
952+
{JSON.stringify(expandedJson.data, null, 2)}
953+
</pre>
954+
</div>
955+
</div>
956+
</DialogContent>
957+
</Dialog>
869958
</>
870959
) : (
871960
<div className="max-w-md mx-auto">

lib/components/ui/dialog.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ const DialogContent = React.forwardRef<
3838
<DialogPrimitive.Content
3939
ref={ref}
4040
className={cn(
41-
"fixed left-[50%] top-[50%] z-50 grid w-full outline-none max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-neutral-200 bg-white shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-neutral-800 dark:bg-neutral-950",
41+
"fixed left-[50%] top-[50%] !z-[10000001] grid w-full outline-none max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-neutral-200 bg-white shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg dark:border-neutral-800 dark:bg-neutral-950",
4242
className
4343
)}
4444
{...props}

0 commit comments

Comments
 (0)