index.tsx raw

   1  import { Dialog, DialogContent } from '@/components/ui/dialog'
   2  import { Drawer, DrawerContent } from '@/components/ui/drawer'
   3  import { useScreenSize } from '@/providers/ScreenSizeProvider'
   4  import { Dispatch } from 'react'
   5  import AccountManager from '../AccountManager'
   6  
   7  export default function LoginDialog({
   8    open,
   9    setOpen
  10  }: {
  11    open: boolean
  12    setOpen: Dispatch<boolean>
  13  }) {
  14    const { isSmallScreen } = useScreenSize()
  15  
  16    if (isSmallScreen) {
  17      return (
  18        <Drawer open={open} onOpenChange={setOpen}>
  19          <DrawerContent className="max-h-[90vh]">
  20            <div className="flex flex-col p-4 gap-4 overflow-auto">
  21              <AccountManager close={() => setOpen(false)} />
  22            </div>
  23          </DrawerContent>
  24        </Drawer>
  25      )
  26    }
  27  
  28    return (
  29      <Dialog open={open} onOpenChange={setOpen}>
  30        <DialogContent className="w-[520px] max-h-[90vh] py-8 overflow-auto">
  31          <AccountManager close={() => setOpen(false)} />
  32        </DialogContent>
  33      </Dialog>
  34    )
  35  }
  36