index.tsx raw

   1  import LoginDialog from '@/components/LoginDialog'
   2  import Profile from '@/components/Profile'
   3  import { Button } from '@/components/ui/button'
   4  import PrimaryPageLayout from '@/layouts/PrimaryPageLayout'
   5  import { useNostr } from '@/providers/NostrProvider'
   6  import { TPageRef } from '@/types'
   7  import { ArrowDownUp, UserRound } from 'lucide-react'
   8  import { forwardRef, useState } from 'react'
   9  import { useTranslation } from 'react-i18next'
  10  
  11  const ProfilePage = forwardRef<TPageRef>((_, ref) => {
  12    const { pubkey } = useNostr()
  13  
  14    return (
  15      <PrimaryPageLayout
  16        pageName="profile"
  17        titlebar={<ProfilePageTitlebar />}
  18        displayScrollToTopButton
  19        ref={ref}
  20      >
  21        <Profile id={pubkey ?? undefined} />
  22      </PrimaryPageLayout>
  23    )
  24  })
  25  ProfilePage.displayName = 'ProfilePage'
  26  export default ProfilePage
  27  
  28  function ProfilePageTitlebar() {
  29    const { t } = useTranslation()
  30    const [loginDialogOpen, setLoginDialogOpen] = useState(false)
  31  
  32    return (
  33      <>
  34        <div className="flex justify-between items-center h-full w-full pl-3 pr-1">
  35          <div className="flex gap-2 items-center">
  36            <UserRound />
  37            <div className="text-lg font-semibold">{t('Profile')}</div>
  38          </div>
  39          <Button variant="ghost" size="titlebar-icon" onClick={() => setLoginDialogOpen(true)}>
  40            <ArrowDownUp />
  41          </Button>
  42        </div>
  43        <LoginDialog open={loginDialogOpen} setOpen={setLoginDialogOpen} />
  44      </>
  45    )
  46  }
  47