konnosDashboard
DNSTableHeaders.tsx38 lines · main
1import { Loader2 } from 'lucide-react'
2
3export type DNSTableHeaderProps = {
4 display: string
5}
6
7export const DNSTableHeaders = ({ display }: DNSTableHeaderProps) => {
8 // Display the DNS table headers if we have something to show
9 if (display !== '') {
10 return (
11 <div className="flex gap-4">
12 <div className="w-[50px]">
13 <p className="text-foreground-light text-sm">Type</p>
14 </div>
15 <div className="text-sm grid gap-2 md:grid md:grid-cols-12 md:gap-x-4 input-mono flex-1">
16 <div className="flex flex-row space-x-2 justify-between col-span-12">
17 <label className="block text-foreground-light text-sm break-all">Name</label>
18 </div>
19 </div>
20 <div className="text-sm grid gap-2 md:grid md:grid-cols-12 md:gap-x-4 input-mono flex-1">
21 <div className="flex flex-row space-x-2 justify-between col-span-12">
22 <label className="block text-foreground-light text-sm break-all">Content</label>
23 </div>
24 </div>
25 </div>
26 )
27 }
28
29 // If we have not detected SSL TXT records ask the user to (re)validate
30 return (
31 <div className="flex items-center gap-2">
32 <Loader2 size={14} className="animate-spin" />
33 <p className="text-sm text-foreground-light">
34 Validating custom domain and TLS configuration...
35 </p>
36 </div>
37 )
38}