Fixed share page. Updated device detect. Updated teams fetch.

This commit is contained in:
Mike Cao 2025-09-25 11:21:44 -07:00
parent 27c342811e
commit 1b400da7b2
16 changed files with 118 additions and 109 deletions

View file

@ -10,9 +10,8 @@ import {
Row,
Column,
Pressable,
Loading,
} from '@umami/react-zen';
import { useLoginQuery, useMessages, useUserTeamsQuery, useNavigation } from '@/components/hooks';
import { useLoginQuery, useMessages, useNavigation } from '@/components/hooks';
import { ChevronRight, User, Users } from '@/components/icons';
export interface TeamsButtonProps {
@ -20,19 +19,14 @@ export interface TeamsButtonProps {
onAction?: (id: any) => void;
}
export function TeamsButton({ showText = true, onAction }: TeamsButtonProps) {
export function NavButton({ showText = true, onAction }: TeamsButtonProps) {
const { user } = useLoginQuery();
const { formatMessage, labels } = useMessages();
const { data, isLoading } = useUserTeamsQuery(user.id);
const { teamId } = useNavigation();
const team = data?.data?.find(({ id }) => id === teamId);
const team = user?.teams?.find(({ id }) => id === teamId);
const selectedKeys = new Set([teamId || 'user']);
const label = teamId ? team?.name : user.username;
if (isLoading) {
return <Loading icon="dots" size="sm" placement="center" />;
}
return (
<MenuTrigger>
<Pressable>
@ -41,10 +35,13 @@ export function TeamsButton({ showText = true, onAction }: TeamsButtonProps) {
justifyContent="space-between"
flexGrow={1}
padding
backgroundColor="2"
border
borderRadius
shadow="1"
maxHeight="40px"
style={{ cursor: 'pointer', textWrap: 'nowrap', outline: 'none' }}
>
<Row alignItems="center" gap>
<Row alignItems="center" position="relative" gap maxHeight="40px">
<Icon>{teamId ? <Users /> : <User />}</Icon>
{showText && <Text>{label}</Text>}
</Row>
@ -75,7 +72,7 @@ export function TeamsButton({ showText = true, onAction }: TeamsButtonProps) {
</MenuSection>
<MenuSeparator />
<MenuSection title={formatMessage(labels.teams)}>
{data?.data?.map(({ id, name }) => (
{user?.teams?.map(({ id, name }) => (
<MenuItem key={id} id={id}>
<Row alignItems="center" gap>
<Icon size="sm">

View file

@ -3,6 +3,7 @@ import { TimezoneSetting } from '@/app/(main)/settings/preferences/TimezoneSetti
import { DateRangeSetting } from '@/app/(main)/settings/preferences/DateRangeSetting';
import { Settings } from '@/components/icons';
import { useMessages } from '@/components/hooks';
import { Panel } from '@/components/common/Panel';
export function PreferencesButton() {
const { formatMessage, labels } = useMessages();
@ -15,12 +16,16 @@ export function PreferencesButton() {
</Icon>
</Button>
<Popover placement="bottom end">
<Column gap="3">
<Label>{formatMessage(labels.timezone)}</Label>
<TimezoneSetting />
<Label>{formatMessage(labels.defaultDateRange)}</Label>
<DateRangeSetting />
</Column>
<Panel gap="3">
<Column>
<Label>{formatMessage(labels.timezone)}</Label>
<TimezoneSetting />
</Column>
<Column>
<Label>{formatMessage(labels.defaultDateRange)}</Label>
<DateRangeSetting />
</Column>
</Panel>
</Popover>
</DialogTrigger>
);