+19
-13
frontend/src/components/LinkList.tsx
+19
-13
frontend/src/components/LinkList.tsx
···
1
import { useEffect, useState } from 'react'
2
import { Link } from '../types/api'
3
import { getAllLinks, deleteLink } from '../api/client'
···
22
DialogFooter,
23
} from "@/components/ui/dialog"
24
25
-
import { StatisticsModal } from "./StatisticsModal"
26
27
interface LinkListProps {
28
refresh?: number;
···
85
const baseUrl = window.location.origin
86
navigator.clipboard.writeText(`${baseUrl}/${shortCode}`)
87
toast({
88
-
description: (
89
-
<>
90
-
Link copied to clipboard
91
-
<br />
92
-
You can add ?source=TextHere to the end of the link to track the source of clicks
93
-
</>
94
-
),
95
})
96
}
97
···
186
</div>
187
</CardContent>
188
</Card>
189
-
<StatisticsModal
190
-
isOpen={statsModal.isOpen}
191
-
onClose={() => setStatsModal({ isOpen: false, linkId: null })}
192
-
linkId={statsModal.linkId!}
193
-
/>
194
</>
195
)
196
}
···
1
+
import { lazy, Suspense } from 'react'
2
+
3
import { useEffect, useState } from 'react'
4
import { Link } from '../types/api'
5
import { getAllLinks, deleteLink } from '../api/client'
···
24
DialogFooter,
25
} from "@/components/ui/dialog"
26
27
+
const StatisticsModal = lazy(() => import('./StatisticsModal'))
28
29
interface LinkListProps {
30
refresh?: number;
···
87
const baseUrl = window.location.origin
88
navigator.clipboard.writeText(`${baseUrl}/${shortCode}`)
89
toast({
90
+
description: (
91
+
<>
92
+
Link copied to clipboard
93
+
<br />
94
+
You can add ?source=TextHere to the end of the link to track the source of clicks
95
+
</>
96
+
),
97
})
98
}
99
···
188
</div>
189
</CardContent>
190
</Card>
191
+
{statsModal.isOpen && (
192
+
<Suspense fallback={<div>Loading...</div>}>
193
+
<StatisticsModal
194
+
isOpen={statsModal.isOpen}
195
+
onClose={() => setStatsModal({ isOpen: false, linkId: null })}
196
+
linkId={statsModal.linkId!}
197
+
/>
198
+
</Suspense>
199
+
)}
200
</>
201
)
202
}
+1
-1
frontend/src/components/StatisticsModal.tsx
+1
-1
frontend/src/components/StatisticsModal.tsx
···
58
return null;
59
};
60
61
-
export function StatisticsModal({ isOpen, onClose, linkId }: StatisticsModalProps) {
62
const [clicksOverTime, setClicksOverTime] = useState<EnhancedClickStats[]>([]);
63
const [sourcesData, setSourcesData] = useState<SourceStats[]>([]);
64
const [loading, setLoading] = useState(true);
···
58
return null;
59
};
60
61
+
export default function StatisticsModal({ isOpen, onClose, linkId }: StatisticsModalProps) {
62
const [clicksOverTime, setClicksOverTime] = useState<EnhancedClickStats[]>([]);
63
const [sourcesData, setSourcesData] = useState<SourceStats[]>([]);
64
const [loading, setLoading] = useState(true);