fix: 🐛
This commit is contained in:
@@ -10,7 +10,7 @@ export function Titlebar({
|
|||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cn(
|
className={cn(
|
||||||
'sticky top-0 w-full h-12 z-40 bg-background [&_svg]:size-5 [&_svg]:shrink-0',
|
'sticky top-0 w-full h-12 z-40 bg-background [&_svg]:size-5 [&_svg]:shrink-0 select-none',
|
||||||
className
|
className
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import FeedSwitcher from '@/components/FeedSwitcher'
|
|||||||
import { Drawer, DrawerContent } from '@/components/ui/drawer'
|
import { Drawer, DrawerContent } from '@/components/ui/drawer'
|
||||||
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
|
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
|
||||||
import { simplifyUrl } from '@/lib/url'
|
import { simplifyUrl } from '@/lib/url'
|
||||||
|
import { cn } from '@/lib/utils'
|
||||||
import { useFeed } from '@/providers/FeedProvider'
|
import { useFeed } from '@/providers/FeedProvider'
|
||||||
import { useRelaySets } from '@/providers/RelaySetsProvider'
|
import { useRelaySets } from '@/providers/RelaySetsProvider'
|
||||||
import { useScreenSize } from '@/providers/ScreenSizeProvider'
|
import { useScreenSize } from '@/providers/ScreenSizeProvider'
|
||||||
@@ -9,14 +10,14 @@ import { ChevronDown, Server, UsersRound } from 'lucide-react'
|
|||||||
import { forwardRef, HTMLAttributes, useState } from 'react'
|
import { forwardRef, HTMLAttributes, useState } from 'react'
|
||||||
import { useTranslation } from 'react-i18next'
|
import { useTranslation } from 'react-i18next'
|
||||||
|
|
||||||
export default function FeedButton() {
|
export default function FeedButton({ className }: { className?: string }) {
|
||||||
const { isSmallScreen } = useScreenSize()
|
const { isSmallScreen } = useScreenSize()
|
||||||
const [open, setOpen] = useState(false)
|
const [open, setOpen] = useState(false)
|
||||||
|
|
||||||
if (isSmallScreen) {
|
if (isSmallScreen) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<FeedSwitcherTrigger onClick={() => setOpen(true)} />
|
<FeedSwitcherTrigger className={className} onClick={() => setOpen(true)} />
|
||||||
<Drawer open={open} onOpenChange={setOpen}>
|
<Drawer open={open} onOpenChange={setOpen}>
|
||||||
<DrawerContent className="max-h-[80vh]">
|
<DrawerContent className="max-h-[80vh]">
|
||||||
<div className="p-4 overflow-auto">
|
<div className="p-4 overflow-auto">
|
||||||
@@ -31,7 +32,7 @@ export default function FeedButton() {
|
|||||||
return (
|
return (
|
||||||
<Popover open={open} onOpenChange={setOpen}>
|
<Popover open={open} onOpenChange={setOpen}>
|
||||||
<PopoverTrigger asChild>
|
<PopoverTrigger asChild>
|
||||||
<FeedSwitcherTrigger />
|
<FeedSwitcherTrigger className={className} />
|
||||||
</PopoverTrigger>
|
</PopoverTrigger>
|
||||||
<PopoverContent side="bottom" className="w-96 p-4 max-h-[80vh] overflow-auto">
|
<PopoverContent side="bottom" className="w-96 p-4 max-h-[80vh] overflow-auto">
|
||||||
<FeedSwitcher close={() => setOpen(false)} />
|
<FeedSwitcher close={() => setOpen(false)} />
|
||||||
@@ -41,7 +42,7 @@ export default function FeedButton() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const FeedSwitcherTrigger = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(
|
const FeedSwitcherTrigger = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(
|
||||||
(props, ref) => {
|
({ className, ...props }, ref) => {
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
const { feedType, relayUrls, activeRelaySetId } = useFeed()
|
const { feedType, relayUrls, activeRelaySetId } = useFeed()
|
||||||
const { relaySets } = useRelaySets()
|
const { relaySets } = useRelaySets()
|
||||||
@@ -61,12 +62,12 @@ const FeedSwitcherTrigger = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivEle
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className="flex items-center gap-2 clickable px-3 h-full rounded-lg"
|
className={cn('flex items-center gap-2 clickable px-3 h-full rounded-lg', className)}
|
||||||
ref={ref}
|
ref={ref}
|
||||||
{...props}
|
{...props}
|
||||||
>
|
>
|
||||||
{feedType === 'following' ? <UsersRound /> : <Server />}
|
{feedType === 'following' ? <UsersRound /> : <Server />}
|
||||||
<div className="text-lg font-semibold">{title}</div>
|
<div className="text-lg font-semibold truncate">{title}</div>
|
||||||
<ChevronDown />
|
<ChevronDown />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -66,8 +66,8 @@ function NoteListPageTitlebar({ temporaryRelayUrls = [] }: { temporaryRelayUrls?
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex gap-1 items-center h-full justify-between">
|
<div className="flex gap-1 items-center h-full justify-between">
|
||||||
<FeedButton />
|
<FeedButton className="flex-1 max-w-fit w-0" />
|
||||||
<div>
|
<div className="shrink-0">
|
||||||
{temporaryRelayUrls.length > 0 && (
|
{temporaryRelayUrls.length > 0 && (
|
||||||
<SaveRelayDropdownMenu urls={temporaryRelayUrls} atTitlebar />
|
<SaveRelayDropdownMenu urls={temporaryRelayUrls} atTitlebar />
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -129,9 +129,13 @@ const ProfilePage = forwardRef(({ id, index }: { id?: string; index?: number },
|
|||||||
</div>
|
</div>
|
||||||
<ProfileAbout about={about} className="text-wrap break-words whitespace-pre-wrap mt-2" />
|
<ProfileAbout about={about} className="text-wrap break-words whitespace-pre-wrap mt-2" />
|
||||||
{website && (
|
{website && (
|
||||||
<div className="flex gap-1 items-center text-primary mt-2">
|
<div className="flex gap-1 items-center text-primary mt-2 truncate">
|
||||||
<Link size={14} />
|
<Link size={14} className="shrink-0" />
|
||||||
<a href={website} target="_blank" className="hover:underline">
|
<a
|
||||||
|
href={website}
|
||||||
|
target="_blank"
|
||||||
|
className="hover:underline truncate flex-1 max-w-fit w-0"
|
||||||
|
>
|
||||||
{website}
|
{website}
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user