watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-15 01:55:36 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Updated edit forms and icons.
Some checks failed
Create docker images / Build, push, and deploy (push) Has been cancelled
Details
Node.js CI / build (postgresql, 18.18, 10) (push) Has been cancelled
Details

Browse source
This commit is contained in:
Mike Cao 2025-09-26 01:46:36 -07:00
parent 554054d3a1
commit 257050f749
20 changed files with 120 additions and 123 deletions
Download patch file Download diff file Expand all files Collapse all files

27
src/app/(main)/teams/[teamId]/TeamEditForm.tsx
View file

@ -5,9 +5,12 @@ import {
FormSubmitButton,
TextField,
Button,
IconLabel,
Row,
} from '@umami/react-zen';
import { getRandomChars } from '@/lib/generate';
import { useMessages, useTeam, useUpdateQuery } from '@/components/hooks';
import { RefreshCw } from '@/components/icons';
const generateId = () => `team_${getRandomChars(16)}`;
@ -54,15 +57,25 @@ export function TeamEditForm({
<TextField isReadOnly={!allowEdit} />
</FormField>
{showAccessCode && (
<FormField name="accessCode" label={formatMessage(labels.accessCode)}>
<TextField isReadOnly allowCopy />
</FormField>
<Row alignItems="flex-end" gap>
<FormField
name="accessCode"
label={formatMessage(labels.accessCode)}
style={{ flex: 1 }}
>
<TextField isReadOnly allowCopy />
</FormField>
{allowEdit && (
<Button
onPress={() => setValue('accessCode', generateId(), { shouldDirty: true })}
>
<IconLabel icon={<RefreshCw />} label={formatMessage(labels.regenerate)} />
</Button>
)}
</Row>
)}
{allowEdit && (
<FormButtons justifyContent="space-between">
<Button onPress={() => setValue('accessCode', generateId(), { shouldDirty: true })}>
{formatMessage(labels.regenerate)}
</Button>
<FormButtons justifyContent="flex-end">
<FormSubmitButton variant="primary" isPending={isPending}>
{formatMessage(labels.save)}
</FormSubmitButton>

47
src/app/(main)/teams/[teamId]/TeamSettings.tsx
View file

@ -1,8 +1,7 @@
import Link from 'next/link';
import { Column, Icon, Text, Row } from '@umami/react-zen';
import { useLoginQuery, useMessages, useNavigation, useTeam } from '@/components/hooks';
import { Column } from '@umami/react-zen';
import { useLoginQuery, useNavigation, useTeam } from '@/components/hooks';
import { ROLES } from '@/lib/constants';
import { Users, ArrowRight } from '@/components/icons';
import { Users } from '@/components/icons';
import { TeamLeaveButton } from '@/app/(main)/teams/TeamLeaveButton';
import { TeamManage } from './TeamManage';
import { TeamEditForm } from './TeamEditForm';
@ -13,7 +12,6 @@ import { Panel } from '@/components/common/Panel';
export function TeamSettings({ teamId }: { teamId: string }) {
const team: any = useTeam();
const { user } = useLoginQuery();
const { formatMessage, labels } = useMessages();
const { pathname } = useNavigation();
const isAdmin = pathname.includes('/admin');
@ -31,32 +29,21 @@ export function TeamSettings({ teamId }: { teamId: string }) {
user.role !== ROLES.viewOnly);
return (
<>
<Link href="/settings/teams">
<Row marginTop="2" alignItems="center" gap>
<Icon rotate={180}>
<ArrowRight />
</Icon>
<Text>{formatMessage(labels.teams)}</Text>
</Row>
</Link>
<Column gap="6">
<PageHeader title={team?.name} icon={<Users />}>
{!isTeamOwner && !isAdmin && <TeamLeaveButton teamId={team.id} teamName={team.name} />}
</PageHeader>
<Column gap="6">
<PageHeader title={team?.name} icon={<Users />}>
{!isTeamOwner && !isAdmin && <TeamLeaveButton teamId={team.id} teamName={team.name} />}
</PageHeader>
<Panel>
<TeamEditForm teamId={teamId} allowEdit={canEdit} showAccessCode={canEdit} />
</Panel>
<Panel>
<TeamMembersDataTable teamId={teamId} allowEdit={canEdit} />
</Panel>
{isTeamOwner && (
<Panel>
<TeamEditForm teamId={teamId} allowEdit={canEdit} showAccessCode={canEdit} />
<TeamManage teamId={teamId} />
</Panel>
<Panel>
<TeamMembersDataTable teamId={teamId} allowEdit={canEdit} />
</Panel>
{isTeamOwner && (
<Panel>
<TeamManage teamId={teamId} />
</Panel>
)}
</Column>
</>
)}
</Column>
);
}