sam/fullstack-fuware
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added house function: add, update, view (admin function)

Browse Source 
update npm package
This commit is contained in:
Sam Liu
2026-02-05 21:10:45 +07:00
parent 018f693998
commit 7b14b30320
104 changed files with 3447 additions and 2518 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
src/components/user/add-new-user-dialog.tsx
View File

@@ -1,9 +1,9 @@
import usePreventAutoFocus from '@/hooks/use-prevent-auto-focus';
import { m } from '@/paraglide/messages';
import AdminCreateUserForm from '@form/user/admin-create-user-form';
import useHasPermission from '@hooks/use-has-permission';
import usePreventAutoFocus from '@hooks/use-prevent-auto-focus';
import { m } from '@paraglide/messages';
import { PlusIcon } from '@phosphor-icons/react';
import { useState } from 'react';
import AdminCreateUserForm from '../form/admin-create-user-form';
import { Button } from '../ui/button';
import { Button } from '@ui/button';
import {
Dialog,
DialogContent,
@@ -11,38 +11,46 @@ import {
DialogHeader,
DialogTitle,
DialogTrigger,
} from '../ui/dialog';
} from '@ui/dialog';
import { useState } from 'react';
const AddNewUserButton = () => {
const { hasPermission, isLoading } = useHasPermission('user', 'create');
const [_open, _setOpen] = useState(false);
const prevent = usePreventAutoFocus();
return (
<Dialog open={_open} onOpenChange={_setOpen}>
<DialogTrigger asChild>
<Button type="button" variant="default">
<PlusIcon />
{m.nav_add_new()}
</Button>
</DialogTrigger>
<DialogContent
className="max-w-80 xl:max-w-xl"
{...prevent}
onPointerDownOutside={(e) => e.preventDefault()}
>
<DialogHeader>
<DialogTitle className="flex items-center gap-3 text-lg font-bold text-primary">
<PlusIcon size={16} />
if (isLoading) return null;
if (hasPermission) {
return (
<Dialog open={_open} onOpenChange={_setOpen}>
<DialogTrigger asChild>
<Button type="button" variant="default">
<PlusIcon />
{m.nav_add_new()}
</DialogTitle>
<DialogDescription className="sr-only">
{m.nav_add_new()}
</DialogDescription>
</DialogHeader>
<AdminCreateUserForm onSubmit={_setOpen} />
</DialogContent>
</Dialog>
);
</Button>
</DialogTrigger>
<DialogContent
className="max-w-80 xl:max-w-xl"
{...prevent}
onPointerDownOutside={(e) => e.preventDefault()}
>
<DialogHeader>
<DialogTitle className="flex items-center gap-3 text-lg font-bold text-primary">
<PlusIcon size={16} />
{m.nav_add_new()}
</DialogTitle>
<DialogDescription className="sr-only">
{m.nav_add_new()}
</DialogDescription>
</DialogHeader>
<AdminCreateUserForm onSubmit={_setOpen} />
</DialogContent>
</Dialog>
);
}
return null;
};
export default AddNewUserButton;

30
src/components/user/ban-user-confirm-dialog.tsx
View File

