99} from "@phosphor-icons/react" ;
1010import dayjs from "dayjs" ;
1111import relativeTime from "dayjs/plugin/relativeTime" ;
12- import Link from "next/link" ;
1312import { useRouter } from "next/navigation" ;
1413import { useState } from "react" ;
1514import { toast } from "sonner" ;
@@ -29,22 +28,29 @@ type OrganizationsListProps = {
2928} ;
3029
3130function EmptyState ( ) {
31+ const [ showCreateOrganizationDialog , setShowCreateOrganizationDialog ] =
32+ useState ( false ) ;
33+
3234 return (
33- < div className = "flex h-full flex-col items-center justify-center p-8 text-center" >
34- < div className = "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-primary/10" >
35- < BuildingsIcon className = "text-primary" size = { 28 } weight = "duotone" />
36- </ div >
37- < h3 className = "mb-1 font-semibold text-lg" > No organizations yet</ h3 >
38- < p className = "mb-6 max-w-sm text-muted-foreground text-sm" >
39- Create your first organization to collaborate with your team
40- </ p >
41- < Button asChild >
42- < Link href = "/organizations/new" >
43- < PlusIcon className = "mr-2" size = { 16 } />
35+ < >
36+ < div className = "flex h-full flex-col items-center justify-center p-8 text-center" >
37+ < div className = "mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-primary/10" >
38+ < BuildingsIcon className = "text-primary" size = { 28 } weight = "duotone" />
39+ </ div >
40+ < h3 className = "mb-1 font-semibold text-lg" > No organizations yet</ h3 >
41+ < p className = "mb-6 max-w-sm text-muted-foreground text-sm" >
42+ Create your first organization to collaborate with your team
43+ </ p >
44+ < Button onClick = { ( ) => setShowCreateOrganizationDialog ( true ) } >
4445 Create Organization
45- </ Link >
46- </ Button >
47- </ div >
46+ </ Button >
47+ </ div >
48+
49+ < CreateOrganizationDialog
50+ isOpen = { showCreateOrganizationDialog }
51+ onClose = { ( ) => setShowCreateOrganizationDialog ( false ) }
52+ />
53+ </ >
4854 ) ;
4955}
5056
0 commit comments