A very performant and light (2mb in memory) link shortener and tracker. Written in Rust and React and uses Postgres/SQLite.

Lazy load Statistics Modal

Changed files
+20 -14
frontend
+19 -13
frontend/src/components/LinkList.tsx
··· 1 + import { lazy, Suspense } from 'react' 2 + 1 3 import { useEffect, useState } from 'react' 2 4 import { Link } from '../types/api' 3 5 import { getAllLinks, deleteLink } from '../api/client' ··· 22 24 DialogFooter, 23 25 } from "@/components/ui/dialog" 24 26 25 - import { StatisticsModal } from "./StatisticsModal" 27 + const StatisticsModal = lazy(() => import('./StatisticsModal')) 26 28 27 29 interface LinkListProps { 28 30 refresh?: number; ··· 85 87 const baseUrl = window.location.origin 86 88 navigator.clipboard.writeText(`${baseUrl}/${shortCode}`) 87 89 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 - ), 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 + ), 95 97 }) 96 98 } 97 99 ··· 186 188 </div> 187 189 </CardContent> 188 190 </Card> 189 - <StatisticsModal 190 - isOpen={statsModal.isOpen} 191 - onClose={() => setStatsModal({ isOpen: false, linkId: null })} 192 - linkId={statsModal.linkId!} 193 - /> 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 + )} 194 200 </> 195 201 ) 196 202 }
+1 -1
frontend/src/components/StatisticsModal.tsx
··· 58 58 return null; 59 59 }; 60 60 61 - export function StatisticsModal({ isOpen, onClose, linkId }: StatisticsModalProps) { 61 + export default function StatisticsModal({ isOpen, onClose, linkId }: StatisticsModalProps) { 62 62 const [clicksOverTime, setClicksOverTime] = useState<EnhancedClickStats[]>([]); 63 63 const [sourcesData, setSourcesData] = useState<SourceStats[]>([]); 64 64 const [loading, setLoading] = useState(true);