simple-module-users 0.0.1__py3-none-any.whl

users/pages/ResetPassword.tsx

@@ -0,0 +1,112 @@
+import { router, usePage } from '@inertiajs/react';
+import { Button } from '@simple-module-py/ui/components/ui/button';
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from '@simple-module-py/ui/components/ui/card';
+import { Input } from '@simple-module-py/ui/components/ui/input';
+import { Label } from '@simple-module-py/ui/components/ui/label';
+import { AuthCardShell } from '@simple-module-py/ui/layouts/AuthCardShell';
+import { useState } from 'react';
+
+interface Props {
+  token: string;
+}
+
+function ResetPassword() {
+  const { token: initialToken } = usePage<{ props: Props }>().props as unknown as Props;
+
+  // Prefer the token from the URL query string (deeplink); fall back to Inertia prop.
+  const urlToken =
+    typeof window !== 'undefined'
+      ? (new URLSearchParams(window.location.search).get('token') ?? '')
+      : '';
+  const token = urlToken || initialToken;
+
+  const [password, setPassword] = useState('');
+  const [confirm, setConfirm] = useState('');
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    setError(null);
+    if (password !== confirm) {
+      setError('Passwords do not match.');
+      return;
+    }
+    setLoading(true);
+    fetch('/api/users/auth/reset-password', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ token, password }),
+    })
+      .then(async (res) => {
+        if (res.status === 200 || res.status === 204) {
+          router.visit('/users/login');
+        } else {
+          const data = await res.json().catch(() => ({}));
+          const detail =
+            typeof data?.detail === 'string'
+              ? data.detail
+              : 'Reset failed. The link may have expired.';
+          setError(detail);
+        }
+      })
+      .catch(() => setError('An error occurred. Please try again.'))
+      .finally(() => setLoading(false));
+  };
+
+  return (
+    <AuthCardShell>
+      <Card className="w-full max-w-sm">
+        <CardHeader className="space-y-1">
+          <CardTitle className="text-2xl">Reset password</CardTitle>
+          <CardDescription>Choose a new password for your account</CardDescription>
+        </CardHeader>
+        <CardContent>
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <div className="space-y-2">
+              <Label htmlFor="password">New password</Label>
+              <Input
+                id="password"
+                type="password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                required
+                autoComplete="new-password"
+              />
+            </div>
+            <div className="space-y-2">
+              <Label htmlFor="confirm">Confirm password</Label>
+              <Input
+                id="confirm"
+                type="password"
+                value={confirm}
+                onChange={(e) => setConfirm(e.target.value)}
+                required
+                autoComplete="new-password"
+              />
+            </div>
+
+            {error && <p className="text-sm text-destructive">{error}</p>}
+
+            <Button type="submit" className="w-full" disabled={loading || !token}>
+              {loading ? 'Resetting…' : 'Reset password'}
+            </Button>
+          </form>
+          {!token && (
+            <p className="mt-2 text-sm text-destructive">
+              No reset token found. Please use the link from your email.
+            </p>
+          )}
+        </CardContent>
+      </Card>
+    </AuthCardShell>
+  );
+}
+
+export default ResetPassword;

users/pages/Users/Edit.tsx