@@ -1,14 +1,11 @@
import usePreventAutoFocus from '@/hooks/use-prevent-auto-focus';
import { m } from '@/paraglide/messages';
import { usersQueries } from '@/service/queries';
import { banUser } from '@/service/user.api';
import { ReturnError } from '@/types/common';
import usePreventAutoFocus from '@hooks/use-prevent-auto-focus';
import { m } from '@paraglide/messages';
import { ShieldWarningIcon } from '@phosphor-icons/react';
import { usersQueries } from '@service/queries';
import { banUser } from '@service/user.api';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { UserWithRole } from 'better-auth/plugins';
import { toast } from 'sonner';
import DisplayBreakLineMessage from '../DisplayBreakLineMessage';
import { Button } from '../ui/button';
import { Button } from '@ui/button';
import {
Dialog,
DialogClose,
@@ -17,7 +14,10 @@ import {
DialogFooter,
DialogHeader,
DialogTitle,
} from '../ui/dialog';
} from '@ui/dialog';
import { UserWithRole } from 'better-auth/plugins';
import { toast } from 'sonner';
import DisplayBreakLineMessage from '../DisplayBreakLineMessage';
import { useBanContext } from './ban-user-dialog';
type BanConfirmProps = {
@@ -42,7 +42,10 @@ const BanUserConfirm = ({ data }: BanConfirmProps) => {
},
onError: (error: ReturnError) => {
console.error(error);
toast.error(m.backend_message({ code: error.code }), {
const code = error.code as Parameters<
typeof m.backend_message
>[0]['code'];
toast.error(m.backend_message({ code }), {
richColors: true,
});
},
@@ -58,6 +61,7 @@ const BanUserConfirm = ({ data }: BanConfirmProps) => {
showCloseButton={false}
{...prevent}
onPointerDownOutside={(e) => e.preventDefault()}
onEscapeKeyDown={(e) => e.preventDefault()}
>
<DialogHeader>
<DialogTitle className="flex items-center gap-3 text-lg font-bold text-red-500">
@@ -77,7 +81,11 @@ const BanUserConfirm = ({ data }: BanConfirmProps) => {
})}
{m.users_page_ui_dialog_alert_description_2({
reason: submitData.banReason,
exp: m.exp_time({ time: submitData.banExp }),
exp: m.exp_time({
time: submitData.banExp.toString() as Parameters<
typeof m.exp_time
>[0]['time'],
}),
})}
</DisplayBreakLineMessage>
<DialogFooter className="bg-muted/50 -mx-4 -mb-4 rounded-b-xl border-t p-4">

20
src/components/user/ban-user-dialog.tsx
View File

@@ -1,12 +1,10 @@
import useHasPermission from '@/hooks/use-has-permission';
import usePreventAutoFocus from '@/hooks/use-prevent-auto-focus';
import { m } from '@/paraglide/messages';
import BanUserForm from '@form/user/admin-ban-user-form';
import useHasPermission from '@hooks/use-has-permission';
import usePreventAutoFocus from '@hooks/use-prevent-auto-focus';
import { m } from '@paraglide/messages';
import { LockIcon } from '@phosphor-icons/react';
import { useRouteContext } from '@tanstack/react-router';
import { UserWithRole } from 'better-auth/plugins';
import { createContext, useContext, useState } from 'react';
import BanUserForm from '../form/admin-ban-user-form';
import { Button } from '../ui/button';
import { Button } from '@ui/button';
import {
Dialog,
DialogContent,
@@ -14,9 +12,11 @@ import {
DialogHeader,
DialogTitle,
DialogTrigger,
} from '../ui/dialog';
import { Label } from '../ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';
} from '@ui/dialog';
import { Label } from '@ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '@ui/tooltip';
import { UserWithRole } from 'better-auth/plugins';
import { createContext, useContext, useState } from 'react';
import BanUserConfirm from './ban-user-confirm-dialog';
type ChangeUserStatusProps = {

20
src/components/user/change-role-dialog.tsx
View File

@@ -1,11 +1,9 @@
import useHasPermission from '@/hooks/use-has-permission';
import usePreventAutoFocus from '@/hooks/use-prevent-auto-focus';
import { m } from '@/paraglide/messages';
import AdminSetUserRoleForm from '@form/user/admin-set-user-role-form';
import useHasPermission from '@hooks/use-has-permission';
import usePreventAutoFocus from '@hooks/use-prevent-auto-focus';
import { m } from '@paraglide/messages';
import { UserGearIcon } from '@phosphor-icons/react';
import { UserWithRole } from 'better-auth/plugins';
import { useState } from 'react';
import AdminSetUserRoleForm from '../form/admin-set-user-role-form';
import { Button } from '../ui/button';
import { Button } from '@ui/button';
import {
Dialog,
DialogContent,
@@ -13,9 +11,11 @@ import {
DialogHeader,
DialogTitle,
DialogTrigger,
} from '../ui/dialog';
import { Label } from '../ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';
} from '@ui/dialog';
import { Label } from '@ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '@ui/tooltip';
import { UserWithRole } from 'better-auth/plugins';
import { useState } from 'react';
type SetRoleProps = {
data: UserWithRole;

20
src/components/user/edit-user-dialog.tsx
View File

@@ -1,11 +1,9 @@
import useHasPermission from '@/hooks/use-has-permission';
import usePreventAutoFocus from '@/hooks/use-prevent-auto-focus';
import { m } from '@/paraglide/messages';
import AdminUpdateUserInfoForm from '@form/user/admin-update-user-info-form';
import useHasPermission from '@hooks/use-has-permission';
import usePreventAutoFocus from '@hooks/use-prevent-auto-focus';
import { m } from '@paraglide/messages';
import { PenIcon } from '@phosphor-icons/react';
import { UserWithRole } from 'better-auth/plugins';
import { useState } from 'react';
import AdminUpdateUserInfoForm from '../form/admin-update-user-info-form';
import { Button } from '../ui/button';
import { Button } from '@ui/button';
import {
Dialog,
DialogContent,
@@ -13,9 +11,11 @@ import {
DialogHeader,
DialogTitle,
DialogTrigger,
} from '../ui/dialog';
import { Label } from '../ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';
} from '@ui/dialog';
import { Label } from '@ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '@ui/tooltip';
import { UserWithRole } from 'better-auth/plugins';
import { useState } from 'react';
type EditUserProps = {
data: UserWithRole;

20
src/components/user/set-password-dialog.tsx
View File

@@ -1,11 +1,9 @@
import useHasPermission from '@/hooks/use-has-permission';
import usePreventAutoFocus from '@/hooks/use-prevent-auto-focus';
import { m } from '@/paraglide/messages';
import AdminSetPasswordForm from '@form/user/admin-set-password-form';
import useHasPermission from '@hooks/use-has-permission';
import usePreventAutoFocus from '@hooks/use-prevent-auto-focus';
import { m } from '@paraglide/messages';
import { KeyIcon } from '@phosphor-icons/react';
import { UserWithRole } from 'better-auth/plugins';
import { useState } from 'react';
import AdminSetPasswordForm from '../form/admin-set-password-form';
import { Button } from '../ui/button';
import { Button } from '@ui/button';
import {
Dialog,
DialogContent,
@@ -13,9 +11,11 @@ import {
DialogHeader,
DialogTitle,
DialogTrigger,
} from '../ui/dialog';
import { Label } from '../ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';
} from '@ui/dialog';
import { Label } from '@ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '@ui/tooltip';
import { UserWithRole } from 'better-auth/plugins';
import { useState } from 'react';
type UpdatePasswordProps = {
data: UserWithRole;

32
src/components/user/unban-user-dialog.tsx
View File

@@ -1,17 +1,13 @@
import useHasPermission from '@/hooks/use-has-permission';
import usePreventAutoFocus from '@/hooks/use-prevent-auto-focus';
import { m } from '@/paraglide/messages';
import { usersQueries } from '@/service/queries';
import { unbanUser } from '@/service/user.api';
import { ReturnError } from '@/types/common';
import useHasPermission from '@hooks/use-has-permission';
import usePreventAutoFocus from '@hooks/use-prevent-auto-focus';
import { m } from '@paraglide/messages';
import { LockOpenIcon, ShieldWarningIcon } from '@phosphor-icons/react';
import { usersQueries } from '@service/queries';
import { unbanUser } from '@service/user.api';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { useRouteContext } from '@tanstack/react-router';
import { UserWithRole } from 'better-auth/plugins';
import { useState } from 'react';
import { toast } from 'sonner';
import DisplayBreakLineMessage from '../DisplayBreakLineMessage';
import { Button } from '../ui/button';
import { Button } from '@ui/button';
import {
Dialog,
DialogClose,
@@ -21,9 +17,13 @@ import {
DialogHeader,
DialogTitle,
DialogTrigger,
} from '../ui/dialog';
import { Label } from '../ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '../ui/tooltip';
} from '@ui/dialog';
import { Label } from '@ui/label';
import { Tooltip, TooltipContent, TooltipTrigger } from '@ui/tooltip';
import { UserWithRole } from 'better-auth/plugins';
import { useState } from 'react';
import { toast } from 'sonner';
import DisplayBreakLineMessage from '../DisplayBreakLineMessage';
type UnbanUserProps = {
data: UserWithRole;
@@ -54,7 +54,10 @@ const UnbanUserAction = ({ data }: UnbanUserProps) => {
},
onError: (error: ReturnError) => {
console.error(error);
toast.error(m.backend_message({ code: error.code }), {
const code = error.code as Parameters<
typeof m.backend_message
>[0]['code'];
toast.error(m.backend_message({ code }), {
richColors: true,
});
},
@@ -91,6 +94,7 @@ const UnbanUserAction = ({ data }: UnbanUserProps) => {
showCloseButton={false}
{...prevent}
onPointerDownOutside={(e) => e.preventDefault()}
onEscapeKeyDown={(e) => e.preventDefault()}
>
<DialogHeader>
<DialogTitle className="flex items-center gap-3 text-lg font-bold text-green-500">

4
src/components/user/user-column.tsx
View File

@@ -1,7 +1,7 @@
import { m } from '@/paraglide/messages';
import { formatters } from '@/utils/formatters';
import { m } from '@paraglide/messages';
import { CheckCircleIcon, XCircleIcon } from '@phosphor-icons/react';
import { ColumnDef } from '@tanstack/react-table';
import { formatters } from '@utils/formatters';
import { UserWithRole } from 'better-auth/plugins';
import RoleBadge from '../avatar/role-badge';
import BanUserAction from './ban-user-dialog';