@@ -0,0 +1,293 @@
+import { Link, router, usePage } from '@inertiajs/react';
+import { PageShell } from '@simple-module-py/ui/components/PageShell';
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  AlertDialogTrigger,
+} from '@simple-module-py/ui/components/ui/alert-dialog';
+import { Badge } from '@simple-module-py/ui/components/ui/badge';
+import { Button } from '@simple-module-py/ui/components/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@simple-module-py/ui/components/ui/card';
+import { Checkbox } from '@simple-module-py/ui/components/ui/checkbox';
+import { Label } from '@simple-module-py/ui/components/ui/label';
+import { AuthenticatedLayout } from '@simple-module-py/ui/layouts/AuthenticatedLayout';
+import { ShieldCheck } from 'lucide-react';
+import { useState } from 'react';
+import { toast } from 'sonner';
+
+interface UserListItem {
+  id: string;
+  email: string;
+  full_name: string | null;
+  is_active: boolean;
+  is_verified: boolean;
+  disabled_at: string | null;
+  last_login_at: string | null;
+  created_at: string | null;
+  roles: string[];
+}
+
+interface Role {
+  id: string;
+  name: string;
+}
+
+interface Props {
+  user: UserListItem;
+  roles: Role[];
+  has_permissions_module: boolean;
+}
+
+function fmt(dt: string | null): string {
+  if (!dt) return '—';
+  return new Date(dt).toLocaleString();
+}
+
+function Edit() {
+  const { user, roles, has_permissions_module } = usePage<{ props: Props }>()
+    .props as unknown as Props;
+
+  const [isActive, setIsActive] = useState(user.is_active);
+  const [isVerified, setIsVerified] = useState(user.is_verified);
+  const [selectedRoles, setSelectedRoles] = useState<string[]>(user.roles ?? []);
+  const [savingStatus, setSavingStatus] = useState(false);
+  const [savingRoles, setSavingRoles] = useState(false);
+  const [savingVerify, setSavingVerify] = useState(false);
+
+  const toggleRole = (roleName: string) => {
+    setSelectedRoles((prev) =>
+      prev.includes(roleName) ? prev.filter((r) => r !== roleName) : [...prev, roleName],
+    );
+  };
+
+  const disableAccount = () => {
+    setSavingStatus(true);
+    fetch(`/api/users/admin/${user.id}/disable`, { method: 'PATCH' })
+      .then(async (res) => {
+        if (res.ok) {
+          setIsActive(false);
+          toast.success('User disabled');
+        } else {
+          toast.error('Failed to disable user');
+        }
+      })
+      .catch(() => toast.error('An error occurred'))
+      .finally(() => setSavingStatus(false));
+  };
+
+  const enableAccount = () => {
+    setSavingStatus(true);
+    fetch(`/api/users/admin/${user.id}/enable`, { method: 'PATCH' })
+      .then(async (res) => {
+        if (res.ok) {
+          setIsActive(true);
+          toast.success('User enabled');
+        } else {
+          toast.error('Failed to enable user');
+        }
+      })
+      .catch(() => toast.error('An error occurred'))
+      .finally(() => setSavingStatus(false));
+  };
+
+  const handleSaveRoles = () => {
+    setSavingRoles(true);
+    fetch(`/api/users/admin/${user.id}/roles`, {
+      method: 'PUT',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ role_names: selectedRoles }),
+    })
+      .then(async (res) => {
+        if (res.ok) {
+          toast.success('Roles updated');
+        } else {
+          toast.error('Failed to update roles');
+        }
+      })
+      .catch(() => toast.error('An error occurred'))
+      .finally(() => setSavingRoles(false));
+  };
+
+  const copyResetLink = () => {
+    fetch(`/api/users/admin/${user.id}/reset-password-link`, { method: 'POST' })
+      .then(async (res) => {
+        if (res.ok) {
+          const data = await res.json();
+          await navigator.clipboard.writeText(data.link ?? data.url ?? '');
+          toast.success('Reset link copied to clipboard');
+        } else {
+          toast.error('Failed to generate reset link');
+        }
+      })
+      .catch(() => toast.error('An error occurred'));
+  };
+
+  const markVerified = () => {
+    setSavingVerify(true);
+    fetch(`/api/users/admin/${user.id}/verify`, { method: 'PATCH' })
+      .then(async (res) => {
+        if (res.ok) {
+          setIsVerified(true);
+          toast.success('User marked verified');
+        } else {
+          toast.error('Failed to mark verified');
+        }
+      })
+      .catch(() => toast.error('An error occurred'))
+      .finally(() => setSavingVerify(false));
+  };
+
+  return (
+    <PageShell
+      title={user.email}
+      description={user.full_name ?? 'Edit user account'}
+      actions={
+        <Button asChild variant="outline">
+          <Link href="/users/admin">Back to Users</Link>
+        </Button>
+      }
+    >
+      <div className="space-y-6 max-w-xl">
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-base">Metadata</CardTitle>
+          </CardHeader>
+          <CardContent className="grid grid-cols-[auto_1fr] gap-x-6 gap-y-2 text-sm">
+            <span className="text-muted-foreground">Created</span>
+            <span>{fmt(user.created_at)}</span>
+            <span className="text-muted-foreground">Last login</span>
+            <span>{user.last_login_at ? fmt(user.last_login_at) : 'Never'}</span>
+            <span className="text-muted-foreground">Disabled at</span>
+            <span>{fmt(user.disabled_at)}</span>
+            <span className="text-muted-foreground">Verified</span>
+            <span className="flex items-center gap-2">
+              {isVerified ? (
+                'Yes'
+              ) : (
+                <>
+                  No
+                  <Button
+                    size="sm"
+                    variant="outline"
+                    onClick={markVerified}
+                    disabled={savingVerify}
+                  >
+                    {savingVerify ? 'Saving…' : 'Mark verified'}
+                  </Button>
+                </>
+              )}
+            </span>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-base">Account status</CardTitle>
+          </CardHeader>
+          <CardContent className="space-y-4">
+            <div className="flex items-center gap-3">
+              <Badge variant={isActive ? 'secondary' : 'destructive'}>
+                {isActive ? 'Active' : 'Disabled'}
+              </Badge>
+            </div>
+            <div className="flex flex-wrap gap-2">
+              {isActive ? (
+                <AlertDialog>
+                  <AlertDialogTrigger asChild>
+                    <Button variant="destructive" size="sm" disabled={savingStatus}>
+                      {savingStatus ? 'Saving…' : 'Disable account'}
+                    </Button>
+                  </AlertDialogTrigger>
+                  <AlertDialogContent>
+                    <AlertDialogHeader>
+                      <AlertDialogTitle>Disable {user.email}?</AlertDialogTitle>
+                      <AlertDialogDescription>
+                        They won't be able to sign in until you re-enable the account.
+                      </AlertDialogDescription>
+                    </AlertDialogHeader>
+                    <AlertDialogFooter>
+                      <AlertDialogCancel>Cancel</AlertDialogCancel>
+                      <AlertDialogAction onClick={disableAccount}>Disable</AlertDialogAction>
+                    </AlertDialogFooter>
+                  </AlertDialogContent>
+                </AlertDialog>
+              ) : (
+                <Button size="sm" onClick={enableAccount} disabled={savingStatus}>
+                  {savingStatus ? 'Saving…' : 'Enable account'}
+                </Button>
+              )}
+              <AlertDialog>
+                <AlertDialogTrigger asChild>
+                  <Button variant="outline" size="sm">
+                    Copy reset-password link
+                  </Button>
+                </AlertDialogTrigger>
+                <AlertDialogContent>
+                  <AlertDialogHeader>
+                    <AlertDialogTitle>Generate reset link for {user.email}?</AlertDialogTitle>
+                    <AlertDialogDescription>
+                      A one-time password-reset URL will be copied to your clipboard.
+                    </AlertDialogDescription>
+                  </AlertDialogHeader>
+                  <AlertDialogFooter>
+                    <AlertDialogCancel>Cancel</AlertDialogCancel>
+                    <AlertDialogAction onClick={copyResetLink}>Generate</AlertDialogAction>
+                  </AlertDialogFooter>
+                </AlertDialogContent>
+              </AlertDialog>
+            </div>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader>
+            <CardTitle className="text-base">Roles</CardTitle>
+          </CardHeader>
+          <CardContent className="space-y-4">
+            <div className="flex flex-col gap-2">
+              {roles.map((role) => (
+                <div key={role.id} className="flex items-center gap-2">
+                  <Checkbox
+                    id={`role-${role.id}`}
+                    checked={selectedRoles.includes(role.name)}
+                    onCheckedChange={() => toggleRole(role.name)}
+                  />
+                  <Label htmlFor={`role-${role.id}`} className="cursor-pointer font-normal">
+                    {role.name}
+                  </Label>
+                </div>
+              ))}
+            </div>
+            <div className="flex gap-2">
+              <Button size="sm" onClick={handleSaveRoles} disabled={savingRoles}>
+                {savingRoles ? 'Saving…' : 'Save roles'}
+              </Button>
+              <Button size="sm" variant="ghost" onClick={() => router.reload()}>
+                Discard
+              </Button>
+            </div>
+          </CardContent>
+        </Card>
+
+        {has_permissions_module && (
+          <Link
+            href={`/permissions/users/${user.id}`}
+            className="inline-flex items-center gap-2 text-sm text-primary hover:underline"
+          >
+            <ShieldCheck className="size-4" />
+            Manage permissions →
+          </Link>
+        )}
+      </div>
+    </PageShell>
+  );
+}
+
+Edit.layout = (page: React.ReactNode) => <AuthenticatedLayout>{page}</AuthenticatedLayout>;
+export default Edit;